{"componentChunkName":"component---src-templates-post-jsx","path":"/blog/016-migrating-to-gatsby/","result":{"data":{"markdownRemark":{"html":"

Last weekend, I took some time to fully rebuild my personal blog from “scratch”.

\n

I tossed my Lektor site and rebuilt it with\nGatsbyJS, GraphQL and\nRebass. It took less than 10 hours to implement and deploy! That time was\nbroken into:

\n\n

Planning

\n

My original site (and the many incarnations of it before that) was a static site built around blog\nposts written in Markdown or reStructuredText. I would use different themes from HTML5\nUP and manually split out the files into templates, work with verbose\nstylesheets that someone else wrote, and would generally sink more time into maintaining my site\nthan actually writing blog posts. Lektor was great but I needed\nsomething more streamlined, and wanted something that was going to give me a more modern web\nexperience out of the box.

\n

Pain-Points To Alleviate:

\n\n

First-class Support For:

\n\n

Implementation

\n

I found a Gatsby starter by Ruben\nHarutyunyan that gave me an awesome starting place for almost\neverything I was looking for. I was especially happy to find a starter that was so fully featured,\nbut had very minimal pages and no styling or CSS frameworks included. It also uses\nGraphQL under the hood to retrieve blog post data, which is makes\ninteracting with post data really clean.

\n

I had to handle a couple of formatting differences from my previous Markdown files for my blog\nposts, but those were basically able to be dropped into the new site. I'm a huge fan of\nRebass and used all stock components for the UI.

\n

I was super impressed with the myriad of plugins/libraries available for Gastby. Things like\noffline support, uploading files to AWS, optimized image loading, and RSS feeds all have plugins\nthat sometimes complex tasks essentially plug-and-play.

\n

The only major issue that I encountered was that I needed to customize the blog post URL in order\nto make sure links from my previous blog were supported. Diving into how the blog slugs were\ndetermined and used took a little more time than I would have liked, but was still fairly\nlow-effort.

\n

My Next Steps

\n\n

Repositories

\n

The repo for my original Lektor site as well as my new site are on GitHub:

\n

GatsbyJS/GraphQL/Rebass repo: GitHub - emilyemorehouse/emilyemorehouse.com: Personal website,\nbuilt using Gatsby, Rebass, and GraphQL

\n

Original Lektor repo: GitHub - emilyemorehouse/emilyemorehouse.com-archive: Personal website,\nbuilt using Lektor

","timeToRead":3,"excerpt":"Last weekend, I took some time to fully rebuild my personal blog from “scratch”. I tossed my Lektor site and rebuilt it with\nGatsbyJS…","frontmatter":{"title":"Migrating My Blog to GatsbyJS in Less Than 10 Hours","cover":"https://images.unsplash.com/photo-1529220502050-f15e570c634e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80","date":"2019-02-20","category":"tech","tags":["javascript","gatsby"]},"fields":{"slug":"/blog/016-migrating-to-gatsby/","date":"2019-02-20T07:00:00.000Z"}}},"pageContext":{"slug":"/blog/016-migrating-to-gatsby/"}}}