First Blog Post
31 October 2019 |frontendgatsbyjscss
Hi. This is actually my first blog post. This blog is made using GatsbyJS.
A static site generator. Modern web tech without the headache Enjoy the power of the latest web technologies – React.js , Webpack , modern JavaScript and CSS and more — all set up and waiting for you to start building.
What is GatsbyJS
Gatsby is a React-based, GraphQL powered, static site generator. What does that even mean? Well, it weaves together the best parts of React, webpack, react-router, GraphQL, and other front-end tools in to one very enjoyable developer experience. Don’t get hung up on the moniker ‘static site generator’. That term has been around for a while, but Gatsby is far more like a modern front-end framework than a static site generator of old.
It uses powerful preconfiguration to build a website that uses only static files for incredibly fast page loads, service workers, code splitting, server-side rendering, intelligent image loading, asset optimization, and data prefetching. All out of the box. I didn’t believe the speed until I tried it myself.
You code and develop your site, Gatsby transforms it into a directory with a single HTML file and your static assets. This folder is uploaded to your favorite hosting provider, and voila. Overall think, part Jekyll, part create-react-app.
What makes GatsbyJS Special?
You may be thinking, “I have a nice web pack config I use”, or “create-react-app works for me”, or “Jekyll is fine for my blog.” Well, I think there are three things that make Gatsby very special versus these other tools.
First, is the way Gatsby uses GraphQL to build it’s data layer. What do I mean by that? Gatsby is made to collect your data from wherever it may be: Markdown, JSON, your favorite CMS, third party APIs, anywhere! And at build time, it creates an internal GraphQL server of all of this data. So in your react components, all of your data is queried at build time from that same place, in the same way through GraphQL.
The second reason it’s special is the richness of the Gatsby ecosystem. Gatsby has not been around for too long, but already boasts great documentation, and a number of starters to help you get a site up quickly. That GraphQL data collection I mentioned before may sound intimidating, but due to Gatsby’s well-documented data source plugins, it can be as simple as a few lines of code in the config file.
Lastly, is its dedication to performance. Every aspect of performance and accessibility is a point of emphasis, and you can really feel that in the final product. More so than any boilerplate or generator I have come across, Gatsby lives up to the hype.
In a general sense, the world of powerful static site generator framework tools like Gatsby is growing stronger. I believe you will see more and more movement to tools like this for vast sections of website building. In many languages, not just in React, static site generators are being seen as a way to build the web of the future. Gatsby itself is built upon some of the fastest growing web technologies today: React, GraphQL, and webpack. I can’t repeat enough how much Gatsby is blast to build with, and I believe its future is very, very bright.