Good find, buddy. A short vid like this explaining your page loading bar would be golden.

This is actually really cool. Will use it for sure.

Great stuff as always, can't wait for an in-depth video of your starter kit. As someone who does C# at work & js as a hobby i'm hoping you will add ci/cd with AWS ec2 or other for your starter kit . Many thx for your content!

Great, I've implemented my own action wrapper, but this seems way cooler.

Sick. Thanks for sharing.

Hey cool, thanks for sharing, this will definitely help.

Good job babe!

Since you mentioned zod, is there a good way to make it output errors in different locales?

That looks very much like tRPC (Especially on the backend and client side) Server Actions do have many advantages but I think for most cases I will use tRPC (client side call)

@skyhappy

23 күн бұрын

Server actions are unnecessary bloat. Just use a normal API endpoint

@JakobRossner-qj1wo

22 күн бұрын

@@skyhappy I dont think so, there are quite nice, especially with this helper. tRPC gives you typesafety and server actions allow you to make your form work even with JS disabled. There are more advantages for both of them but these are the most important ones for me.

@PhillipLippi

22 күн бұрын

@@JakobRossner-qj1wo JS disabled, ok. Tell me how many digital projects you'll need JS disabled? maybe 1%? Lets be honest, it's 100% better using Client side for UX / UI purposes. It's not like your application will be heavy and unsafe for not using Server action

In your implementation, in your middleware, does that mean every single request has to hit the db to get the current user?

Hi cody can you share how do you have multiple apps in one Next.js 14 project ?

Lovely video, I just started using server actions and this will help me handle those. If possible could you make a video related to server actions? and if we should use them instead of regular API call. Thanks

Great content as always bro. If you’re using convex db do you need server actions? And what web api or library are you using to get the user IP

@WebDevCody

22 күн бұрын

No with convex you invoke their mutations and actions directly which has its own form of parsing / validation. The ip is just coming from inspecting the headers

I mean, if you have auth in your application cant use just check if the certain individual exists and has proper access to the protected endpoint? Do you mean for open endpoints?

@WebDevCody

23 күн бұрын

Yes, but I’m talking more about parsing input (like verify an email is actually an email format)

@yugaank100

23 күн бұрын

@@WebDevCody Understood, so something like safeParse?

Bro how you do rate limit can you please tell me

yes im using it.

This seems similar to TRPC but for server actions, cool.

Would you consider this as necessary in production? How could I protect my server actions without this package?

@WebDevCody

23 күн бұрын

You’d at least want to parse the inputs if parsing is necessary. For example if your server action takes a number for an argument, technically someone could send a string, so you should check that (typescript won’t check it for you at runtime)

@tsykin

23 күн бұрын

@@WebDevCody Thanks for explanation! I will definately check that out

@ValipPowa

23 күн бұрын

@@WebDevCody wouldn't zod be checking that FOR you? isn't zod checking on the server? when the actions are on the server?

@WebDevCody

23 күн бұрын

@@ValipPowa yes, zod checks it for you, which is why I’m using this library to have zod check for me

how do u use server action in client component. Like with this startTransition thing, i truly don't get it

@WebDevCody

15 күн бұрын

you need to define the server action in a separate file, and if you do revalidatePath or redirect inside the server action, that's when you need a transition where you call startTransition(() => myAction()). The transition is to help keep any button spinners or loaders in place as your application is trying to refresh the other parts of the app after a redirect or revalidation

What theme is this? And the gutter colors ?

@parkerrex

23 күн бұрын

shades of purple // indent rainbow

@WebDevCody

23 күн бұрын

Bearded theme stained blue

the idea of using this lib is to mostly use client forms instead of forms in server components, right? I see in docs they say "Functionality is limited in this case"

@WebDevCody

23 күн бұрын

Yes I think so. I use client components for all my forms anyway

@ESArnau

23 күн бұрын

@@WebDevCody why? Curious

@WebDevCody

23 күн бұрын

