This tutorial is now outdated. If you want to stay up to date with the MEAN Stack you will want to check out this Complete Guide instead.

How to integrate open source projects with MEAN.

We are told not to reinvent the wheel, and sometimes that is the right advice to take. Why go and create something that already exists? For this project, I wanted to create a blog in markdown and be able to post blogs about my goals and my progress, but like most things by the time I finish my blogging part of the application the year would be over! I decided to KISS and bite the bullet and find an open source project that had those implementations already baked in. Since node applications are still relatively new there is no mature projects, but there are a few blogging projects that caught my eye hexo and ghost. Both of this projects have some similarity but yet are different blogging platforms.

The main differentiation between both of this blogging platforms is that one want’s you to physically have .md files on the server and the other works with a data store to store the content of those files and then reads them in dynamically. I decided for my use case ghost would be the best option, since I am planning on traveling this year and I don’t necessarily want to pull up an SSH connection every-time I want to write a blog post. With this in mind, they offer a hosted solution for those that are interested in it, you can find out more about it here if you want to give it a try before getting too committed give it a try.

Tackling Authentication

Ideally what I would like to be able to authenticate with my MEAN credentials and be able to blog that way, but according to the documentation token authentication is still under development at this time of writing. So like most projects you have to improvise and work with what you got. I decided to set up ghost at blog.knowrick.com and have a custom angular application pull posts from that subdomain, this would look something like this.

Now the reason why opted out of modifying the core of the application to make it work with my MEAN application was due to the fact that I would like to continue to run updates on the blogging platform and be able to follow the progress of the project and maybe even contribute.

If you never deployed a ghost blog before the instructions are straightforward for deployment and installation on linux. For my deployment machine, I decided to go with Digital Ocean because of there is to use application for creating virtual machines, if you never used Digital ocean you can get a $10 dollar credit right here and give it a try.

Taking care of auth with tokens

Since the application is going to be using the JSON that ghosts outputs, I kept running into this issue on the client side.

I decided that authenticating and pulling content this way would not work out without doing some heavy notifications to MEAN and setup CORS, so I moved over my authenticating code back to the server and used this really handy package request which allows me to make HTTP calls with ease, you can set it up on your project by running.

Now that you have that package installed, it’s straightforward to implement the requests to the server. I did run into some callback hell, but I just separated some of the concerns to more requests. The code to fetch blog posts would be something like this.

If you can see from the above code config.blog.key is actually being pulled from config/env pretty sweet if you ask me, I did not have to do anything from my side besides calling the package, thank you MEAN.IO team.

Creating static pages with MEAN

The last remaining part of our application is email, now you must be saying email and node.js? Yep! If you are not a professional in UNIX socket programming and using the SMPT protocol, I would recommend you to go and check out mail gun, if you never used MailGun before it’s a nice tool that allows developers to quickly get up and going with email. Now the last part to use some abstraction to make this contact form even easier to create check out the handy node package nodemailer-mailgun-transport, and now with a couple of lines of code, you will have a contact form ready to go.

That’s it for the application we are done!

Not really, we are never done. In part 6 will cover Linux init.d scripts and setting up node.js with an SSL certificate and moving over our code into production.

Till next time,

Rick H.