Player FM - Internet Radio Done Right
Checked 3d ago
Added two years ago
Content provided by Ryan Solomon. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by Ryan Solomon or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://ppacc.player.fm/legal.
Player FM - Podcast App
Go offline with the Player FM app!
Go offline with the Player FM app!
Podcasts Worth a Listen
SPONSORED
T
TED Business


1 The trick to powerful public speaking | Lawrence Bernstein 17:27
17:27
Play Later
Play Later
Lists
Like
Liked17:27
Why do so many of us get nervous when public speaking? Communication expert Lawrence Bernstein says the key to dealing with the pressure is as simple as having a casual chat. He introduces the "coffee shop test" as a way to help you overcome nerves, connect with your audience and deliver a message that truly resonates. After the talk, Modupe explains a similar approach in academia called the "Grandma test," and how public speaking can be as simple as a conversation with grandma. Want to help shape TED’s shows going forward? Fill out our survey ! Become a TED Member today at ted.com/join Hosted on Acast. See acast.com/privacy for more information.…
HTML Lists - Know THIS
Manage episode 371223957 series 3493400
Content provided by Ryan Solomon. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by Ryan Solomon or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://ppacc.player.fm/legal.
…
continue reading
296 episodes
Manage episode 371223957 series 3493400
Content provided by Ryan Solomon. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by Ryan Solomon or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://ppacc.player.fm/legal.
…
continue reading
296 episodes
All episodes
×TLDR; don't mutate state directly. Always use setState when updating a piece of state. Also, pass a function when updating state based on previous state.
Today I explain a key point regarding server and client components in Next.js and passing props. Also, I explain what you should know regarding client boundaries in Next.js

1 An AI Tool That's Actually Worth It For Developers 7:32
7:32
Play Later
Play Later
Lists
Like
Liked7:32
Docs: https://www.korbit.ai/ I'm not affiliated with this tool in any way. We've just found it useful the last few months using it on our team. If you know any tools, or even something better than Korbit, let me know in the comments below.

1 This One Fix Makes Your Next.js App Faster and Cleaner 8:48
8:48
Play Later
Play Later
Lists
Like
Liked8:48
Learn the recommended way to fetch data in Next.js as well as some patterns to know about client and server components.
In todays video, I cover the core concepts of React.js in about 20 minutes. Of course, this isn't everything you need to know. But it is a good starting place and review for some.
docs: https://nextjs.org/docs/app/building-your-application/rendering/client-components

1 Finally Understand Server Components In Next.js 11:36
11:36
Play Later
Play Later
Lists
Like
Liked11:36
Docs: https://nextjs.org/docs/app/building-your-application/rendering/server-components

1 Understanding Rendering in React & Next.js (The Full Picture) 9:38
9:38
Play Later
Play Later
Lists
Like
Liked9:38
Docs: https://nextjs.org/docs/app/building-your-application/rendering

1 Optimize Your Code In Next.js With Server Actions 6:29
6:29
Play Later
Play Later
Lists
Like
Liked6:29
Docs: https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations
Learn how to use Suspense and streaming for sequential data fetching in Next.js
Docs: https://nextjs.org/docs/app/building-your-application/data-fetching/fetching#patterns
Docs: https://nextjs.org/docs/app/building-your-application/data-fetching/fetching#reference

1 Did You Know This About Custom Hooks In React.js? 11:51
11:51
Play Later
Play Later
Lists
Like
Liked11:51
Docs: https://react.dev/learn/reusing-logic-with-custom-hooks#recap

1 Your Complete Guide To Middleware In Next.js 15 10:47
10:47
Play Later
Play Later
Lists
Like
Liked10:47
Middleware Docs: https://nextjs.org/docs/app/building-your-application/routing/middleware
Docs: https://react.dev/learn/you-might-not-need-an-effect#subscribing-to-an-external-store

1 This Is A Core Concept To Understand About React.js 5:43
5:43
Play Later
Play Later
Lists
Like
Liked5:43
Docs: https://react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes

1 Your Guide To Parallel Routes In Next.js 15 10:24
10:24
Play Later
Play Later
Lists
Like
Liked10:24
Parallel Routes Docs: https://nextjs.org/docs/app/building-your-application/routing/parallel-routes#loading-and-error-ui
Today I cover an issue you might run into with running code multiple times in React -- especially when running initialization code -- and how React thinks you should solve it Docs: https://react.dev/learn/you-might-not-need-an-effect#sharing-logic-between-event-handlers

1 Did You Know This Advanced Routing Technique In Next.js? 7:31
7:31
Play Later
Play Later
Lists
Like
Liked7:31
Docs: https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes#generating-static-params
Docs: https://react.dev/learn/you-might-not-need-an-effect#sharing-logic-between-event-handlers
Docs: https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes#generating-static-params
Docs: https://react.dev/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes
Route Groups Code: https://nextjs.org/docs/app/building-your-application/routing/route-groups
Docs: https://react.dev/learn/you-might-not-need-an-effect#resetting-all-state-when-a-prop-changes

1 A Core Next.js Fundamental You Need To Know About 2:58
2:58
Play Later
Play Later
Lists
Like
Liked2:58
Docs: https://nextjs.org/docs/app/building-your-application/routing/redirecting#nextresponseredirect-in-middleware
Docs: https://react.dev/learn/you-might-not-need-an-effect#how-to-remove-unnecessary-effects

1 This Is A Beginner Mistake You Should Avoid (Client-side Routing) 6:31
6:31
Play Later
Play Later
Lists
Like
Liked6:31
Docs: https://nextjs.org/docs/app/api-reference/functions/use-router#disabling-scroll-to-top
Docs: https://react.dev/learn/you-might-not-need-an-effect#how-to-remove-unnecessary-effects
Learn how to use the redirect and permanenetRedirect functions in Next.js -- https://nextjs.org/docs/app/building-your-application/routing/redirecting#redirect-function