@@ESArnau because often I need to show a toast, pop up a banner, show confetti, etc after a user clicks a button. You can’t really do that unless you add things into the query string to show a toast after revalidating the path.

@ESArnau

23 күн бұрын

@@WebDevCody I see, and why would you use then this next-safe-action approach instead of trpc?

Have you ever encountered issues when using useAction to create a form with a file schema?

@WebDevCody

13 күн бұрын

what do you mean by file schema? like uploading a file to the server action?

@lengockhoe7757

13 күн бұрын

@@WebDevCody I think having issues by Zod : z.instanceof(File)

Really nice library. But luckily I never really switched to using server actions and stayed with tRPC for all client component stuff. It essentially has the features this library offers built in. Also I prefer handling loading states, error states and all the good stuff using tankstack query (which is used by tRPC). Server actions are cool if you only have like 1-2 forms, other than that I still recommend tRPC

@northerncoder

23 күн бұрын

This was what I was wondering. I’ve already understand react-query.. why would I throw that away to learn server actions?

how you will pass files in safe action

@WebDevCody

23 күн бұрын

I’ll be trying to figure that out soon

Hey cody, make a one shot video of a complete project in next & also websocket ( if possible). But make sure without any 3rd party library like convex, firebase etc..

23 күн бұрын

Something like how do you start a new project, how to set it up, what would you use, etc. Thanks Cody

jeez, frontend is complicated (and I am a frontend dev)

What's inside your "@/lib/session"?

@WebDevCody

20 күн бұрын

Just wraps next auths get server session

Hi sir I saw rate limiting code in your application ca u give us examples of free rate limiter Just like express-rate-limiter In express js It will be very helpful for us Thanks 😊

@WebDevCody

21 күн бұрын

I published a video today on it

sounds they're taking inspiration on Remix. Good!

@anton9410

23 күн бұрын

ohh really, can you explain why exactly since i havent dealt with remix

Why is this so complicated in react/next? This could be done way simpler. I am the only one thinking so? Not working on react, but like the Content. But this makes me love vue even more when seeing such "simple" things blows up so much code. Wouldn't that be handled though middleware group, limiter and cors already?

@WebDevCody

15 күн бұрын

I'm not sure what makes this complicated? it's just a function which runs validation using a schema. it's no different from adding a middleware which runs validation against the form post data.

Are you still using upstash for your rate limiting?

@WebDevCody

23 күн бұрын

Right now it’s just in memory because I host on a vps.

@iken_ar

23 күн бұрын

​@@WebDevCody can you make a video about it, most of us using vps/dedicated server rn 😶 thank you!!

@WebDevCody

23 күн бұрын

@@iken_ar sure

i gave up on server actions, and nextjs as a whole. dev experience seriously sucks when the project grows in size. I'm finding a better and more performant experience with vite, hono + bun and tanstack router

OMG Sheesh Why?

why not just make a post api route'!

@WebDevCody

23 күн бұрын

Because I want to be cool

lol this is full circle ... add server code into front end and then step by step realise why having api server was actullly a good idea

@Fuzbo_

23 күн бұрын

Yeah the more I’m seeing additional steps outside of the simple example for server actions, I’m wondering what (if any) benefit there is over something like tRPC.

2

23 күн бұрын

Latam moment when this video doesn't load up 😵‍💫

A library to fix a problem inherent to nextjs. And this is why I hate the state of FE development

@DesiMatrixXD

23 күн бұрын

Not just frontend development, this is the problem with entire JS ecosystem.

@WebDevCody

23 күн бұрын

How is that a problem specifically with nextjs? If you made a rest api in express you still need to validate your user inputs

@DanteMishima

23 күн бұрын

This is a nextjs problem.... The rest of us in FE don't have these problems

@WebDevCody

23 күн бұрын

@@DanteMishima but server actions are backend. It sounds like y’all think server actions are front end related features

@RedVelocityTV

23 күн бұрын

You're clueless man

how about you create a safe api endpoint and add cors so you don't have to overcomplicate some useless bs? like this is a joke