Share:
Posted on November 12, 2020
Gridsome makes it super easy for developers to build modern websites, apps, and PWAs. Using Vue.js, GraphQL, Node, and pretty much anything that's JavaScript. Gridsome allows for quick development and deployment of awesome JAMstack applications, not to mention SEO friendly and extremely fast ones.
In this "Getting Started" tutorial, we're going to go over many topics. They are:
- Understanding Static Site Generators
- Introduction to Gridsome
- The way Gridsome Works
- Prerequisite
- Installation
- Project Structure
- Plugins
- GraphQL data
- Layout Components
- Pages Components
- Deploying Sites
- Wrapping Up
Understanding Static Site Generators Once upon a time, the web was made up mostly of simple HTML sites. Maybe some CSS got sprinkled in to give a page some pizazz. That said, this Welcome to Netscape website that is still live from 1994 is an excellent reminder of what was once premium web content.
These simple sites were and still are, consider static sites. Simple HTML files that got returned to the browser by a server. None of the content was dynamic, as we now expect to see in even the most basic of today's web-apps and websites.
However, while static sites predate dinosaurs – in technological dog-years, of course – Static Site Generators are somewhat new and trendy. Essentially, Static Site Generators accomplish two things.
Give a developer compelling tools for building sites locally on their computer (hot-reloading, an app framework, etc.) Pre-builds the site as a set of static files before being deployed to the server By pre-building, the pages as static files, the deployed site are incredibly fast. Fast because no server-side rendering or massive javascript operations are needed to render the site's pages. With the recent trend and popularity in JAMstack applications (JavaScript, APIs, Markup), Static Site Generators are fulfilling the "J" requirement by creating highly performant and lean clients sites.
