KEMBAR78
The JAMStack (Javascript, APIs, Markup). | PPTX
The JAMStack
A talk by Michael Brooks
<https://michaelbrooks.dev>
What is the JAMStack
JAMstack is a new way of building websites and
apps that delivers better performance, higher
security, lower cost of scaling, and a better
developer experience.
It's a modern web development architecture
based on client-side JavaScript, reusable APIs, and
prebuilt Markup.
1. Benefits
➔ Better Performance
➔ Higher Security
➔ Cheaper, Easier Scaling
➔ Better Developer Experience
Which languages can we
use with the JAMStack?
Many languages!
Python! Ruby! Node! JS! HTML!
Where can I host my site?
Anywhere!
How do I deploy my
website?
Through Github (Or any
flavour of Git)!
Simple.
Tell Netlify where your build pages will
be created and which command to run
in order to build your website.
The rest is handled by Netlify.
Every time you push, Netlify
will automatically deploy.
I’m Michael Brooks
and you’ve been
breathtaking!
Twitter: @mike_d_brooks
Personal website: https://michaelbrooks.co.uk
Freelance website: https://michaelbrooks.dev

The JAMStack (Javascript, APIs, Markup).

  • 1.
    The JAMStack A talkby Michael Brooks <https://michaelbrooks.dev>
  • 2.
    What is theJAMStack JAMstack is a new way of building websites and apps that delivers better performance, higher security, lower cost of scaling, and a better developer experience. It's a modern web development architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup.
  • 3.
    1. Benefits ➔ BetterPerformance ➔ Higher Security ➔ Cheaper, Easier Scaling ➔ Better Developer Experience
  • 4.
    Which languages canwe use with the JAMStack? Many languages! Python! Ruby! Node! JS! HTML!
  • 5.
    Where can Ihost my site? Anywhere!
  • 6.
    How do Ideploy my website? Through Github (Or any flavour of Git)!
  • 7.
    Simple. Tell Netlify whereyour build pages will be created and which command to run in order to build your website. The rest is handled by Netlify.
  • 9.
    Every time youpush, Netlify will automatically deploy.
  • 10.
    I’m Michael Brooks andyou’ve been breathtaking! Twitter: @mike_d_brooks Personal website: https://michaelbrooks.co.uk Freelance website: https://michaelbrooks.dev

Editor's Notes

  • #3 The JAMStack is a new way of building the frontend for your websites. It’s cheap, reliable and more secure then hosting on a traditional server. It’s a modern web development architecture based on Javascript, APIs and prebuilt Markup.
  • #4 What are the benefits of the JAMStack? Better performance, higher security, cheaper, easier scaling and a better development experience.
  • #5 There are so many static site generators out there, if you can find one in your language then that’s JAMStack. The most popular languages are Python (MKDocs and Pelican), Ruby (Jekyll, Middleman and Metalsmith), NodeJS (Gatsby, Hugo VuePress and Gridsome) and many more. You can also create your own static website with JavaScript, HTML and CSS or run with your usual React or VueJS project just as long as there’s no server-side rendering.
  • #6 You could host it on your own server or with AWS or DigitalOcean and run your own Continious Integration services, but that kind of defeats the purpose. You can even run it on S3 or Google Cloud Storage which would be more beneficial, but I personally think two of the best hosting sites are Netlify and GitHub Pages because you can hook it up with your favourite git client and literally push-to-deploy.
  • #7 You’ve made your new website locally and you’re ready to deploy, but how do you deploy that to your host? By using Github or your favourite git client. There is however a small setup required in order to tell the host how to setup your website. For this example, I will use Netlify which calls it a TOML file.
  • #8 This basically says “on build you can create and find my generated files in the pages directory and to build this website, you should run “npm run docs:build”. Your directory and command might be different depending on what you use. However, Netlify comes with Ruby, PHP, Python and NodeJS so it should be able to handle most build commands. It will also install any packages or modules which your website requires based on your package manager’s .lock file.
  • #9 You then push your code to your git client, sign into Netlify and tell Netlify which repository you want to use in order to create your new website.
  • #10 Once you have done this, it will begin a build process. When the build is successful, every time you push to your client, it will automatically any updates. It will even deploy all pull requests so you can preview PRs without having to pull locally. This is all done through different subdomain urls and won’t affect your live site at all.
  • #11 I hope you enjoyed my talk on the JAMStack and if you have any questions, then please feel free to ask.