The web apps gallery in Azure is awesome to get up and running quickly. But how do you continue to develop a site after it has been deployed?
Let's walk through the steps you need to perform, and the steps I tried to perform.
Create a new azure web app
Go to your azure portal and create a new web app from gallery.
Select the (outdated) Ghost template
Configure the app
Run the setup wizard after your app has been deployed by going to http://YOURWEBNAME.azurewebsites.net. In the case of ghost you will have to go to /ghost to trigger the setup wizard.
Now let's find a way to pull this website to your local machine by going to the dashboard in azure and selecting the "Set up deployment from source control" option from the webs dashboard.
Select "Local Git repository".
Wait a minute
If you have git-credential-winstore installed you will get a nice prompt that saves your credentials, otherwise it will just prompt you for them. If you forgot or haven't set up your credentials there is a "Reset your deployment credentials" link at the bottom of the previous page.
Enter credentials and here is the result
Now that we have a local copy, let's see if we can actually re-deploy the application back to azure without any trouble. Let's change something, commit it and push it back to Azure (which is now set as remote origin).
In my case, I decided to a theme to the \content\themes catalog and push that to Azure. I decided to try the velox theme.
Hmm, errors with npm. I wonder if that has to do with the fact that the node_modules directory is checked in to the repo. Kudu is supposed to handle npm on deploy and we won't have the exact same packages on local and remote. Let's correct this real quick.
First force remove the node_modules recursively with
rm -rf node_modules (if path is to long, just mode the
node_modules dir to C: and delete from there) and commit the deletions with
git add --all . && git commit -m "remove node modules from repo"
Then create a new file named .gitignore and paste the following into it
Commit that file with
git add .gitignore && git commit -m "Don't track node_modules and *.db"
Now let's try to remove the node_modules folder from Azure by opening up a powershell prompt in kudu at http://YOURWEB.scm.azurewebsites.net/.
Remove the node_modules directory with ps
Remove-Item site/wwwroot/node_modules -Recurse -Force. This will take a while, so go grab a cup of coffee/tea/water.
Another error! *sigh*
The sqlite3 package is apparently locked.
What happens if we restart our web and try to redeploy again?
It works! The deployment process have now handled the npm installation for us.
Now to be fair, it would probably have been enough to just ignore and remove the node_modules from our git repository, restart the web and redeploy. But I still wanted to show the actual debugging process since it's not super straightforward that a lock was left that prevented our deploy.
If we now check our themes on the newly deployed site we should be able to see the theme we added earlier
Success! Now let's verify that we can actually do another deploy by changing some things in the post template.
Note that ghost sometimes requires you to restart the web app in order for changes to themes to apply. But now when we go check out our post where we changed the rendering of the h1 tag to include our hardcoded message when a post background is set, we can see the changes.
There we have it. We can now try to do things like update the app we deployed from the azure web app gallery directly from git. Neat huh?
As usual, let me know in the comments if you find something strange or have something to add.
Subscribe to Cognit Dev Blog
Get the latest posts delivered right to your inbox