Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

https://syntax.fm

subscribe
share



 

Practical: How would we build Airbnb, Twitter, or Reddit?


In this episode, Scott and Wes are trying something new! It’s called Practical, in which Scott and Wes take a topic and flesh out all the theory into something super practical. Today’s topic comes from a listener question asking how they would build a simple version of a modern web app like Twitter, Reddit, or Airbnb. Netlify - Sponsor Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up netlify.com/syntax for more info. Sanity - Sponsor Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax. Show Notes 3:03 - Backend

  • Express
  • Node
  • GraphQL
  • MongoDB
14:45 - Frontend
  • React
  • Next.js
  • Styled components
  • Stay as close to real CSS as possible
22:39 - Deployment process
  • Serverless
  • Now
  • Ideally one app that handles everything
28:38 - Email
  • Syntax Ep 32: Designing, Templating, Inlining and Sending Email
  • mjml
  • Juice
  • Inky
  • Nodemailer
  • Postmark
  • Mailjet
  • Mandrill
  • Get everyone set up and working in two different systems, so you can switch easily if something goes wrong
33:32 - Users / Auth / Cookies / Permissions
  • Use something a pre-existing package or service rather than role your own (though it can get expensive quickly)
  • Passport
  • Auth0
  • accounts-js
38:48 - Images
  • Cloudinary
  • imgIX
41:50 - Other things to be aware of
  • Handling cash
    • Stripe
    • PayPal
    • Braintree
    • Recurly
  • Queueing
Links
  • Ruby on Rails
  • Django
  • Meteor
  • MySQL
  • PHP
  • Postgres
  • Mongoose
  • Drip
  • ConvertKit
  • Feathers
  • David Luecke
  • Tweetdeck
  • Next.js
  • react-router
  • Reach Router
  • Gatsby
  • Digital Ocean
  • Heroku
  • Redux
  • Svelte
  • Gridsome
  • Mailchimp
××× SIIIIICK ××× PIIIICKS ×××
  • Scott: K-Safe
  • Wes: Bon Appetit YouTube Channel
Shameless Plugs
  • Scott: Svelte Course Coming Soon! - Sign up for the year and save 25%!
  • Wes: Flexbox.io Course
Tweet us your tasty treats!
  • Scott’s Instagram
  • LevelUpTutorials Instagram
  • Wes’ Instagram
  • Wes’ Twitter
  • Wes’ Facebook
  • Scott’s Twitter
  • Make sure to include @SyntaxFM in your tweets


share





 25 September 2019  51m