# How to Get Started With JAMStack

Today I will be talking about JAMstack, why JAMstack, and how you can get started with JAMstack.


### What is JAMStack?

[Jamstack](https://jamstack.org/what-is-jamstack/) is an architecture designed to make the web faster, more secure, and easier to scale. It builds on many of the tools and workflows which developers love, and which bring maximum productivity.

The core principles of pre-rendering, and decoupling, enable sites and applications to be delivered with greater confidence and resilience than ever before.

[JAMstack](https://jamstack.org/what-is-jamstack/) is a software architecture and philosophy that adheres to the following components: Javascript, APIs, and Markup as the name imply “JAM”.


### Why JAMStack?

#### [Security](https://jamstack.org/why-jamstack/)
Serving pages and assets as pre-generated files allow read-only hosting reducing attack vectors even further. 

#### [Scale](https://jamstack.org/why-jamstack/)
When sites can be served entirely from a CDN there is no complex logic or workflow to determine what assets can be cached. 

#### [Performance](https://jamstack.org/why-jamstack/)
 Jamstack sites remove the need to generate page views on a server at request time by instead generating pages ahead of time during a build.

![thinking](https://media1.giphy.com/media/3ohhwMVcU7Y76xBwn6/giphy.gif)

No !!! 😊

#### [Maintainability](https://jamstack.org/why-jamstack/)
A pre-generated site, being served directly from a simple host or directly from a CDN does not need a team of experts to "keep the lights on".

#### [Portability](https://jamstack.org/why-jamstack/)
Jamstack sites are pre-generated. That means that you can host them from a wide variety of hosting services and have a greater ability to move them to your preferred host.

#### [Developer Experience](https://jamstack.org/why-jamstack/)
Jamstack sites can be built with a wide variety of tools. They do not depend on proprietary technologies or exotic and little known frameworks. Instead, they build on widely available tools and conventions. 

### What makes up JAMstack?

![thinking](https://31.media.tumblr.com/02bb849d05c6d344e18d777aeffe1e06/tumblr_mjh4uxNAkb1s14h9co1_500.gif)

![jam](https://www.freecodecamp.org/news/content/images/2020/02/jamstack-breakdown-3.jpg)

### OLD vs NEW Architecture

![vs](https://cdn.netlify.com/abc9d9b9f63fb1ccc81217aec9b19ea1c8e1b25b/cdc87/img/jamstack-architecture-2.jpg)

![you can do it](https://media3.giphy.com/media/Vccpm1O9gV1g4/giphy.gif)

of course, 😉 let's proceed.

### Static Site Generator

![you can do it](https://snipcart.com/media/204774/best-static-site-generator-2020.png)

### Headless CMS

![you can do it](https://cdn.cosmicjs.com/a30a1400-f845-11ea-8023-b50824df693d-top-headless-cms.jpg)

### SOME JAMStack SITES

[My Portfolio](https://idrisolubisi.com/)

[Free Code Camp](https://freecodecamp.org)

[JAMstack Site](https://jamstack.org)

![learn](https://i.kym-cdn.com/photos/images/newsfeed/001/491/584/1ae.gif)

## RESOURCES TO LEARN

Check out this awesome [Repo](https://github.com/Olanetsoft/awesome-jamstack-resources) for amazing resources to learn more.

Its open Source, Feel free to contribute 😊

Thank you.

you can also reach out to me on [Twitter](https://twitter.com/olanetsoft).