1 How To Actually Use The useEffect Hook In Modern React.js 12:48
12:48
Play Later
Play Later
Lists
Like
Liked12:48
Docs: https://react.dev/learn/synchronizing-with-effects
C
Code Ryan

1 Unlock PRO UX with Streaming Web Components in Next.js 6:56
6:56
Play Later
Play Later
Lists
Like
Liked6:56
Docs: https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming#streaming-with-suspense
C
Code Ryan

1 3 Key Concepts Professional React Developers Master 8:58
8:58
Play Later
Play Later
Lists
Like
Liked8:58
Docs: https://react.dev/learn/synchronizing-with-effects
C
Code Ryan

1 The Right Way To Handle Instant Loading States In Next.js 15 4:39
4:39
Play Later
Play Later
Lists
Like
Liked4:39
Docs: https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming
C
Code Ryan

1 Correctly Using Refs With DOM Elements In React.js 7:09
7:09
Play Later
Play Later
Lists
Like
Liked7:09
https://react.dev/learn/manipulating-the-dom-with-refs#best-practices-for-dom-manipulation-with-refs
Docs: https://nextjs.org/docs/app/building-your-application/routing/error-handling#uncaught-exceptions
C
Code Ryan

https://react.dev/learn/referencing-values-with-refs#recap
C
Code Ryan

1 PRO Next.js 15 Error Handling - Expected Errors 7:09
7:09
Play Later
Play Later
Lists
Like
Liked7:09
Docs: https://nextjs.org/docs/app/building-your-application/routing/error-handling
C
Code Ryan

Docs: https://nextjs.org/docs/app/api-reference/functions/use-router
C
Code Ryan

Docs: https://react.dev/learn/passing-data-deeply-with-context Starter Project: https://github.com/coderyansolomon/react-context
C
Code Ryan

Docs: https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating Link API - https://nextjs.org/docs/app/api-reference/components/link
C
Code Ryan

1 Avoid This Problem In React.js - Prop Drilling 6:12
6:12
Play Later
Play Later
Lists
Like
Liked6:12
Docs: https://react.dev/learn/passing-data-deeply-with-context
C
Code Ryan

Docs: https://nextjs.org/docs/app/building-your-application/routing/layouts-and-templates#templates
C
Code Ryan

Docs: https://react.dev/learn/extracting-state-logic-into-a-reducer#comparing-usestate-and-usereducer
C
Code Ryan

Docs: https://nextjs.org/docs/app/building-your-application/routing/layouts-and-templates
C
Code Ryan

Today, I discuss the problem of state not being reset when rendering the same component in the same position within the React tree. Read more about this here: https://react.dev/learn/preserving-and-resetting-state#resetting-state-at-the-same-position
Today, I give a brief overview of how pages work in Next.js 15 and a few important things to know regarding pages. Learn more from the Next.js docs here: https://nextjs.org/docs/app/building-your-application/routing/pages
C
Code Ryan

Today, I cover having a single source of truth in your React application's state. Docs: https://react.dev/learn/sharing-state-between-components#a-single-source-of-truth-for-each-state
C
Code Ryan

Learn how to define routes in Next.js 15. Docs: https://nextjs.org/docs/app/building-your-application/routing/defining-routes
C
Code Ryan

Docs: https://react.dev/learn/preserving-and-resetting-state#
C
Code Ryan

Today, I cover the change from sync to async apis in Next.js 15. Docs: https://nextjs.org/docs/app/building-your-application/upgrading/version-15
C
Code Ryan

1 A Fundamental React.js Concept - Lifting State 9:33
9:33
Play Later
Play Later
Lists
Like
Liked9:33
Today, I discuss what it means to lift state in React.js and show you an example of how this might be done.
C
Code Ryan

Today, I cover 5 principles of structuring state in your React applications. Docs: https://react.dev/learn/choosing-the-state-structure#
C
Code Ryan

1 The Top 3 Next.js 15 Project Organization Strategies 9:07
9:07
Play Later
Play Later
Lists
Like
Liked9:07
Today, I discuss a few solid options for organizing your Next.js projects. Docs: https://nextjs.org/docs/canary/app/building-your-application/routing/colocation#project-organization-strategies
C
Code Ryan

Today, I show you a cool new feature of Next.js 15 forms: Client Side Navigation
C
Code Ryan

1 The Modern Guide To Using State In React.js 17:22
17:22
Play Later
Play Later
Lists
Like
Liked17:22
I show you a step by step process for how to think about using state in React.js
C
Code Ryan

Today, I discuss declarative vs imperative programming in the context of React.js and why it matters.
C
Code Ryan

As a web developer, it can be easy to just push a PR without considering how you can make things more maintainable and extendable in the long run.
Today, I show some examples of mistakes you can make (bad ideas) when working with arrays in React.js state
C
Code Ryan

Today, I cover what the status indicator means in your Next.js application as well as giving you a refresher on static vs dynamic rendering. Docs: https://nextjs.org/docs/app/api-reference/next-config-js/devIndicators#appisrstatus-static-indicator
C
Code Ryan

1 Doing This Is A Bad Idea In Your React Apps 11:55
11:55
Play Later
Play Later
Lists
Like
Liked11:55
Mutating state isn't a great idea in your React apps. But how should you update your objects and arrays? Doing full replacements or creating copies. I show you how in this video.
Welcome to Player FM!
Player FM is scanning the web for high-quality podcasts for you to enjoy right now. It's the best podcast app and works on Android, iPhone, and the web. Signup to sync subscriptions across devices.