GatsbyJS - Overview
About Static Website Generator
Static website generator can generate static HTML offline, so they can be served with an HTTP server with dead simple configuration, or with Amazon AWS S3 or similar services.
There are quite a few open sourced tools out there, most of which convert Markdown or other formats to HTML files, using some shared layouts and stylesheets. Functionally they are similar, but I'd suggest you choose the one with underlying language/framework you are familiar with, so you can easily understand how it works and customize it if needed.
I'm choosing GatsbyJS because of React and GraphQL. Check Under the Hood page to learn about the alternatives I tried.
This design pattern is described as JAMstack: the frontend is now static (pre-generated) and distributed globally by CDN; it is neatly separated from the backend: the dynamic content is provided by backend through APIs.
Visit jamstack.org to learn more. Also Netlify has a great JAMstack page to explain the idea.
New nodes are added to Gatsby by “source” plugins. A common one that many Gatsby sites use is the Filesystem source plugin which turns files on disk into File nodes. Other source plugins pull data from external APIs such as the Drupal andHacker News
Transformer plugins can also create nodes by transforming source nodes into new types of nodes. It is very common when building Gatsby sites to install both source plugin(s) and transformer plugins.
Progressive Web App (PWA)
Install the 2 key plugins:
$ npm i gatsby-plugin-manifest gatsby-plugin-offline
$ gatsby build hangs after
- open file
- search for
- change from
- AWS S3
- Google Cloud Storage