The Future of Forms in React with Aurora Scharff

in this video I'm super excited because we're going to be talking about the future of forms in react and this video is very special because we have a special guest Aurora sharf I will let her introduce herself in just a moment but essentially what we're going to be doing in this video is we're going to be talking and kind of doing a mini interview I guess if you will but we're also going to be looking at code and specifically comparing the old ways of doing forms that you probably know and are familiar with to the new and modern way of doing forms which is going to be super cool I'm super excited I really enjoyed making this video and I hope

that it's going to be very educational for you so without further Ado let's get into the video Welcome everyone uh we have a very special guest today in a very special video I'm super excited I'm here today with aora sharf and we are going to be talking about forms in react and specifically forms on the server which is very exciting it's very new and it's the direction that react is going in and I as well as you we're kind of here to learn from or expertise because she has

expertise in the field and we're going to look at some examples of forms some actual code because I know that you guys love code we're going to look at codes talk about it n it out a little bit and then just have have some fun so how does that sound Aurora that sounds great thank you for having me here perfect thank you for being here so first uh because my audience doesn't know who you are would you please give us just a very short introduction on who you are what you do and uh yeah get the audience familiar with you yeah okay so uh my

name is Aurora I'm a web developer from Norway and I work at in meta which is not meta it's just a consultancy here in Oslo uh and I do uh I work with nextjs app router and server components in my day-to-day project here so that's kind of where I get my inspiration and my examples from a lot of the time and then I do this conference speaking on the side uh pretty much that's it and try to bring my what I'm learning into my talks and share that

perfect yeah so I like that you mentioned the the conference so that's kind of the the main reason why we're here so we're also here to promote uh the conference it is the react Berlin 2024 conference and Aurora is one of the speakers and I've been given the opportunity by the conference themselves by G nation to actually conduct this interview in a way to promote the conference so Aurora what is your talk going to be at the conference um so my talk is called enhancing forms with react Serv components and it it's trying to in a

practical example showcase all of these new features and how uh what they enable us to do uh and also blend in a bit like General server component patterns as well where are relevant perfect great yeah so yeah that's the reason we're going to talk about uh forms and server components and all of that today I have here on my screen Ora you're not seeing this but I just have like the the the landing page of react day Berlin just to kind of show all the speakers there's really cool speakers attending the conference I will also be there

personally so that's the first time that I do something like this so to everyone watching if you want to meet me personally hang out nerd out about react check out the conference and come pay us a visit and also come check out Aurora's uh talk cool so in the spirit of the talk uh I want to actually look at some coat right and we have here some examples of um forms in react now we're going to try to kind of compare the old way or I guess the classic way of doing things of forms uh and compared to the

new way of doing things which is more server Centric right and using all the new and latest and greatest hooks from react uh to kind of achieve I guess in a way The Best of Both Worlds so what I have here currently in front of us is a component called signin form one so this is the old or the the classic way of doing things right so I'm just going to quickly go over the code it's nothing really fancy we're using react hook form we're using zot and it's a pure client site component so as you can see at the top we're using use client we're inside of an xjs project so this is a client