5 Tips and Tricks To Make Your Life With Next js 14 Easier

[@tali6616]

I like how you not only explain the needy-greedy, but also create this friendly atmosphere. I don't even feel like I'm studying, more like speaking to a good friend. I also really enjoy UI design solutions like in courses, simple, but tasteful

[@tigana]

I feel the same. He’s a great presenter. Very friendly vibe

[@nyahhbinghi]

nitty gritty bro :) not needy greedy haha

[@jamesauble8091]

i was confused about this as well, but you don't necessarily need to mark a component async for it to be a server component. It will be a server component by default unless marked client. Marking it async is only needed if you're gonna use await within it.

[@jack_mc8]

I love your mood, it cheered me up since the start, thanks!

[@ChrisChristensen143]

The camera stare after "blue balls" 😂😂😂

[@DK-sq7of]

I’ve heard/read people suggesting not to use server actions for fetching data(GET), but instead use it to mutate the data. What’s your thought on this?

[@developedbyed]

I guess the only thing would be that it makes a Post request instead of a GET.. that’s pretty much it as far as I know… you could just do a fetch directly in the server component if not

[@fakeitsoyoumakeit]

this is the only channel that doesn't make me bored 🤓

[@ajiteshmishra0005]

What is the difference of using in header and body?

[@DanielSpindler-gc7xh]

what would i do for tokens? would i handle that in the route handler when i need the cookies?

[@danielpiedraquintero]

‘use hybrid’ will be amazing

[@aaronshunter]

0:40 did my hair just grow back? 🤣

[@coltonaallen]

Top-notch planning there

[@hamirmahal]

At 15:28, what's the extension that shows you the import size? Thank you for the tips in this video.

[@naminami3180]

import cost

[@vignesh_m_1995]

Suppose we have a table in a Next JS page and the table has a filter (client) component with interactivity. When we hit Apply, how do we pass the filter values from the client child to the server parent component. (The parent fetches the data and renders the table). I can see many suggestions to pass the data as params or queryParams using revalidate or nav methods of next. That works fine for a simple values like ID or search params. For example, if it is not just an ID but an object (advanced filter similar to the one in Amazon), should we just pass the entire object via the query params and make the URL bloated with so many values or are there any alternate way to communicate from client child (filter) to server parent component (where data is fetched) ??

[@thibaultvl]

Hi there, plaiceholder is archived now. What would your advised way be to get a placeholder blurred image for remote images?

[@wuffgang5333]

but do blurred image make any sense if the remote image must be loaded for blurring?

[@ExileEditing]

Copy pasted from my other comment: I'm not sure exactly how this works but my take on this is that a package like plaiceholder will fetch the image on the server and doing so results in consistent image loading times because it doesn't rely on the users internet or device speed to load it. Then, when the user loads the page, it displays that blurData instantly due to the small size while the full res image loads in the background. So I believe maybe just maybe if your download speeds are fast, it would be better without blurring, but this helps to keep it fast and consistent across all devices and internet speeds for all users.

[@wuffgang5333]

​@@ExileEditing Got it. thank you for explaining.

[@Al7alafawy]

THAT WAS AWESOME!!!! You LITERALLY solved all my troubles😅🥰🥰

[@alaaeddin9153]

as I know next js is using server by default so we don't need to type 'use server'

[@tomspatula616]

Hi Ed, legend video as always!

[@RaulReyesOnline]

Great video! How did you enable "Intellisense" to see all the exports from a file when doing the import statement: import { _click-here-and-reveal_ } from "/path" ?

[@marketmov7796]

It's safe to include public API endpoints with NEXT_PUBLIC if they are meant to be publicly accessible and don't require any form of authentication or sensitive data.

[@FG-td4vs]

well yeah obviously....

[@theDanielJLewis]

What's the point of blurring a remote image like that? Is that actually making the blur any faster than displaying the image would do?

[@ExileEditing]

I'm not sure exactly how this works but my take on this is that a package like plaiceholder will fetch the image on the server and doing so results in consistent image loading times because it doesn't rely on the users internet or device speed to load it. Then, when the user loads the page, it displays that blurData instantly due to the small size while the full res image loads in the background. So I believe maybe just maybe if your download speeds are fast, it would be better without blurring, but this helps to keep it fast and consistent across all devices and internet speeds for all users.

[@developedbyed]

Shoutout the the guy that called me a hobo in the comments! Cut a fresh cut boyyy

[@6uiti]

I looked for hobo comment but I can't find it and now I'm disappointed

[@mDHARYL]

What does hobo mean?

[@coltonaallen]

​@@mDHARYLa term for a homeless person

[@darwinmanalo5436]

lol

[@alaaeddin9153]

no need to import images from public folder, if the image is under the /public folder directly you can just type the name of the image and its extension. src="img.jpg" if it's under subfolder in public let's assume it's /media folder src="media/img.jpg" you need import only if the image isn't in public holder. --- Thanks for the amazing tutorial.

