The World's Greatest Netlify Demo v0

Note: this was published as the Complete Intro to Netlify on the FreeCodeCamp Channel

Hi everyone! I'm swyx and I'm happy to be sharing this walkthrough with you!

I learned Web Dev through FreeCodeCamp 3 years ago and back then I struggled a lot with getting my projects online, at first through Cloud9 and then Heroku. I only found Netlify a year later and realized that deploying and scaling is a lot easier with the JAMstack approach, especially with modern front-end frameworks like React and Vue. So this is the video series I wish I had when I started out!

How to Build Everything with Netlify in 4 hours

Part 1: πŸ—ΊοΈ Netlify Edge

Part 2: βš’οΈ Netlify Build

Part 3: πŸ‘©πŸΌβ€πŸ’» Netlify Dev

  • Netlify Dev
    • Docs
    • netlify dev (netlify.toml)
      • command
      • port
    • netlify dev (detector)
      • env vars
      • redirects
    • netlify dev --live (beta)
    • netlify functions:create
    • netlify functions:invoke
  • netlify-lambda
    • netlify-lambda install
    • netlify-lambda build

Part 4: πŸ—’οΈ Netlify Forms

  • Introducing Forms in plain HTML
  • File Uploads
  • Customize Post-Submit page
  • Slack/Email/Webhook Notifications
  • Zapier
  • submission-created
  • Spam Filtering
    • Akismet
    • Honeypot
    • Recaptcha
  • Forms in Single Page Apps
  • Forms in Gatsby
  • AJAX form submissions

Part 5: πŸ†” Netlify Identity

  • Before Identity: Password Protection and Role Based Access Control
  • Identity
    • Enable Netlify Identity
    • Identity on a boilerplate
    • Adding netlify-identity-widget
    • Important settings
      • open signup vs invite only
      • confirm vs don't confirm
      • External providers
      • Email templates
    • Metadata
      • User metadata
      • App metadata
    • gotrue-js and friends
      • gotrue
      • react-netlify-identity
      • react-netlify-identity-widget
      • gatsby-plugin-react-netlify-identity
    • Authenticated Functions: Identity + Functions
      • netlify functions:invoke
    • Event Triggered Functions
      • identity-validate: before sign up
      • identity-signup: on sign up
        • Note: this fires for only email+password signups, not for signups via external providers e.g. Google/GitHub
      • identity-login: on log in
    • Retrieving Netlify Form Info in Function
    • Paid features
      • Branded OAuth
      • SSO
      • Audit log
      • Custom sender

Part 6: ✍️ NetlifyCMS

Part 7: βž• Netlify Addons: Everything Else!

Part 8: 🍻 Netlify API

Part 9: ❓ Learn More