Topics include:

• What JavaScript looked like at Basecamp before Stimulus
• Why Basecamp chose to create a new framework instead of using React, Angular, or Vue
• How Basecamp uses server-rendered partials instead client-side templates
• Why David decided to start "On Writing Software Well"
• Evaluating patterns in practice and choosing between conflicting approaches
• Using concerns/mixins to organize classes with many features
• Applying resourceful routing to singular resources

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days
• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report

Links:

• Stimulus Homepage
• Stimulus on GitHub
• David's blog post introducing Stimulus
• Turbolinks
• Webpacker
• "Server-generated JavaScript Responses (SJR)" (2013)
• respond_to, returning multiple formats from the same Rails controller
• "On Writing Software Well" 
  • 1: Removing the need for code comments
  • 2: Using callbacks to manage auxiliary complexity
  • 3: Using globals when the price is right
  • 4: Not every model is backed by a database
  • 5: Testing without test damage or excessive isolation
• Basecamp's "Getting Real" YouTube channel

Topics include:

• Using animation to make interfaces easier to use
• The difference between animations and transitions
• When to use CSS animations vs. JavaScript animations
• Which CSS properties are safe to animate
• How to use techniques like FLIP to make sure your animations are performant
• Recommended libraries for building complex animations
• Strategies for keeping animation code maintainable

Sponsors:

• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report
• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days

Links:

• Sarah's Personal Website
• Sarah on CodePen
• "SVG Animations", Sarah's book
• "Functional Animation", Sarah's talk on using animation to create spatial awareness and make interfaces easier to use
• GreenSock animation library
• "Animation in Design Systems", Sarah's article at 24 ways
• "FLIP Your Animations", using the FLIP technique to make animations more performant
• Transitions in Vue.js
• "Animating Vue", Sarahs' talk from VueConf 2017
• Web Animation Workshops with Sarah and Val Head

Topics include:

• What is a "higher order component"?
• How do you replicate the render prop pattern from React with Vue?
• Using scoped slots to build components with no UI
• Using render functions without using JSX
• How Vue's built-in components like `` work under the hood

Sponsors:

• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report
• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days

Links:

• Vue.js Homepage
• The Vue Point, the official Vue.js blog on Medium
• Higher-Order Components, from the React documentation
• "Use a Render Prop!" by Michael Jackson, an introduction to render prop components in React
• Scoped Slots documentation
• Render Functions documentation
• "Writing Abstract Components with Vue.js", tutorial on writing a render function component with Vue
• Fetch Component Demo, based on the component Evan describes in the podcast

Topics include:

• What makes an application "multitenant" really?
• Choosing between a shared database or multi-database setup
• Approaches for identifying the current tenant
• Performance considerations
• How multitenancy impacts how you integrate with external services

Sponsors:

• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report
• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days

Links:

• "Building Multitenant Applications", video of Tom's talk from Laracon US 2017
• Slides from Tom's multitenancy talk
• "Online migrations at scale" on the Stripe engineering blog
• "Migrating replication lag and reducing read load with freno" on the GitHub engineering blog

Kent gives a behind-the-scenes look at how the library uses the render prop pattern to allow maximum customizability without complex configuration.

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days
• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report

Links:

• downshift on GitHub
• "Introducing downshift for React" from Kent's blog
• "Use a Render Prop!" post by Michael Jackson
• "Compound Components" talk by Ryan Florence
• match-sorter, Kent's best-match sorting library
• Awesome React Render Props
• react-toggled, Kent's toggle component library
• Kent's newsletter
• "Learn React Fundamentals and Advanced Patterns", blog post introducing Kent's React courses

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days
• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report

Links:

• Refactoring Rails, Ben's refactoring course
• The 30 Day Code Quality Challenge, Ben's free 30-day code quality course
• Refactoring from Good to Great, Ben's popular refactoring talk
• Decompose Conditional, an example of "make the implicit explicit"
• Introduce Parameter Object
• Replace Conditional with Polymorphism
• Chasing Perfect, Adam's talk about refactoring with polymorphism
• Introduce Null Object
• Replace Method with Method Object
• "Why Ruby Class Methods Resist Refactoring" from the Code Climate blog
• Collection Pipeline, Martin Fowler's article on replacing loops with array transformations
• Curing the Common Loop, Adam's talk on refactoring loops and conditionals
• Refactoring to Collections, Adam's book and video series
• Boundaries, Gary Bernhardt's talk about OO, functional programming, and immutability

Topics include:

• Why Tailwind doesn't include buttons or forms
• Is Tailwind for front-end developers or back-end developers?
• Best practices around extracting component classes
• Using Tailwind with existing CSS or on top of other frameworks
• Optimizing Tailwind's generated file size
• New features planned for upcoming Tailwind releases

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days
• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report

Links:

• Tailwind CSS Homepage
• Tailwind CSS GitHub repository
• Tailwind CSS discussion forum
• @tailwindcss on Twitter
• Built with Tailwind, a curated list of cool stuff built with Tailwind
• Tailwind Expo, more cool stuff built with Tailwind
• Tailwind CSS lessons on Egghead.io, by Simon Vrachliotis
• purgecss, amazing tool for removing unused CSS from your codebase
• Using PurgeCSS to remove unused Tailwind CSS classes, by Andrew Del Prete
• Jason Beggs' personal site, built with Tailwind and optimized with PurgeCSS
• Building a Login Page with Tailwind CSS, tutorial by Mustafa Ehsan
• Introducing Tailwind CSS on Scotch.io by Ezeugwu Paschal

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days
• Codeship, check out how they performed in Forrester's latest Continuous Integration Tools report

Links:

• Tailwind CSS Homepage
• Tailwind CSS GitHub repository
• Tailwind CSS discussion forum
• @tailwindcss on Twitter
• "CSS Utility Classes and Separation of Concerns", Adam's post on moving from "semantic" CSS to utility-first
• "Rebuilding Laravel.io with Tailwind CSS", a video walkthrough of implementing a design with Tailwind

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days

Links:

• Diana's personal website
• Primer, GitHub's design system
• Primer modules on GitHub
• "Introducing Design Systems into Chaos", Diana's recent talk on her work on design systems at GitHub
• Percy, a visual regression testing tool
• Primer CSS on Twitter
• GitHub Design on Twitter

Topics include:

• How to pick great fonts
• Choosing a color scheme for your project
• Designing in greyscale
• Recreating existing interfaces from scratch
• Recommended design tools
• What you should design first on a new page
• Strategies for making things look professional without graphic design skills

Sponsors:

• Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days

Links:

• Steve's Blog
• Little UI Details, a collection of Steve's hot design tips
• Google Fonts, prefiltered
• "12 Google Fonts You Can't Go Wrong With", by Steve
• System Font Stack courtesy of CSS-Tricks
• Inter UI font family (formerly "Interface")
• WhatFont Chrome Extension
• Fonts In Use
• Dribbble color picker
• "Color in UI Design" by Erik Kennedy (great resource on HSL)
• Sketch, design tool for macOS
• Figma, cross-platform design tool
• "Building a professional design tool for the web", on how Figma is written in C++ and compiled to asm.js
• "Epicenter Design" by 37signals
• Doodle, example of a small UI
• Example login page, from Shippo
• Refactoring UI "Redesigning Laravel.io" case study
• Zondicons, Steve's free SVG icon set
• Hero Patterns, Steve's free SVG background pattern gallery
• Pushsilver, example of Hero Patterns in use
• Heroicons, Steve's premium marketing icon kit