[@ivanandreev1026]

Helpful. Thank you very much.

[@nvsWhocares]

Good video. Your server actions example is unfortunate though. Sorry for calling it out: Server actions are for mutating data not for getting data. By making your getJoke a Server action you basically did create a route handler for it under the hood. So the exact thing you rightfully said to avoid one step before. In your example you could've just left out the "use server" in the top, to not make it a server action but a simpe reuseable async function.

[@tauhid97k]

Server actions are much simpler to use. I do use server action for GET, POST whatever. If it works then why not? My whole E-commerce project is built on server action. I see no performance issue or anything.

[@developedbyed]

Whoops that was my bad! Absolutely! I do recommend directly fetching in server components. Should’ve made it a bit clearer that when you use a server action it also explicitly creates a POST instead of GET. Thanks I’ll talk about it in a future video 👍

[@thetruekobby]

Please will Nextjs still cache the data without "use server" at the top? @nvsWhocares @developedbyed

[@haktanalbayrak384]

What is the name of the theme? I like it very much

[@MrSpinozadp]

Wooww really cool tips! Thanks 🙏

[@EttoreMihaili-s4g]

using actions for data fetching is wrong and an antipattern. A server action is just a remote procedure call, meaning that you basically call an api endpoint. what you suggested makes you do exactly what you were trying to avoid :)

[@Agustin-jo8mv]

Hey your Javascript "Full Course Download" link is broken. 😢😢😢😢

[@sellimenes]

Thank you for the video! I just didn't understand the difference between fetching data in API routes or in server actions. I am always using server actions but is there any benefits using API routes to fetch outer data?

[@developedbyed]

Server actions will always create a POST, that’s one of the cons and also you can’t fetch server actions in parallel, I need to make another video about this tbh 😅

[@sellimenes]

@@developedbyed yes I would be so happy! Thank you. 🙏🏻 I also have big problems with revalidate and even in GitHub issues too many problems about that. Video could be great. When I use revalidateTag, caches in the exact page deletes and refetch. But if I change the page, still old data is shown everywhere. It's not the expected usa case I believe.

[@sellimenes]

​@@developedbyed Thank you so much. I will be waiting for the video. 😅 Also, I am having big problems with revalidateTag. Even in GitHub Issues tons of posts about it but not solution. When we use revalidateTag, it deletes the cached data and refetch it in the exact page only. When you change the page which has the same data (website name for example), there is still the old data. It mustn't work that way I believe. Video would be great about revalidate in general either. 🙏

[@fsociety.dat101]

I used to watch this channel. I wish I stuck with coding. But once I got the job after self teaching nearly everyday, I just felt overwhelmed by it all. Now I still work a shitty retail job and at 34 years old, I'm bloody ancient.

[@cb73]

I just turned 50. I’ve been a web developer for 20+ years and I never get bored. I learn something new everyday. It’s not too late to jump back in.

[@HisSonsMusic]

To anyone experiencing hydration errors using next themes , the trick is to put it under the body not above, took me a minute.

[@DevAdeniji]

Really helpful Thanks!

[@developedbyed]

No worries!

[@renjielin1065]

I like your font , what's this ?

[@raj080288]

Nice one dude! What are you using for auto suggestion code?

[@developedbyed]

I'm on and off on github copilot hahaha

[@raj080288]

@@developedbyed haha is that free?

[@bennysmith4557]

8:27 legend

[@ragtop63]

Are you related to Jeff at CraftComputing? The resemblance is uncanny.

[@sebastianidzkowski6810]

You got nice hints, it was some plugin? I

[@codernerd7076]

Any discounts for the course it's priced way too high for my buget

[@sortingarray]

Great video but your hat was missing! But I'm still struggling with the next js font

[@justmeddling]

Thanks baby reindeer sent from iphon

[@knezevskia]

I came for the 5 tips and stayed for the blue balls.

[@AndreyBelfu]

cool Thumbnail

[@AnasKhan-fi7xk]

Best content

[@MuhammadFajar-os1fq]

perhaps sir, i think the video will be better if you use the better mic🙏🙏

[@ys1197]

11:00 this

[@aymenbachiri-yh2hd]

THank you so much

[@khaldounal-nuaimi3594]

nice haircut!

[@BrendaKincaid]

@developedbyed If you were referring to me, I am a woman. But thank you for indeed cutting that hair.

[@ilirbajrami2902]

So you knew that you are going to have a haircut beforehand? :D

[@anthonymifsud6141]

I like your cut g

[@developedbyed]

ayyy thanks

[@Wenlu_]

waddup pewds

[@fsociety.dat101]

Make sure you are looking after your health man. Make sure you are eating enough.

[@KnowledgeBoxMM]

First comment 4 my legend ❤

[@simoncallelaverde]

npm run dev ed

[@mohaimenkhalid3844]

cool

[@AndrewClunie-pt8ww]

this dude is on acid

[@learnings.academy]

where is ur first channel?