This repo holds one of a series of examples of JAMstack sites from a freeCodeCamp video. The video, "Introduction to JAMstack" is available to view for free on freeCodeCamp.
The second of our 6 code examples, this example builds on example 1 to add some simplistic client-side JavaScript. Things are still very simple here, but we use this example to deploy an iteration to our hosting environment.
In the video, we show the pre-built, ready-to-serve assets to out hosting environment, using the drag and drop facility to create a new immutable deployment within Netlify. The video also introduces different types of rendering, explaining:
- Client-side rendering
- Server-side rendering (At request time)
- Server-side rendering (At build time)
To work on this example locally, you can clone the repository and simply start editing. There is no build step or any pre-requisites.
git clone https://github.com/philhawksworth/fcc-2-adding-js-for-simple-renderIf you wanted to quickly clone this repository and deploy it as a new site on Netlify you can click the button below for a rapid start.
For a better understanding of what this example is and why it exists, you can jump directly into the video at the point we are discussing this example
- Example 1 - All simply static
- Example 2 - Changing the DOM with JavaScript (👈 you are here)
- Example 3 - Introducing a static site generator
- Example 4 - Generating pages from a content API
- Example 5 - Generating localized pages, with geo-IP routing at the CDN
- Example 6 - Client-side rendering targeted API content
- jamstack.org - More info and resources
- Official JAMstack slack - conversation about JAMstack and web development (come on in!)
- Modern Web Development on the JAMstack, O'reilly, 2019 - Book on building JAMstack. Available as a free e-book.