766: React Server Components: Form Actions + Server Actions

Syntax - Tasty Web Development Treats

Wes Bos

Tech News, Technology, News

4.9 • 1.2K Ratings

🗓️ 8 May 2024

⏱️ 47 minutes

🔗️ Recording | iTunes | RSS

🧾️ Download transcript

Summary

Scott and Wes are here to guide you through the world of React Server Components, shedding light on the intricacies of Form Actions and Server Actions. Get ready to level up your React skills as they discuss the ins and outs of these powerful features and share their expert advice on optimizing your applications. Show Notes 00:00 Welcome to Syntax! Show 718 React Server Components. 02:04 Brought to you by Sentry.io. 03:04 What are form actions? GitHub Add React.useActionState PR 04:05 Almost entirely React. 04:31 What is the ‘server’ in Vanilla React? 06:10 Would React ever ship their own server? 07:29 What are actions? 08:34 Two huge benefits to actions. 08:45 Avoid custom useEffects or third party libraries. 09:17 Calling server code from the client without any APIS. 11:31 Some examples of actions. 12:54 Can these actions be done in a client component? 13:40 Where to use actions. 13:49 On a form submit. 15:30 In an event handler. 15:57 In a useEffect(). 17:13 How to actually use an action. React Hooks 17:30 useActionState() hook. 18:49 The state of the action. 19:35 The bound action. 19:46 The pending state. 23:16 useFormStatus() hook. 24:38 Action inputs. 26:13 Server vs client. 28:30 This is not PHP. 30:31 What is optimistic UI? 33:26 useOptimistic() hook. 37:02 Some final thoughts. 40:18 Sick Picks + Shameless Plugs. Sick Picks Good Follows: Alex Katt. Scott: Tiny Portable Ultra-Mini Air Pump. Wes: AVerMedia 4k Capture Card. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Transcript

Click on a timestamp to play from that location

0:00.0	Welcome to Syntax folks today. We have another episode for you on react server
0:05.2	components. So we did episode 718 as an introduction to react server
0:10.0	components and now we're going to do another one specifically on actions in
0:15.5	react server and components so form actions server actions
0:20.4	whatever you're going to call them will we'll explain all of that is.
0:23.3	Being able to call a server code or run code on the client without having to do a whole bunch of
0:29.2	extra work is, honestly, a game changer. I'm a big fan of this idea of actions in
0:35.6	react server components. So it's not even just server. A lot of this is
0:40.8	client-side stuff as well. We're gonna to sort of dig into it, explain how it works, a lot of the use cases and whatnot. So buckle on up.
0:48.0	How you doing today, Scott?
0:50.0	Doing great. We are right about to head out to Miami tomorrow Wes. I don't know when you're
0:56.2	heading out, but my family's heading out there and we're bringing the whole crew along. So, hey, I'm stoked, we've never been. I'm sure the kids are going to have a
1:04.8	blast going to museums and whatever they're they're going to be off doing but you and
1:09.2	I are going to be at react Miami which by the time you're hearing this is
1:12.2	long and gone but pretty
1:13.7	stoked to be out there so yeah excited yeah it's been been a while since I've
1:18.2	been to a conference probably about six months or so so it it seems like everyone is really stoked about this one as well. It seems like a really fun one so I can't wait.
1:28.0	It's a somewhat busy conference season for me this year. I'm doing J.S. Nation. I'm doing React Miami and then
1:37.6	potentially doing another one we're going to see if I can make it out to Utah. There's one in a
1:44.9	Park City at React Rally. So I'm... Oh yeah. Gonna see if I can do that or not but
1:51.0	yeah. And in November we are going to be in New York City
1:56.4	doing another live syntax as well so yeah and potentially another something else as
	...

Please login to see the full transcript.

Previous episode | Next episode

Disclaimer: The podcast and artwork embedded on this page are from Wes Bos, and are the property of its owner and not affiliated with or endorsed by Tapesearch.

Generated transcripts are the property of Wes Bos and are distributed freely under the Fair Use doctrine. Transcripts generated by Tapesearch are not guaranteed to be accurate.