Is Tanstack Router Better Than React-Router? Jack Herrington 2024-03-04 | Tanstack Router is an amazing new router from Tanner Linsley, the creator of react-query. It has file based typesafe routing, streaming, and so much more, let's dig in!π» Code: github.com/jherr/tanstack-router-streaming-moviesπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:48 Example Walkthrough4:54 Managing Search Params9:38 Route Parameters11:43 Search Params as State17:24 Outroduction
React Hook Form & React 19 Form Actions, The Right Way Jack Herrington 2024-02-26 | Let's figure out how to get form actions and React Hook Form to work together to get the best from both; client AND server side validation when JavaScript is enabled on the client, and user friendly server side validation when it's not enabled.π Free Forms Tutorial Series: https://www.pronextjs.dev/tutorials/forms-management-with-next-js-app-router πCode: github.com/ProNextJS/forms-management-ytπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction01:40 Setting Up Client Side Validation04:30 Calling A Server Action08:35 The useFormState Hook10:06 Bringing Back Client Validation11:24 Using the State From useFormState15:32 Outroduction
Are Your React Components Too BIG? Jack Herrington 2024-02-19 | How big is too big for a single React component? Should you nest component definitions inside of other components? Are there performance issues with huge components? Let's find out!Code: github.com/jherr/gigantic-componentsπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:31 Why Mega Components Are Slow?3:49 How Not To Fix It? (Nesting Components)6:41 Using A State Manager For Shared State8:12 More Components Hurt Performance?10:53 A Production Worthy Example11:50 Outroduction
Mastering Micro-Frontends With RSpack and Module Federation Jack Herrington 2024-02-12 | Micro-Frontends have never been easier with Module Federation and building code has never been faster than with Rspack. Now you get the best of both worlds with Rspack creating Federated Modules enabling you to create amazing MFEs.π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:45 Create Module Federation and Project Setup2:32 Creating Counter in the Remote App3:35 Exposing the Counter from the Remote App6:10 Runtime Linking between the Apps7:50 Connecting the Counter in the Vue App8:42 Mounting the Vue Application in an Element10:35 Consuming the Vue Remote in the Host App12:14 Outroduction
Five React App Killing Anti-Patterns πͺ¦π± Jack Herrington 2024-02-05 | Five viewer submitted ways that bad React practices and anti-patterns are killing their applications, and some solutions for each one.π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:47 UseEffect 4:25 Redux For Everything6:52 CSS: Pick A Lane9:09 Super Huge Components
Easy Multi-tenant NextJS Apps With Clerk Jack Herrington 2024-01-31 | Clerk 5 is an amazingly easy way to add authentication, with roles, permissions, and organizations to your application. It is a powerful toolkit for multi-tenancy. Let's dig in!Code: github.com/jherr/clerk-5-roles-and-permsπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction5:27 Clerk Provider in React7:00 Protecting Routes with Clerk Middleware11:53 Applying The Show List to a User19:27 Sync Active Organizations25:09 Revolutionary User Interaction27:43 Clerk v5
Are RSCs and NextJS Really That Bad? Jack Herrington 2024-01-29 | Did the NextJS App Router kill the Developer Experience (DX) that we know and love from React? Or did they make it better? Let's compare the App and Pages Router doing identical tasks. We cover data loading, suspenses and server actions.Code: arc.net/l/quote/sjhqislcπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introductions00:30 Hitting Backend APIs Is Crazy Easy02:26 Streaming Responses is Trivial05:45 Calling The Server Is Just A Function#reactjs #nextjs14
Alpine, HTMX, Astro Stack Wordle App With Full Source! Jack Herrington 2024-01-22 | Wordle built using Alpine, HTMX, Astro and Tailwind!Code: github.com/jherr/ahat-wordleπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:28 The Finished Wordle Clone0:55 Starter Kit Walkthrough3:08 Game Board Setup4:16 Adding Alpine Interactivity7:09 HTMX Submits the Guess12:57 What Happens When You Win13:35 It's Not Just Astro
Hiring Secrets of a Netflix Software Engineering Manager Jack Herrington 2024-01-15 | Tips to get you the Software Engineering job you want at the Software Engineer salary you expect!π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction 0:34 Getting Your First Software Engineer Job6:25 How To Network To Get Your First Job11:13 Learning how to communicate as a Software Engineer12:55 How Do You Stand Out From The Rest19:29 What stands out in the interview process27:31 How to Write a Well-Rated Resume40:28 3 Things Every Software Engineer Needs to Know50:53 Outroduction
HTMX For React Developers in 10 Minutes Jack Herrington 2024-01-08 | React is great for large complex projects. HTMX is a much lighter weight alternative that makes building simple interactive applications a whole lot easier.HTMX: htmx.orgCode: github.com/jherr/htmx-for-react-devsπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction00:25 HTMX Setup01:06 Getting with hx-get03:38 Searching with hx-trigger04:49 State with HATEOAS06:03 Out of Band Updates07:43 HTMX Vs React08:47 HTMX Movie App#htmx #reactjs
Ranking 6 Coding AIs Transforming Web Development in 2024 Jack Herrington 2023-12-26 | Which coding AI assistant is the right one for you? Tabnine? Google's Duet based on their Gemini AI? Amazon's Codewhisperer? The AI built into JetBrain's IDEs? Cody from Sourcegraph? Or Copilot from GitHub? So many choices!π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:12 Tabnine Strikes Out2:00 Google's Duet AI Gets A Few Right2:36 Amazon's Code Whisperer Writes Great Code3:22 JetBrains AI Works Wonders On Webstorm4:09 Cody AI Sees Your Whole Project4:52 Github Copilot Takes The Win5:16 Outroduction
Super Quick And Easy Deno Conversion #nodetodeno Jack Herrington 2023-12-21 | Converting from Node to Deno is pretty quick on a lot of projects and the code ends up better for it. If you haven't tried out Deno I think you should. It's a very stable JS runtime that is quick, runs TypeScript out of the box, and now handles NPM modules with no additional work.#shorts
Agile 2 Is Crazy Jack Herrington 2023-12-14 | Agile is being replaced with Agile 2 and the key takeaway is that the answer to everything is; "It Depends". #shorts
How To Debug Broken APIs Jack Herrington 2023-12-14 | OSS tool Envy gives you insights into your API calls you've never had before. Whether they come from the client, the server, or microservices behind the server you will trace your API calls like never before! This is a must have tool for web developers.Envy: formidable.com/blog/2023/green-with-envyCody: about.sourcegraph.com/codyπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction00:40 Seeing API calls from GraphQL Servers05:34 Seeing API calls from NextJS Servers10:51 Introducing Cody AI12:36 Fixing The Bug Using Codyβs Advice14:42 OutroductionThis video was sponsored by SourceGraph.#reactjs #debugging #ai
13 Figma To React Converters Ranked Jack Herrington 2023-12-11 | To try everything Brilliant has to offerβfreeβfor a full 30 days, visit brilliant.org/JackHerrington . The first 200 of you will get 20% off Brilliantβs annual premium subscription.π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:06 Copy Cat1:33 Figma to React From Quest2:04 Figma To HTML3:26 Auto HTML4:33 Figma To Code4:51 Locofy Free6:15 Dhi Wise10:20 Anima11:13 Visual Copilot12:14 v0 From Vercel13:52 Screenshot To Code15:06 Does This Replace UI Developers?This video was sponsored by Brilliant.
StyleX: Metas Solution To CSS At Scale Jack Herrington 2023-12-05 | StyleX is Meta's new library that gives you the tools to make rock solid component systems at scale. StyleX has been in use at Meta for three years. Now it's open sourced. Learn all about how to build StyleX components today!Code: github.com/jherr/stylex-demoOriginal App Router Boilerplate Code: github.com/nmn/nextjs-app-dir-stylexπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Intro0:44 StyleX Basics4:46 Restricting Style Changes6:23 Can Tailwind Do This?8:39 StyleX Themeing11:30 Conditional Styles12:21 Dynamic Styles12:40 Outro
Stream Your Components From NextJS Server Actions Jack Herrington 2023-12-04 | The Vercel AI library has an amazing component streaming feature that nobody is talking about! Be the first on your team to know about how to take advantage of this awesome new functionality.Finished code: github.com/jherr/streaming-sa-spotifyOriginal Example: sdk.vercel.ai/docs/api-reference/streaming-react-response#example π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction02:12 How It Works04:26 Using Different Prompts06:10 Parsing The Response07:04 Connecting To Spotify09:53 State Sharing With Context12:00 This Isn't "Micro-FEs"12:47 Outroduction
Visual Copilot Converts Figma Mocks to React Fast and Accurately Jack Herrington 2023-11-29 | Let's try out Visual Copilot to turn Figma mocks into React on NextJS.Figma mock: figma.com/file/BB4xE8gevCawMQLuIrDqQk/Shoe-Store?type=design&node-id=0-1&mode=design&t=3WLrkIAAAsPidyp8-0Downloader script: gist.github.com/jherr/14cf3143ab1dc40ebc8a29d992c71419π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction00:54 Converting Figma To React03:50 Integrating Into NextJS13:00 What's Left After the AI15:10 Outroduction
The Ultimate API Showdown: Server Actions, tRPC, GraphQL, and REST Compared! Jack Herrington 2023-11-20 | We compare server actions to tRPC, GraphQL and REST to figure out which one is the right one for your application.π Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction00:30 The contenders02:28 The comparison09:44 Recommendations10:35 Finishing up
NextJS 14: You Missed The Best Part! Jack Herrington 2023-11-13 | Can we turn React components into self-contained Lego blocks that talk to backend services? Let's find out!0:00 Introduction2:13 RSC Lego Component6:42 Moving To A Library8:11 Client Lego Component12:34 Pages Router Comparision14:38 OutroCode: github.com/jherr/nextjs-14-lego-example/tree/mainTalk link: youtube.com/watch?v=9CN9RCzznZc
NextJS 14 Server Action Controversy! Jack Herrington 2023-11-06 | Learn five system design patterns that you can use with various combinations of server actions, APIs and microservices.Code: github.com/jherr/server-actions-vs-apisπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:27 Short Postgres/ Clerk Setup4:10 Server Action Direct to DB7:24 Server Action To Local SQL Module10:10 API to Local SQL Module14:02 Application And Microservice17:38 Application to Microservice Proxied20:31 Outro
Use React Forget TODAY! Fine Grained Updates Right NOW! Jack Herrington 2023-10-30 | Why wait for React Forget to be released when you can have the core optimizations today? Learn all about what React Forget does and how you can make those same optimizations by hand in your React code right now!π Upcoming NextJS course: https://pronextjs.devπ Original React Forget talk video: youtube.com/live/hn_L56ypX1Aπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:08 useMemo for JSX3:29 Reference Refresher8:06 Fine Grained Memoization11:23 Outro
React Advanced London 2023 Jack Herrington 2023-10-20 | Live stream of React Advanced Conference β Day 1, Piccard Track #ReactAdvanced #GitNationGet a completion certificate + free perks from the conference partners by following the main conference stream page. To get access, first register via the digital badge: portal.gitnation.org/badges/react-advanced-conference-2023/jack_herringtonJoin Discord for chatting with the community and ask speakers your questions: discord.gg/TGh5XkeJmnTo join Day 2 and Van Dover Track check tickets options go to reactadvanced.com/#tickets
Svelte Runes: Awesome or Awful? Jack Herrington 2023-09-25 | Runify gist: gist.github.com/jherr/b21f81b6a7a8cfa6a1bf60cdd9f1c638Fine grained Reactivity: https://svelte-5-preview.vercel.app/docs/fine-grained-reactivity00:00 Introduction01:42 $state Rune02:23 $derived Rune04:27 $props Rune05:12 $effect Rune06:15 Array signals10:18 Translating Runes Into JS
Bun Macros: New Feature You Need To Try! Jack Herrington 2023-09-18 | To try everything Brilliant has to offerβfreeβfor a full 30 days, visit brilliant.org/JackHerrington . The first 200 of you will get 20% off Brilliantβs annual premium subscription.00:00 Introduction00:28 Macro Basics03:20 Building An SSG With Macros06:32 Adding Hono12:53 Macros For Build InsightsThis video was sponsored by Brilliant.
Create Jaw-Dropping UIs with Simple Animated View Transitions and Container Queries Jack Herrington 2023-09-11 | Using container queries in combination with view transitions makes for some fluid and engaging UIs. And it just gets better when you bring in a powerful asset mangement provider like Cloudinary. This video is sponsored by Cloudinary.Cloudinary Discount: cloudinary.com/developers?utm_content=astro_container_queries&utm_medium=video&utm_source=youtube&utm_campaign=jackherringtonπ Upcoming NextJS course: https://pronextjs.devπ Code: github.com/jherr/astro-container-queriesπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF00:00 Introduction01:08 Astro + Tailwind Setup02:57 Container Query Basics04:59 Integrating Cloudinary08:46 Building The Home Page10:00 Building The Product Grid11:42 Adding View Transitions14:42 Adding Cloudinary AI
Next-Auth on App Router - Solid Auth, Super Fast Jack Herrington 2023-09-05 | You can add authentication to your NextJS App Router in just a few minutes with next-auth, let me show you everything you need to know.π Upcoming NextJS course: https://pronextjs.devπ Code: github.com/jherr/app-router-auth-using-next-authπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Intro1:53 Project Setup3:22 Next Auth Setup6:49 Using The Session10:06 Sessions In React Server Components10:53 Protected Routes12:31 Auth In Server Actions14:19 Auth In API Routes15:33 Proxied Auth In RSCs16:38 Outro
Ben Holmes: Future Astro and React Advanced! Jack Herrington 2023-08-30 | A fun interview with Ben Holmes about the future of Astro.π Upcoming NextJS course: https://pronextjs.dev
Six Reasons Not To Use React Jack Herrington 2023-08-28 | Original Reddit link: reddit.com/r/reactjs/comments/15t4ql9/why_would_anyone_use_reactπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 State Management3:00 JSX sucks5:17 Context VS Redux6:50 "Bad" React Jobs8:15 React VS Other Frameworks10:40 Everyone's A React Developer12:19 Too Many Footguns In React13:18 Outro
tRPC + NextJS App Router = Simple Typesafe APIs Jack Herrington 2023-08-21 | π Upcoming NextJS course: https://pronextjs.devπ Code : github.com/jherr/trpc-on-the-app-routerπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:22 NextJS/trpc Setup5:05 tRPC Client Setup7:38 Drizzle Setup9:31 Using Drizzle from tRPC13:35 Why tRPC is awesome?15:28 Supporting Server Side Rendering18:44 Outro
Secrets of Building Design Systems Right Jack Herrington 2023-08-16 | To try everything Brilliant has to offerβfreeβfor a full 30 days, visit brilliant.org/JackHerrington The first 200 of you will get 20% off Brilliantβs annual premium subscription.This video was sponsored by Brilliantπ Upcoming NextJS course: https://pronextjs.devπ Code : github.com/jherr/van-turbo-repoπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:24 Monorepo Setup2:25 Vanilla Extract Setup4:48 NextJS Integration7:31 Pre-Application Styles11:58 Qwik Implementation14:26 SolidJS Implementation15:23 Vue Implementation16:32 Other Alternatives
Dominik Dorfmeister: React Query With The App Router Jack Herrington 2023-08-15 | π Upcoming NextJS course: https://pronextjs.devπ I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF
Tobias Koppers on Turbopack vs Webpack Jack Herrington 2023-08-09 | Should you be on Turbopack or Webpack? Let's hear it from Tobias Koppers himself!π Upcoming NextJS course: https://pronextjs.devπ I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF
HTMX: The Game-Changing Alternative to React Jack Herrington 2023-08-07 | HTMX is cool and all, but how far can it go? Can it do streaming AI responses? Let's find out. It might be a lot easier than you think!NextJS Course! https://pronextjs.devCode: github.com/jherr/htmx-nextjs-ai0:00 Intro1:09 Project Introduction2:02 Posting With HTMX3:15 Converting Astro to SSR3:48 Creating The Request Cycle5:00 Building A Request Manager6:38 Supporting Requests In The UI7:39 Connecting To OpenAI9:27 Cleansing Astro's Fragment Results11:04 Now Using NextJS12:28 HTMX XSS Concerns12:59 Should React Devs Learn HTMX?
Must Know App Router Secret: Promises For Props Jack Herrington 2023-07-31 | π Upcoming NextJS course: https://pronextjs.devπ Code : github.com/jherr/rsc-useπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:02 Project Setup2:37 Sending Data Via Props5:15 Passing Promises as Props8:02 Sharing Promises With Context9:54 Error Handling11:15 Streaming With Suspense12:19 Using React-Query or SWR15:13 Outroduction
Convex: The Next Level Firebase for Modern Developers Jack Herrington 2023-07-24 | Check out Convex, an incredibly well designed Firebase alternative that provides a real time database, object storage, server functions, http API hosting, cron jobs and more!Convex: https://www.convex.dev/Code: github.com/jherr/njs-outfit-builderArticle: medium.com/@jherr2020/real-time-apis-done-right-with-rscs-4b474e253aadπ Upcoming NextJS course: https://pronextjs.devπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:39 Project Introduction2:10 The Convex Dashboard2:56 Project Setup4:10 Importing Our Product Data5:37 NextJS Setup6:41 Our First Query Function8:02 Calling Server Functions From React11:00 Creating A Schema12:33 Accessing The File Storage15:57 Our First Server Mutation19:20 A Cross-Table Query21:05 Building The Home Page22:46 Using Convex From RSCs24:43 OutroductionThis video was sponsored by Convex
Why Panda: CSS for RSCs is Changing the Game Jack Herrington 2023-07-21 | To try everything Brilliant has to offerβfreeβfor a full 30 days, visit brilliant.org/JackHerrington . The first 200 of you will get 20% off Brilliantβs annual premium subscription.Code: github.com/jherr/barbenheimerTailwind2Panda: https://tw2panda-astahmer.vercel.app/tw2panda-cli: npmjs.com/package/tw2panda-cliπ Tailwind to Panda CSS Converter: github.com/jherr/tw2panda-cliπ Upcoming NextJS course: https://pronextjs.devπ I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:59 Project Introduction2:09 NextJS Setup4:16 Page Setup4:53 Tailwind To Panda5:58 Panda Basics7:25 Panda Patterns10:57 Grid Layout12:32 CSS-in-JS Without JS12:59 NextJS Server Actions16:05 Atomic Panda19:06 OutroductionThis video was sponsored by Brilliant
Legend: The Ultimate React State Manager? Jack Herrington 2023-07-17 | Is Legend the perfect React state manager. Could be with an easy to use Proxy API that supports reactive observation and computed values, along with preact-signals style fine grained updating, in a package that is only 3Kb!π Upcoming NextJS course: https://pronextjs.devπ Code: github.com/jherr/legend-state-nextπ I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:04 Local State With Legend7:11 Context State With Legend9:43 Global State With Legend11:36 Outroduction
MiΕ‘ko Hevery on Qwik versus React Jack Herrington 2023-07-11 | π I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF
Whats Next For Redux with Mark Erikson? Jack Herrington 2023-06-29 | π I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF
Single Line React Performance Boost with Million Jack Herrington 2023-06-26 | Turbo charge your React application with the new block rendering engine in Million.Upcoming NextJS course: https://pronextjs.devCode: github.com/jherr/million-rainbow/blob/main/src/App.tsxLiminal: https://www.liminal.sh/
Dont Follow THIS Bad React Advice! Jack Herrington 2023-06-23 | To try everything Brilliant has to offerβfreeβfor a full 30 days, visit brilliant.org/JackHerrington . The first 200 of you will get 20% off Brilliantβs annual premium subscription.π I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:18 Avoid The Spread Operator7:18 useMemo will hurt performance10:32 only use state updaters12:14 OutroductionThis video was sponsored by Brilliant
Ryan Carniato Interview: Is This Solid-JSs Moment? Jack Herrington 2023-06-12 | π I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction0:17 Interview10:50 Outroduction
Did RSCs Really Turn React Into PHP? Jack Herrington 2023-06-05 | πCode: github.com/jherr/rscs-vs-php/tree/main/rustπ I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:18 Server Side Developer Experience2:55 Client Side Developer Experience9:31 Is React Still Worth It?12:56 Performance Comparision15:45 Rust Rocks It17:33 Are You As Hypocritical As Me?18:32 Outroduction
Copilot Chat Is The Droid Youve Been Looking For! Jack Herrington 2023-05-31 | Singup link: github.com/github-copilot/chat_waitlist_signup#shorts
Are React Server Components Really Slower? Jack Herrington 2023-05-29 | Wait, hold up, React Server Components (RSCs) are actually slower in NextJS than the getServerSideProps/Pages model? Are you kidding me? Turns out, I'm not. Check out the results for yourself!π Upcoming NextJS course: https://pronextjs.devπ Code: github.com/jherr/pages-app-router-perf-testπ I'm a host on the React Round-Up podcast: devchat.tv/podcasts/react-round-upπ Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJπ Discord server signup: discord.gg/ddMZFtTDa5π VS Code theme and font? Night Wolf [black] and Operator Monoπ Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF0:00 Introduction1:14 Single Tag Test3:26 Tests By Tag Count6:21 Testing Rendering Fetched Data10:57 Is This A Fair Test?11:57 Testing Rendering Fetched Data13:27 Outroduction
