GitHub Actions + Vanilla JS Bootstrap + Azure Web App
Right then, this month, I am teaching deployment to my ongoing tutoring batches.
as always, I have a couple of ready to see demos, here.
GitHub - Jay-study-nildana/GitHubActionsBasics: GitHub Actions for first time learners with HTML…
GitHub Actions for static sites and vanilla JS. See the results here …
GitHub - Jay-study-nildana/P5JSForStudents: Contains my practice and teaching code related to P5.JS
P5 JS is one of those simple JS libraries that anybody can use. Here, I put some of my learnings for students to…
So, decided to blog it. First up, we need to create a brand-new GitHub repository. public or private, it should not matter.
Next, we go ahead and create a ‘workflow’ folder. it looks like, this.
now, inside that, you put something like this, in an yaml file. you can give whatever name you want. for example, ‘azure-staticwebapp.yml’.
now, that might too look intimidating, but, if you simply read it, line by line, patiently, it actually makes a whole lot of sense.
In a nutshell, you see a whole bunch of automation that replaces the number of steps you might do by hand, when deploying a static site.
Here, the main, item, is.
You need to arrange for it, in the settings of your GitHub repository.
Obviously, you need to get this secret from Azure Web App. How to get that token? well, I refer you, to the following article.
Reset deployment tokens in Azure Static Web Apps
When you create a new Azure Static Web Apps site, Azure generates a token used to identify the application during…
After that, just go ahead and do the usual things.
- create a branch. (optional)
- pull request and merge code to main branch (if you worked on separate branch).
- make changes and commit the changes.
In all these scenarios, GitHub Actions will be triggered and you can see the app being deployed in the ‘Actions’ section of your repository. Simple.
And, that’s actually it. These days, it’s very simple.
I work as a full-time freelance coding tutor. Hire me at UpWork or Fiverr or Stack Overflow or GitHub. see my personal website. see my photography art hobby at Behance and Unsplash and ArtStation. Also, podcast about life. podcast about movies. and Twitch. and YouTube Channel. If you are a student, join my discord server.