Next.js 14 - Server Actions TUTORIAL | Type Safety, Error Handling, Pending States

Getting close to finishing the Next 14 Course, stay tuned for the update.
developedbyed.com/
Resources ⛏️
nextjs.org/docs/app/building-...
github.com/TheEdoRan/next-saf...
🛴 Follow me on:
Twitter: / developedbyed
Github: github.com/developedbyed/
Dope tracks 🔥
Shofel - Balcony chll.to/8d7e18be
#react #nextjs

[@TheEdoRan]

Thank you so much Ed for featuring next-safe-action! Very glad you find it useful.

[@developedbyed]

Let me know if you want me to make a demo for optimistic updates as well 👍👍

[@Logicmontana]

AM YOUR BIGGEST FUN , THANK YOU GUIDANCE IN MY WEBDEV JOURNEY

[@willystain9870]

please show us the way

[@sureshmutluru4532]

Yes please

[@poizonncs8264]

Yes yes yes

[@alexandersanchez9242]

Yes

[@Logicmontana]

Hey there ED That's fantastic news! I'm really happy to hear that you found this project helpful. It's always a good idea to have server actions that prioritize type safety and error handling. I must say, the demonstrations you shared are really informative and highlight some key aspects of server actions. It's great to see that Next.js 14 is bringing in some handy features to manage loading, errors, and success. Thank you so much for sharing this valuable information!

[@Logicmontana]

[@marvinkr]

Glad to see you back! Saw you switch from tRPC to Server Actions in your repo. Is it due to the "experimental" stage of tRPC with server side calls?

[@sudoalex]

Welcome back Ed!

[@atifali3485]

waiting for the course!!

[@mihirkhode8289]

thanks, for introducing new packages. 👍

[@BeepBoop2221]

I hope you are well Ed

[@sK4hsCz]

thank you very much ed! :) you explained it so well, now i'm getting this rocked. thanks

[@developedbyed]

Rock on!

[@neeshsamsi]

I've really been struggling with the prettier endlessly loading 11:08. Have you found a fix. I pruned unnecessary extensions and other things thinking there was too many extensions but it still happens often.

[@dummymail2495]

When will your next14 course be published?❤

[@doriandoussain1528]

Give it a shot work for heroine too, that's a double, nice shot

[@mdsafikulislam9113]

Please make a full playlist of NextJS 14~!

[@eca8799]

hello one question about min 6:15 , in my app the values look like this: type Ingredient = {
name: string;
purchasePrice: Prisma.Decimal;
}
and I'm having an error ("Only plain objects can be passed to Server Functions"), so I have to to do addIngredient(JSON.stringify(values)) in the onSubmit.
and in the definition of the action, undo by doing JSON.parse(ingredientData).
how would you deal with that without any additional package?

[@tnnz9920]

Sir is possible to fetch API from external in server action? I always got status code 303 even its succesed

[@JohnBuildWebsites]

Any idea why I might keep getting a fetch error when using `next-safe-action` saying "TypeError: Cannot redefine property: $$id". Works fine doing a raw db.insert without next-safe-action

[@massinskendoul9640]

Amazing thank u Deved

[@developedbyed]

yeah no worries! always around 👍

[@massinskendoul9640]

​@@developedbyed and we are always here to see what you bring us, in Deved we trust. 😁

[@Dhanushsaji]

What's the benefit using server actions over API?

[@mhraihan7422]

great one

[@marvelousadesina4673]

HE'S BAAACK!!!!!

[@adarshdalvi9772]

I'm new to nextjs, consider me dumb. Even we don't write 'use server' on top of the file , it automatically becomes a server thing? like we only need to decalre 'use client' if it's a client component, otherwise it's a server thing by default?

[@rodneypaul9430]

yes next js components are server components by default use the 'use server' when writing server actions not components server actions are just like functions which interact with the db directly without apis

[@XeKT0r]

AWSEMOE !!

[@midlajj]

Can you please provide the source code of last product adding form shown in this video...?

[@quoclam7140]

Can you make a video of how to do shadcn without typescript and nextjs?

[@Zaromir]

My body is still ready

[@Adrian_Galilea]

Can you drop the repo? :)

[@dahliasan]

what is the difference between this method vs using react query?

[@dwin9983]

react query is used for apis and next-safe actions is used for server actions, they pretty much work the same though

[@s3nTer]

​@@dwin9983web dev field is a mess, glad I moved away from it. Those mf keep reinventing wheel over and over again 😅

[@brienaustinclayton]

Server actions are more advantageous right ?​@@dwin9983

[@user-wy7mu3kx1h]

Where is the code links?

[@rastikrastikk2289]

Make a lot next js project

[@Logicmontana]

SECIND ONE HERE

[@ShanakaDushyantha]

Hey I got a challange for you, (Actually I faced the same & no anyware to go 😭 😂),
Need to build a login & perform Remember me using access Token & Refresh Token which is provided by third-party backend server
Use:
Next Js (App directory: latest)
Next-Auth

[@skorotkiewicz]

You need to start using Prisma for database with postgres.

[@developedbyed]

Prefer drizzle over prisma 😊

[@RhanaldiDennis]

can you sponser me two 8gb ddr4 ram vscode can keep up

[@user-xu3lj1ej8d]

WOW

[@Gyurmatag]

Source code?

[@devoxygen7395]

[@rhodler]

8:35

[@theDanielJLewis]

Can someone please vacuum his mic pop filter? 🤣

[@sohamdebnathpopo]

so many packages. would prefer long(er) lines of code rather than using lots of packages. IMO.

[@shahidullahmuffakir668]

Can i watch it without getting drunk?

[@poizonncs8264]

Man you are being lazy, people are waiting for your videos, including me 😅

[@BeepBoop2221]

I hope you are well Ed