Log in

goodpods headphones icon

To access all our features

Open the Goodpods app
Close icon
headphones
Frontend First

Frontend First

Sam Selikoff, Ryan Toronto

A podcast about modern UI development on the web. Hosted by Sam Selikoff and Ryan Toronto.
bookmark
Share icon

All episodes

Best episodes

Top 10 Frontend First Episodes

Goodpods has curated a list of the 10 best Frontend First episodes, ranked by the number of listens and likes each episode have garnered from our listeners. If you are listening to Frontend First for the first time, there's no better place to start than with one of these standout episodes. If you are a fan of the show, vote for your favorite Frontend First episode by adding your comments to the episode page.

Frontend First - When APIs get misused, who's to blame?
play

05/07/20 • 83 min

Sam and Ryan chat about how and why framework APIs get used and abused. Ryan also shares his experience working with AWS Amplify on a side project.

Topics include:

3:17 – How useEffect can be confusing in high-level app code

21:05 – Immediate mode GUIs

32:40 – Who's responsible when developers misuse framework APIs?

46:40 – AWS Amplify

1:14:25 – Our ideal stack

Links:

[Immediate mode GUIs - Go Time #128](https://changelog.com/gotime/128)

[AWS Amplify](https://aws.amazon.com/amplify/)

[Begin.com learn](https://learn.begin.com/)

bookmark
plus icon
share episode
Frontend First - When UI isn't a function of state
play

01/22/20 • 65 min

Topics include:

4:45 - Building out Mirage's new homepage. SVG positioning.

15:42 - CSS Grid for layouts

19:36 - Update on launching Mirage JS. Adding types to Mirage.

24:09 - Learning about idempotence through React Spring. What to do when UI isn't a function of state.

52:40 - Sharp tools vs. high-level APIs

Links:

[React Spring](https://www.react-spring.io)

[Small, Sharp Tools](https://brandur.org/small-sharp-tools)

bookmark
plus icon
share episode
Frontend First - The elephant in the room
play

12/05/18 • 64 min

Sam and Ryan discuss the difficulty of working with a design system that doesn't have good escape hatches, how implementing HTML and CSS can be more complex and time-consuming than coding user behavior, and some creative approaches to ensuring JSON:API payloads represent canonical server-side state.

Topics include:

  • 04:15: Design systems and when they break down
  • 22:38: The complexity of implementing designs in HTML and CSS
  • 34:38: JSON:API mutations. How incomplete response payloads can put your Ember app into an impossible state.

Links:

bookmark
plus icon
share episode
Frontend First - React Deep Dive: cache
play

02/07/24 • 67 min

Ryan and Sam discuss the purpose and usage of the cache() function, a new experimental API from React.

Topics include:

  • 0:00 - Intro
  • 2:29 - Caching in Next.js vs. React cache()
  • 8:11 - Why React invalidates the cache for each server request
  • 14:43 - How cache() enables colocation of data-fetching code
  • 16:14 - Using cache() to share CPU-heavy or I/O-bound tasks between components
  • 19:31 - Why cache() obviates the need for context in Server Components
  • 23:19 - The danger of module scope on the server
  • 27:54 - Why cache() is implemented with AsyncLocalStorage
  • 41:04 - Why cache() is part of React
  • 48:27 - Why Server Components don’t support cache()
  • 53:04 - How cache() eliminates waterfalls

Links:

bookmark
plus icon
share episode
Frontend First - React Deep Dive: useOptimistic
play

02/14/24 • 51 min

Ryan and Sam discuss the purpose and usage of the useOptimistic() hook, a new experimental API from React.

Topics include:

  • 0:00 - Intro
  • 2:18 - Problem: RSCs require a server roundtrip before the UI can be updated
  • 10:13 - Solution: useOptimistic() lets you merge ephemeral client-side state with server-side data so you can update the UI during a Server Action or Transition
  • 14:03 - How useOptimistic() avoids the notion of identity by discarding the ephemeral state after the app settles
  • 21:17 - How useOptimistic() lets you safely “fork” state that eventually syncs with the server
  • 27:32 - Handling error states
  • 29:26 - Differences between useOptimistic() and Remix fetchers
  • 34:57 - How useOptimistic() lets you avoid managing a long-lived client-side cache

Links:

bookmark
plus icon
share episode

Sam and Ryan talk about using Promises and state libraries like Valtio to cross the bridge from changing module scope to React component state. Ryan also talks about writing an end-to-end Cypress test that verifies image uploads to S3.

Topics include:

  • 0:00 - Intro
  • 1:50 - Using Promises and state libraries to bridge the gap from module scope to React rendering
  • 23:05 - How to test image file uploads given the security constraints of the browser

Links:

bookmark
plus icon
share episode

Sam and Ryan chat about how Suspense lets you remove defensive and confusing useEffect code from your React components. They also share some initial thoughts about how Remix is positioning itself in the frontend dev space.

Topics include:

  • 0:00 - Intro
  • 4:53 - How compatible are non-Suspense APIs with Suspense, and how can we bridge these two worlds?
  • 33:35 - Impressions about Remix’s positioning around web standards

Links:

bookmark
plus icon
share episode

Sam and Ryan continue their discussions around React 18 and the in-progress work on data fetching with Suspense. They talk about the useTransition hook and how it helps eliminate inconsistent states from your application. They also talk about

Topics include:

  • 0:00 - Intro
  • 4:13 - What does Suspense for Data Fetching mean?
  • 15:00 - How Transitions allow us do work outside of render
  • 39:43 - Dealing with Timezone-dependent tests
  • 46:45 - Modal routing in Next.js
  • 48:15 - Snapshotting form data

Links:

bookmark
plus icon
share episode

Happy New Year! Sam and Ryan are back from the holidays, talking about transitive dependencies in node and the browser in the context of Ryan’s next-s3-upload library. They also discuss a SuspenseAfterInitialRender component, speed vs. testability in services and monoliths, and a thought-provoking tweet from Dan Abramov on tests vs. source code.

Topics include:

  • 0:00 - Would you want tests or source code
  • 11:20 - Suspense, SuspenseAfterInitialRender, unstable_avoidThisFallback
  • 19:05 - Value of having a reproducible test suite for a dynamic app
  • 22:12 - Speed vs. testability of services vs. monolith
  • 26:24 - How to import different versions of dependencies in libraries. Module resolution in node vs. browser.

Links:

bookmark
plus icon
share episode
Frontend First - What is a framework?

What is a framework?

Frontend First

play

08/01/24 • 62 min

Sam and Ryan talk about what sorts of capabilities a tool should have to be considered a web framework. They discuss how frameworks tackle the complexity of getting different systems to communicate with each other, how good frameworks embrace the strengths and patterns of the language they're written in, and why frameworks and services are not in opposition to each other.

Timestamps:

  • 0:00 - Intro
  • 3:58 - Adapter pattern and cohesive boundaries
  • 9:43 - Rails is Omakase
  • 13:47 - Configurable, but still cohesive
  • 17:04 - Frontend frameworks try to “work with everything”
  • 21:42 - Does composition mean a React framework will look different than Rails?
  • 29:29 - Why taste still matters
  • 34:20 - A framework is a shell of adapters and a brain that coordinates them
  • 35:16 - When using services, complexity still exists in the in-between
  • 37:59 - A fullstack dev is someone who acknowledges and understands how all the parts come together
  • 44:06 - Tweets about the hard problems that Laravel tackles, and the deep design it took to get there
  • 49:15 - Frameworks should embrace the strengths and patterns of their language and ecosystem
  • 50:35 - Why RSCs and Server Actions mean the “Rails for JS” may end up looking nothing like Rails
  • 52:11 - Why users of a “fullstack framework” shouldn’t even care about where the code is running
  • 55:31 - Why libraries or services that are easy to install and set up are not a replacement for frameworks

Links:

bookmark
plus icon
share episode

Show more best episodes

Toggle view more icon

FAQ

How many episodes does Frontend First have?

Frontend First currently has 198 episodes available.

What topics does Frontend First cover?

The podcast is about Javascript, Web, Design, Development, Software, Podcasts and Technology.

What is the most popular episode on Frontend First?

The episode title 'Is Suspense “backwards compatible”, and thoughts on Remix & web standards' is the most popular.

What is the average episode length on Frontend First?

The average episode length on Frontend First is 60 minutes.

How often are episodes of Frontend First released?

Episodes of Frontend First are typically released every 8 days, 1 hour.

When was the first episode of Frontend First?

The first episode of Frontend First was released on Jun 2, 2017.

Show more FAQ

Toggle view more icon

Comments