DEV Community

Marvin Danig
Marvin Danig

Posted on • Edited on

How to set up a simple jekyll blog near your rails app.

So your prototype is ready to go live and you need a blog to announce your upstart to the world.

Great!, but how do you do that?

…¯\(ツ)

It's so easy to set up a blog that you wouldn't want to miss all that "domain authority" on web for your fledgling company. Miss out on the SEO juices that come along with a subdirectory like this: /domain.com/blog?

IMO, if you're doing a tech startup it is important to wiggle a little harder and setup your own blog. Blog is how the search Gods will look at you, at minimum, instead of Medium.

The following guide will help you setup a simple Jekyll blog alongside your rails app but the process would essentially be the same no matter which stack (node, python, java or others) you're on.

This post assumes that you love ruby_on_rails like I do and have an application (startup?) alive at your own domain.com. And now, you need a blog at /blog url of domain.com to dent the world with your announcement post.

Dang!, you're at the right place at the right time right now, so read on…

Of course, we too made our announcement too using the same technique last week!


We wanted to have a blog for Bubblin Superbooks to release new features on and post updates to. We are on rails 5.2 and wanted our blog to reside on the same top_level_domain (https://bubblin.io/blog vs. blog.bubblin.io) as the main product itself. Why? Because SEO, if you missed it earlier.

There's a couple of ways of setting up a blog, and quite a few open source options (wordpress/ghost etc.) out there, but we decided on using Jekyll with markdown for the sake of simplicity.

Jekyll is rack based like all rails-apps generally are, and I really enjoy writing with markdown.

For the uninitiated, Jekyll is a simple blog-aware generator, so all we need to do is be able to publish it alongside our rails app online, via the public directory. The web-server will take care of the rest from there. Note the blog doesn't have to be coupled with the rails app itself, it just has to sit nearby, like a sibling, and work in a way similar to how static uploads do.

Let's look at the setup first.

Setup

Assuming that your startup (or rails app) is going to be called domain.com, in your terminal:


$ mkdir ~/projects/domain.com
$ cd ~/projects/domain.com
$ rails new domain.com          // your app may already exist. 

Enter fullscreen mode Exit fullscreen mode

Now that we have the rails app (~/project/domain.com/domain.com), let's go ahead and get our blog ready. As of writing this post jekyll requires you have at least Ruby 2.2.5 installed on your system, but for the latest instruction, check the Jekyll setup guide.

$ cd ~/projects/domain.com      // or cd .. if you're inside the rails app.
$ gem install bundler jekyll
$ jekyll new domain.blog
$ cd domain.blog && bundle install
Enter fullscreen mode Exit fullscreen mode

Go ahead and commit your blog to its own new repo:

$ git init && git add . -A
$ git commit -m "Setting up a jekyll blog on the side…"
$ git remote add origin git@github.com:username/domain.blog.git
$ git push -u origin master
Enter fullscreen mode Exit fullscreen mode

Once Jekyll finishes you'll have the blog at ~/project/domain.com/domain.blog and the Rails app at ~/project/domain.com/domain.com, like so:

➜ marvindanig-@bubblin in ~/projects/domain.com: $ ls

domain.blog domain.com

Enter fullscreen mode Exit fullscreen mode

Configuration

This is what our jekyll blog looks like:

➜  ls ~/project/domain.com/public/domain.blog
404.html      Gemfile.lock  _posts        bin           index.md
Gemfile       _config.yml   _site         contact.md
Enter fullscreen mode Exit fullscreen mode

Modify the baseurl option on _config.yml of your jekyll instance to point it to /blog.

baseurl: "/blog"            // the subpath of your site, e.g. /blog, /docs
Enter fullscreen mode Exit fullscreen mode

This is important so that assets load and link back properly. To ensure everything is working properly, start the Jekyll server and preview the blog on your browser. You can also apply a theme to your blog to match with your site's layout. We customized our Jekyll blog and open sourced our theme in form of a gem along with a guide to help you dip your fingers in quickly:

https://github.com/bookiza/bubblin-jekyll

(Simply fork it, replace logos and links and you're all set!)

Since we're hosting Bubblin on Linode I wanted to make sure that the public/ directory is committed properly. Remove 'public/' from .gitignore file if that is necessary to commit the directory. What we’ll be doing next is simply add a shared directory on our deployer recipe to tell rails where the requests to our blog will go. Thereon we can just build and rsync the Jekyll site to our blog directory on server. Easy peasy.

We're using Capistrano for build deployments so I added the "blog/" as a linked_directory on our deployer recipe:

➜ $ cd ~/project/domain.com/domain.com/config/        // In your rails/node/python app
➜ $ vi ~/project/domain.com/domain.com/config/deploy.rb
Enter fullscreen mode Exit fullscreen mode

Add public/blog to the following line:

set :linked_dirs, %w{public/blog log tmp/pids tmp/cache tmp/sockets vendor/bundle public/system}
Enter fullscreen mode Exit fullscreen mode

Exit vim with \wq!.

Publish

To publish we’ll use a two line deployer script that builds jekyll and rsyncs it to the public directory of our Rails application. If you don’t have rsync installed, you could use scp instead, or you’ll need to install one of these tools with your favorite package manager. Since I'm on mac, I use the Homebrew.

$ cd ~/project/domain.com/domain.blog/ && mkdir bin     // Create a `bin` dir here.
$ cd bin && touch deploy                // Note there is no dotfile extension on this script
$ vi deploy

Enter fullscreen mode Exit fullscreen mode

Add the following lines to it:

#! /bin/sh

jekyll build
rsync -va _site/ ../domain.com/public/domain.blog
# rsync -va _site/ deployer@domain.com:/var/www/domain.com/shared/public/blog   // Uncomment for production.


Enter fullscreen mode Exit fullscreen mode

Exit vim with \wq!. It’s a good idea to make it executable as well:

chmod +x ~/project/domain.com/domain.blog/bin/deploy
Enter fullscreen mode Exit fullscreen mode

At the root of your blog execute $ . bin/deploy, and you’ll see rsync run and put the Jekyll build inside your rails app's public/ directory.

Now you can work on the app and the blog independently without mixing dependencies.

That's how you setup a simple jekyll blog near your rails app. And all the best with your startup!


P.S.: Did you know Bubblin is to books, what Jekyll is to blogs?

A condensed version of this post appeared on The Bubblin Blog

Top comments (0)