Modern Web Development on the JAMstack

Book Description

Learn how to run your web projects—everything from simple sites to complex applications—without a single server. It’s possible with the JAMstack, a modern web development architecture for deploying fast, highly-scalable sites and applications that don’t require traditional origin infrastructure. This practical report explains how the JAMstack delivers better performance, higher security, and lower cost of scaling than server-run web apps.

Based on client-side JavaScript, reusable APIs, and prebuilt Markup, the JAMstack sits at the center of several converging trends and technologies already being used to support today’s web projects. Authors Mathias Biilmann and Phil Hawksworth from Netlify demonstrate how the JAMstack drastically improves performance, increases reliability, and reduces the surface for attacks.

With this report, you’ll explore:

  • Methods for solving web development challenges—from bloated legacy architecture to managing microservices
  • Why the JAMstack’s cleaner architecture eliminates the need to scale sites up front
  • How separating the frontend from your build process makes maintenance easier
  • Best practices for adopting the JAMstack in your organization
  • A case study that examines how Smashing Magazine applied the JAMstack for commerce, authentication and membership, and publishing at scale

Table of Contents

  1. Introduction
    1. The JAM in JAMstack
    2. A Workflow for Productivity and Performance
    3. Version Control and Atomic Deploys
    4. Contributing on the JAMstack
    5. APIs to Process and Personalize
    6. Bringing It All Together: A Smashing Magazine Case Study
    7. Ready? Time to Get Our JAM Session Started
  2. 1. The Challenges of Modern Web Development
    1. The Drawbacks of Monolithic Architectures
      1. Limited Flexibility
      2. Performance Concerns
      3. Scaling Challenges
      4. Security Woes
    2. The Risk of Staying the Same
  3. 2. Introducing the JAMstack
    1. What’s in a Name?
    2. JavaScript
    3. APIs
    4. Markup
      1. Prebuilding Markup
    5. Types of JAMstack Projects
      1. HTML Content
      2. Content from a CMS
      3. Web Applications
      4. Large Web Properties
      5. Hybrid Experiences
    6. Summary
  4. 3. Advantages of the JAMstack
    1. Simplifying Systems and Simplifying Thinking
      1. Better Comprehension and Mental Agility
      2. You Don’t Need to Be an Expert at Everything
      3. Reduce Moving Parts at Runtime
    2. Costs
      1. Financial Costs
      2. Team Efficiency
      3. The Price of Innovation
    3. Scale
      1. Aping Static in Order to Scale
      2. Geography
      3. Redundancy
    4. Performance
      1. Where to Focus Optimization Efforts
      2. Only Turning the Gears When Necessary
    5. Security
      1. Reducing Surface Area
      2. Reducing Risk with Read-Only
      3. Outsourced or Abstracted Services
    6. For the Developer; for the Project; for the Win
  5. 4. Planning for the JAMstack
    1. Setting Up the Project
    2. Strategies for Managing Content
      1. Text Files
      2. Git-Based CMS
      3. Headless CMS
      4. Self-Hosted CMS
    3. Choosing a Site Generator
      1. One: The Type of Website
      2. Two: The Programming Language Used
      3. Three: The Templating Syntax
      4. Four: Speed
      5. Five: Developer Tooling
    4. Adding Automation
      1. Using GitHub Pages and GitLab Pages
      2. Using Your Own Infrastructure
      3. Using a Hosted Deployment Service
    5. Selecting a CDN
      1. Edge Locations
      2. Instant Updates
      3. Multiple Providers
    6. Providing Functionality: APIs
  6. 5. Shifting the Mental Model
    1. A Mindset and an Approach
    2. One: Get to the CDN
      1. Designing for the Best Use of a CDN
    3. Two: Design for Immutability and Atomic Deployments
      1. Confidence from Immutability
      2. The Advantages of Immutable Deployments
      3. Positioning for Immutable Deployments
      4. Atomic Deployments
    4. Three: Employ End-to-End Version Control
      1. Reducing the Cost of Onboarding
      2. Making Version Control the Backbone of Your Project
    5. Four: Automation and Tooling
      1. A Powerful Site-Generation Pattern
      2. Minimizing the Risk of Human Intervention
    6. Five: Embrace the Ecosystem
      1. Forms
      2. Search
      3. Notifications
      4. Identity
    7. Six: Bridging the Last Gaps with Functions as a Service
    8. Being Comfortable with Breaking the Monolith
  7. 6. Applying the JAMstack at Scale
    1. A Case Study: Smashing Magazine
    2. The Challenge
    3. Key Considerations
      1. Duplicated Templates
      2. Performance, Reliability, and Security
      3. Membership
    4. Picking the Right Tools
      1. Static Site Generator
      2. Asset Pipeline
      3. Frontend Framework
    5. Content Migration
    6. Utilizing Structured Content
    7. Working with Large Sites
    8. Building Out the Core
    9. Search
    10. Content Management
    11. Integrating Netlify CMS
    12. Listings, Search, and Assets: Customizing the CMS for Large Projects
    13. Identity, Users, and Roles
      1. JWTs and Stateless Authentication
    14. Ecommerce
      1. Identity and Orders
    15. Membership and Subscriptions
    16. Tying It Together: Member Discounts in GoCommerce
    17. Job Board and Event Tickets: AWS Lambda and Event-Based Webhooks
    18. Workflows and API Gateways
    19. Deploying and Managing Microservices
    20. Summary
  8. 7. Conclusion
    1. And One More Thing...

Product Information

  • Title: Modern Web Development on the JAMstack
  • Author(s): Mathias Biilmann
  • Release date: September 2019
  • Publisher(s): O'Reilly Media, Inc.
  • ISBN: 9781492058571