Hello Gatsby

The first post on this site was written on July 27th, 2004. Wow, nearly 14 years ago. I believe it was written on Scott Watermasysk’s .Text platform, at least that is the first blogging platform I remember running for real. I eventually followed the upgrade path to and through several versions of Telligent’s Community Server while I was an employee and huge fan. When Telligent released Graffiti CMS I quickly moved to that and have been happily letting it run quietly and surely since then. But Graffiti is quite long in the tooth, I do not feel like reviving it, and I would rather work in Node/React.

Alas the time has come. Goodbye Graffiti, thank you for loyally serving me so well the last seven or so years. Your contributions will not be forgotten.

What now?

This blog is now running on Gatsby. I stumbled upon a mention of GatsbyJS a few weeks ago and took a few minutes to check it out. The more I read about it the more I liked. Modern web tech… check; scales well… check; Node… check; React… check; GraphQL… cool; blazing fast… Excellent! But it is a “static” site generator and I need a dynamic data-driven platform for my blog… or so I thought. I read about how Gatsby generates pages from Markdown files and then about how it can also use other data sources like Wordpress or a CMS. My immediate thought was that if it could pull in data from any other type of data source then it ought to be able to pull in posts from my old Graffiti Sql Server database. After viewing some of the demo sites for the Gatsby Starter Kits, I studied the list of Gatsby Plugins but sadly did not find anything that was exactly what I needed, even though I did not expect to. Not to be disuaded I installed the CLI, installed a basic starter kit and set about figuring how to bend it to my will. I spent some time looking at other source plugins and the documentation for building one. Then I set about writing a plugin to pull data from my Graffiti database, my first Gatsby plugin: gatsby-source-graffiti-sqlserver (more details on this in a later post). After I got that working I installed some additional plugins and tailored the site to my liking. 

Some of the plugins, packages and the starter kit I used include: 

• Gatsby Lumen starter kit
• gatsby-plugin-no-sourcemaps which greatly reduced the size of the deployable code
• gatsby-plugin-favicon
• gatsby-plugin-feed to generate RSS feed
• gatsby-plugin-sitemap to generate sitemap.xml 
• gatsby-plugin-google-analytics
• gatsby-pagination for paging blog posts on the category and tags pages (more details on this later too)
• ElasticLunr Search plugin for Gatsby (more details on this in a later post as well)
• react-disqus-comments for Disqus
• react-twitter-widgets for the Twitter feed on the home page
• react-share for the social share buttons on the bottom of the post pages
• the Gatsby SEO component borrowed from a couple of other starter kits
• and lots of the basic stuff used by many of the starter kits like react-helmet, catch links, SASS, offline, Google fonts, etc.

As mentioned above I plan to dive into more detail on some of the implementation details in upcoming posts. So far I really like working with Gatsby and I have been having a lot of fun. Have you looked at or worked with Gatsby yet? If so, have you built anything cool? What have your experiences been? Let me know through the comments below or give me a shout at @danhounshell on Twitter.