{"id":62165,"date":"2021-08-11T07:24:30","date_gmt":"2021-08-11T15:24:30","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/devops\/?p=62165"},"modified":"2021-08-09T07:42:30","modified_gmt":"2021-08-09T15:42:30","slug":"developer-best-practices-structuring-your-repository-for-static-web-apps","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/devops\/developer-best-practices-structuring-your-repository-for-static-web-apps\/","title":{"rendered":"Developer Best Practices – Structuring Your Repository for Static Web Apps"},"content":{"rendered":"

Developer Best Practices – YAML Exposure in your pipeline<\/h2>\n

As a good developer, I have my code in a repo, that doesn\u2019t necessarily mean that I have followed all of the best practices that I should. I can still expose myself to risks unknowingly.<\/p>\n

I\u2019ve been working with Azure Static Web Apps<\/a> for many months now, and they\u2019re awesome! Often in tutorials or getting started guides, we try to make the code and directions as easy as possible for anyone to be able to follow. While this is great for the community, sometimes while we make things easy to get started, but do not consider the impact it can have on the consumer. Meaning, I have deployed my Azure Static Web App, but exposed myself to what could a potential security risk for myself or my organization. In hindsight, we need to make sure our tutorials are fit for purpose and production.<\/p>\n

In the tutorial<\/a>, I have a very simple repo in Azure DevOps where I keep my code. I want to deploy my Azure Static Web App using a simple repository, which I walk you through in this tutorial. The tutorial is easy to follow and aims to get people started on their DevOps journey, so we really want to start with a simple version of code. Many will bring their own code, or maybe start with this super simple repo. In the tutorial I started with a very basic, vanilla build, if you will. I copied the repo, deployed my static web app and had a full CI\/CD pipeline up and running within minutes.<\/p>\n

\"Image<\/a><\/p>\n

As a developer, we should ALL<\/strong> care about security. We want to ‘shift left’ and implement security early. While nothing obvious sticks out, I don\u2019t have any exposed secrets in my YAML, I\u2019ve done all the things right. But wait.. I haven\u2019t. I dare you as the reader to look at my repo and see what I exposed? Find it yet?<\/p>\n

Answer:<\/em> I deployed my app from the root of the folder. When Azure DevOps created the pipeline and I wrote my YAML, it was also exposing all files in the root folder. I found that I can browse to that YAML file publicly. OOPS!<\/p>\n

\"Image<\/a><\/p>\n

While I have protected my secrets following all of the best practices, what if I hadn\u2019t? What if another developer in the team hadn\u2019t? We deployed our Azure Static Web App and could have potentially exposed critical information externally.<\/p>\n

How did I resolve this? I created a new folder named ‘src’, moved my application files to that folder, instead of the root folder. This is simple as a \u2018create a new folder\u2019 and copy\/paste the files.<\/p>\n

\"Image<\/a><\/p>\n

One last thing, I need to change my ‘azure-pipelines.yml’ file to find the correct folder of my app:<\/p>\n

\"Image<\/a><\/p>\n

My code gets checked in, the CI\/CD process runs and redeploys my app from the folders specified. I now can no longer access the YAML file from the root folder. I also opened up an issue on the repo that I used so that others don’t make the same mistake, even better than that, the owner of the repo has also updated the repo to fall in line with securing the files.<\/p>\n

Another way to do this would be to exclude files in the static web app pipeline task. While that currently isn\u2019t a feature, that should be coming soon. No matter what resources you are deploying in Azure, be aware of your repo configuration and start thinking about your external exposure and risks to your environment.<\/p>\n

If you want to get started learning via an interactive tutorial, check out one of the Microsoft Learn modules<\/a> for Azure Static Web Apps.<\/p>\n","protected":false},"excerpt":{"rendered":"

As developers, the structure of our repositories has an affect on how we write our code, but also how we secure our code. <\/p>\n","protected":false},"author":11848,"featured_media":45953,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[224,226,1,225],"tags":[],"class_list":["post-62165","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-azure","category-ci","category-devops","category-git"],"acf":[],"blog_post_summary":"

As developers, the structure of our repositories has an affect on how we write our code, but also how we secure our code. <\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/62165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/users\/11848"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/comments?post=62165"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/62165\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/media\/45953"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/media?parent=62165"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/categories?post=62165"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/tags?post=62165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}