How to Create a Ghost Blog on Microsoft Azure
Note: This Blog post is now deprecated. While I encourage you to use Ghost, Azure has since changed their system since the initial authoring of this post, and it is therefore no longer as relevant.
This past weekend, I successfully set up this blog with the help of a variety of sources, especially Cho S. Kim's blog post on the same topic mentioned here. This guide offers a modified and updated process based on the newer versions of Ghost with a few bug fixes.
Ghost can be installed directly through Microsoft Azure, but using the command line interface can offer a greater ability to customize it down the road. Following the installation, you should be able to update your blog simply by commiting and updating your repository. So let's get started:
Step 0: Install Node(if you haven't)
To set up ghost, you'll need to install Node.js. You can do this with a Homebrew command: $ brew install node or downloading it from their website. Also make sure that your npm is up to date if you already have node. For this process, I'm running Node-0.10.31.
You will likely also need homebrew, so make sure you have that installed.
Step 1: Fork the Ghost Repository
Recommended: Because a variety of changes are necessary to make the regular ghost repository play nice with Azure, I recommend forking my Azure-ready repository here. This repo is ready to go on Azure and requires no changes before this setup process. It also will not break due to unforeseen updates by the Ghost team.
Fork my repository to your own account.
clone your forked repo to your desktop:
$ cd ~/Desktop
$ git clone https://github.com/yourusername/GhostAzureSetup
Add an upstream remote to the repository:
$ cd GhostAzureSetup
$ git remote add upstream https://github.com/kmeurer/GhostAzureSetup
Step 2: Configure GhostAzureSetup for a Local Server
Next, we need to check to make sure Ghost runs properly on a local server. To do this, we need to run a few commands in our Ghost repository.
#
# Navigate to your locally stored copy of Ghost
#
$ cd ~/Desktop/GhostAzureSetup
# Checkout the branch 'stable'. This is where we'll deploy
$ git checkout stable
#
# Install grunt's command line interface to # use it-requires node/npm to work.
# You may also need to run these commands as
# root/administrator using sudo
#
$ sudo npm install -g grunt-cli
#
# Install all ghost dependencies.
# If you have issues here, make sure you
# are running a recent version of node.
# Again, you may have to use sudo here if it
# doesn't work.
#
$ npm install
OR
$ sudo npm install
#
# Run grunt for a development environment
#
$ grunt init
#
# Start a local server in development mode
#
npm start
Once you've done this, you should see something like this:
Plugging the address provided(127.0.0.1:2368) into a web browser will show you your blog up and running. It should look like this:
Hooray! The local server is running!
Step 3: Configure Microsoft Azure for your new Ghost Blog
Now that we know our files are all working well, we can head over to Azure and set up a website. Log into your Microsoft Azure Account Portal. Microsoft Azure is changing around to a different format, so you may be sent to a page that looks like this:
If that's the case, just click the Azure Portal button. You should end up on a page that looks like this:
At the bottom left of the page, click the button titled "NEW." On the next screen, choose Web Site, then Custom Create, as below:
On the next popup window, choose the name of your website, specify no database, and be sure to check the box titled "publish from source control."
Choose GitHub on the next page and then choose to deploy the GhostAzureSetup repository on the branch "stable."(remember to do all work on the stable branch)
Now, Azure will create the website on your behalf and sync it with your personal repository. That means every time you push to your repo, it will deploy to the site. It's pretty cool.
Two more things to do before we're done. Azure should take you to the homepage, where you now need to click on the website you just created. That should take you to a page that looks like this:
Now click on configure and scroll all the way down to "app settings." Set a second row key to "NODE_ENV" and the value to "production" as shown below:
Save your changes with the save button at the bottom of the page, and then navigate to your site's dashboard. On this page, you should look for a button along the right column titled "Reset Your Deployment Credentials." It's along the right side of the image below. (Note: there is a chance that it will show "set up deployment credentials instead." If this is the case, just do that, though it's not always essential).
After you enter your information, press submit and you're ready to go!
Step 4: Set up Ghost for Azure Deployment
Almost there! You'll have to go into the code and change a couple things here. Once again, make sure you're on the "stable" branch. $ git checkout stable
- Fix config.js
Navigate to your config.js file in the GhostAzureSetup directory. Here, you should change the production and development urls to the domain of your new azure website. In the repo, both are currently listed as "http://yourawesomewebsite.azurewebsites.net/"
After you've changed the values, your site will deploy in the right location.
2.Build for production
Next, you'll need to build your Ghost files for production. So just run this:
$ grunt prod
3.Push to GitHub
Our next step is to push our changes to git, which will be automatically deployed.
Note: Some have encountered an error here that is related to the core/built/scripts files when they run a git add. I've included a fix in the commands.
# add changes to staging area
$ git add --all
#
# If you receive an error related to the
# core/built files, run the following
# commands. Otherwise, skip to the commit.
#
#
# We need to convert our /core/built/scripts # files from dos2unix.
# To do so, we will use the dos2unix command.
# First, make sure you have the command installed. You can install it with
# homebrew as shown below. If you don't have
# homebrew installed, do the quick install
from their website
#
$ brew install dos2unix
#
# Now, lets move into our core/built/scripts library
#
$ cd core/built/scripts/
#
# Finally, we convert all script files in
# the library to unix-compatible
# adaptations. make sure you're in the
# right directory for this command
# (which you should be if you
# ran the last command).
#
$ find . -type f -exec dos2unix {} \;
# Now, make sure you're in the root of your ghost azure directory
$ cd ~/Desktop/GhostAzureSetup
# As before, we add all files
$ git add --all
#
# End of error fix.
#
# commit changes
$ git commit -m "Built Ghost for production"
# push changes to the stable branch of your repo
$ git push origin stable
If all is well, your azure website will automatically deploy. You can make sure the most recent version is deployed on Azure if you go to your website and click deployments. You should see your most recent commit message and Active Deployment in green.
Congrats, you've deployed your website! Now, head over to your domain and check it out (Note: it may be slow at first).
Step 5: Register for a Ghost Account on Your Website
Last step! After viewing your website at yourdomain.azurewebsites.net, head, over to the admin page. On ghost websites, this will be located at http://yourdomain.azurewebsites.net/ghost (Note: /admin also takes you there). On that page, register for a ghost account, and you're good to go! Ghost will walk you through it from there.
Congratulations! You're ready to blog. Just head over to '/ghost' whenever you want to write a post! Feel free to take a look at the optional Step 6 for things to do next.
Step 6: Get the most out of Ghost
Here are some ideas for what to do now:
- Read Ghost for Beginners
- Map a custom domain to your site
- Write your first post
- Install a theme other than the default Casper theme (Add it to your /content/themes folder and push the change)
- Fine-Tune/customize your theme
- Set up comments using Disqus
Good luck! If you have any questions, issues, or anything else, just shoot me a message or I'll answer questions in the comments below.