Good news: My big Next.js course has just received an update to the new app router. Check it out: codinginflow.com/nextjs

Somehow you explained the process so my brain just understood everything with very little to no stress, absolutely perfect tutorial!

Just completed the whole course and believe me this is the best beginner tutorial for the latest NextJs. Everything is explained in very detail and this course really taught me so much in such a short amount of time. The only problem that I faced was with the last section(Client Side Rendering), I think I need to learn about CSR in a bit detail. Thank You Coding In Flow🙏🙏❤❤

Easily one of the best introduction videos to Nextjs 13 I've seen. I love how you explain the different concepts, your explanations are so clear and to the point as well as nicely verbose. 👍

I've just finished the project. This is literally THE BEST NEXTJS tutorial in the internet so far!!! 💯F (And possibly the only one on the UPDATED version of NEXT - 13.4) From my two years of self-learning programming , your channel is the easiest to understand and follow. I'm so grateful to find your channel! Thank you so much for your hard work, Sir. Please, keep it up! PS: I will definitely check your MERN course as well as your paid course! One loyal follower has just been earned 😊

Everyone give this man a like & sub; truly one of the best teachers on YT.

Great job man. Lots of credits from India 🎉😊

Awesome stuff man, inspired me to purchase your Next/Express/TS course! Will go through that when it is updated for Next 13, this was SUCH a good tutorial

Florian, thanks a lot! I have been reading documentation of next.js last couple of days, and now the way you put things together start making more sense. I first wanted to start watching that Learn Next.js 14 Server Actions video, but thought maybe I should give it a try to watch this video and did not regret for a sec!

Very well presented. Thanks for the free course and content. You have a great talent for explaining the intricacies of the topic.

sincerely, thank you very much! I didn't know your channel, I'm halfway through the video and I'm already grateful and subscribed of course :-) I've been using Nextjs 13 for months and I didn't have the cache issue as clear as it is now, thanks again!

Thank you for your patience

Well well done, jjust finnished your tutorial, and found it amazing, was really insightful and easy to follow along. Thank you for all the work you have put in. it was especially helpful to learn about nextJS and API calls as well as caching, truly thank you. this has change my perspective and mind for the better... lets see more content cause this was awsome!!!

I was looking for a video for my mentee, this is the absolute best on youtube. Good work !

I am always happy when I get a new video from this guy...I really like the way he teaches

thank God I found this channel. thank you sir. you made live easy for people like me

I really love your tutorial bro, did you know among all the video tutorials here in KZfaq, only your tutorials I am able to complete the code.

This was so awesome!!! Very enjoyable. Very informative. THANK YOU.

really well structured and good for beginners, this helped me to learn Next js Thanks, Florian Walther keep adding new things related to Nextjs

Thank you so much for the efforts. Just completed watching this and now this has cleared my concepts. Pls keep posting such content. 💯

Man, no words. Thank you!❤

Great stuff 👏👏👏

I have a feeling your "/hell" route returning "NOT FOUND Sorry, this page does not exist" was very symbolic 😂

Thank you very much. Very useful video for me. I'm your subscriber now. I'm look a lot of other nextjs videos, but understood it only in your. Make more videos, you is the best. PS. sorry for my english

Спасибо разработчикам Yandex & YaGPT за предоставленную услугу по переводу видео-роликов на KZfaq и не только. Благодаря данной функции, я смог в более четком и понятном формате ознакомиться с этим потрясающим и очень подробным описанием Next 13. Успехов автору в сфере обучения!

The course is good, but it utilizes hard refresh/navigation to display server-side updated data, which should not be necessary. If hard refresh is required to show the latest data from the server, then we could always use PHP.

01:20:22 To show alt text for an image its better to use {image.alt_description}

I found it to be incredibly informative.

Thank you - definitely worth watching

Your just Amazing bro thank you for you effort and Time to make high quality videos and tutorials thnx men 🤜🤛

Thanks a lot for this, I was struggling for days trying to find a way to do what you did on the client side fetching

that was excellent ! , your teaching is amazing i will be sure to look at your paid courses.

Thanks. Definitely worth watching!

Hey, your tutorial is amazing, Will u make a tutorial on how to use on-demand revalidation in the next js please I am stuck in this..

you are the best 💯💯💯

thanks!!! solved me an issue that i was struggling with.

Love you for the awesome tutorial, hate you for the hamburger part 😅

Just finished. thanks!

Thank you buddy 😁 You are doing a very good job.

Loved your teaching style brother. One of the best, I should say. When will you finish your updated course with the latest Technologies? Like Next Js 13.4, Tailwind, Shadcn UI, Zustand, mongoDb

thank you for your effort !

Truly amazing job! Saludos amigo!!

Thankyou buddy , You are amazing!

Thanks florian

Awesome course

great content bro keep it up 👍👍👍👍

Thank you for the great content... :D

Your tutorial are great, I love them. I have a question will u make a 10 min video on on demand revalidation plzzz i can't find anywhere. Previous u make a short on on demand revalidation. Please make a detailed video on this plzzz

I fell in the trap of studying full stack JS. They are great tools, but they are excellent only to get a good employee job (in a small/medium company) or creating your own product based startup. That's all. For guys like me who want only to freelance, basic fullstack php unfortunately has the most opportunities. Php is dead for employee positions, for freelance it remains king.

well done!

The fact that I can't see the spinner when trying to demo "generateStaticParams" makes the feel worried about the stability/reliability of App Router. Seems like Page Router is still more reliable at this moment.

Very cool stuff. thank you very much. I think the route.tsx should be route.ts.

Subbed!! Realistically would Next JS be used to build a backend, I use Nest JS in the day job which provides much better structure for the backend, maybe a monorepo with Next on the front end Nest on the backend would be a nice stack.

After watching German content (mainly movies on Prussia ) for a fortnight I was thinking I was hallucinating as I heard a German accent but when I checked his location It was Germany //I was relieved that I was not hallucinating btw the thumbnail was no clickbait it was all in one

I'm wondering if you can help with a problem I'm having? I've gotten through making the static page but when I refresh it always gets a new pic and there's an error in the terminal I will paste below. I tried downloading your code and it works. Then I replaced my package.json with yours, deleted node_module and package.lock and reinstalled. Didn't fix. So replaced essentially every file with what's in your version and it still didn't fix. So I'm at a loss right now. Here's the error I keep getting: Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './server.edge' is not defined by "exports" in /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/react-dom/package.json at new NodeError (node:internal/errors:405:5) at exportsNotFound (node:internal/modules/esm/resolve:259:10) at packageExportsResolve (node:internal/modules/esm/resolve:589:9) at resolveExports (node:internal/modules/cjs/loader:571:36) at Module._findPath (node:internal/modules/cjs/loader:645:31) at Module._resolveFilename (node:internal/modules/cjs/loader:1058:27) at /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/require-hook.js:180:36 at Module._load (node:internal/modules/cjs/loader:925:27) at Module.require (node:internal/modules/cjs/loader:1139:19) at require (node:internal/modules/helpers:121:18) at /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/app-render/app-render.js:955:37 at /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/lib/trace/tracer.js:155:62 at /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/lib/trace/tracer.js:113:36 at NoopContextManager.with (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:7057) at ContextAPI.with (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:516) at NoopTracer.startActiveSpan (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:18086) at ProxyTracer.startActiveSpan (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:18847) at /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/lib/trace/tracer.js:102:107 at NoopContextManager.with (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:7057) at ContextAPI.with (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:516) at NextTracerImpl.trace (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/lib/trace/tracer.js:102:32) at /Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/lib/trace/tracer.js:155:31 at wrappedRender (/Users/eleerogers/Documents/code/image-gallery-nextjs/node_modules/next/dist/server/app-render/app-render.js:1006:62) { code: 'ERR_PACKAGE_PATH_NOT_EXPORTED' }

So appreciate it ❤

Hi, thanks for this. I've got a question: in the last part of the video as much as I'm able to understand, you're using the Next.js's built-in server as a proxy between the actual server and our app. I was thinking could the same thing be achieved with server actions instead of creating a new route? As I understand, server actions open a window to the server and therefore by defining a server action, we can use it directly in a client component, right?

Hey! I was using your video on firebaseUI from 5 years ago as a reference and while making my app it works completely as intended but there is just one little issue... Whenever there is a shift of focus from the app i.e when I open another app and then reopen my app the recyclerview gives index out off bound error as a result of some inconsistency. Can you please help me?

thank you my friend

I am trying to create a PWA where next-pwa requires web pack. When I try the SSRProvider and Container on the layout.tsx, it gives me an error of: TypeError: Cannot read properties of undefined (reading 'call') within Webpack.js Is there a fix for this? I used the bootstrap.tsx file in components in the src directory

Cache and next revalidate festures only works with the native fetch API and the export const revalidate is to be used if you prefer not to used the native fetch thats why they exist to answer your question as to why they are many types

Thanks a lot sir

Using bootstrap makes this a little messy. But I like this video in general.

Thanks for the tutorial. At 41:15, I'm trying to display the error message (from the ErrorPageProps) by having {error} but tht doesn't seem to work... Is there a way to dispaly the error message on Error page (your "Bazinga" message) ? Thanks again for an awesome video

At 1:24:58 I cannot get it to work it says TypeError: fetch failed, I followed it exactly how you did it. Thanks man

Cool

1:50:27 Florian . doesn't refer to the parent folder, .. is the parent folder, . is the current one

great video, im loving the course youre a beast, one question tho, its ok to make the funcions as arrow functions on the export? im used to do arrow and works, but theres a down side to it?

I'm using React-bootstrap elements in 2024 and it works fine without 'use client' and why? Did the update come out and now they are client components?

man hört absolut deinen deutschen akzent aber sehr nices video bist nen cooler typ

Can I learn this without any experience with TypeScript yet? Just the basics on types and interface for now?

Hey! At 1:29:27 , you have the alert and image in different lines. They are appearing next to each other for me. How can I resolve this?? I tried using the tag. No change. Thanks!

Hi Florian, what VS Code plugin did you use to get that closing tag a different color ( 01:59:47 )?

bro when i use in my layout file i was get this comment on terminal ==> In React 18, SSRProvider is not necessary and is a noop. You can remove it from your app. and when i use react bootstrap accordion i am getting this error ==> \src\app\components\BootstrapReactComp.jsx#Accordion#Item" in the React Client Manifest. This is probably a bug in the React Server Components bundler.

Thank you for this amazing course! Helped a lot. The google font family isnt applied to not-found.tsx page and only that page, but bootstrap styles and fonts are. Why?

Thank you very much. Appreciate it. But when I deploying in vercel, i got a Error. "TypeError: Cannot read properties of undefined (reading 'raw')" I think the error occurs because it doesn't read the exported interface, or because the variables don't seem to have any data when I build them. So I forked from your github (final-project branch) , and try to deploy vercel, but got a same Error. What should I do?? plase help me!!

Hlo sir can we use server components inside a client components I am using useref in sidbar inside sidebar i rendering a another user profile component using getserversession next-auth user info is it secure, sometimes I got error unhandle error server error.

what is the justification for using next/navigation for the appRouter hook and not next/router?

hello florian one question...when i hard refresh a static page in development mode it shows new image is it normal..? by the way thanks for the video so grateful 🙏🙏

Text size needs to be enlarged. It is small even at full-screen.

I wish this tutorial was more approachable and was written with JS instead of TS, because I saw the intro and it sounds really detailed and great. Thanks anyway..

Hi, can you make a next js 13.4 typescript i18next video?

Can you make a course to teach us about css/bootstrap?

Why you move from the android world to the js can you make a video about it you spent a lot of time in the android ecosystem so is it worth it . I want to make this transition not bc I hate android just i think about future and job security

Can anyone please clarify my one doubt.. so getStaticProps getServerSideProps not required?

Can someone assure me that I can follow this tutorial for next.js for till this time also ?....because this is next.js 13

If i want data to fetch each time i visit the route i need to use a client side component with useEffect?

Cool. Can I get the Complete Source code

How to get emoji in VS code

Du könntest auch gut auf deutsch präsentieren!! :D

Thanks, Why JS and not Spring (Kotlin)?

🙏👍

Dear sir, me from pakistn, please create video in this video only development work no css .full stack next.js 13.4 backend post one click add title, description, or image or pdf file add then other post only video title desc or description or vide add. last signup or sign in page. create... in simple way

Thanks a lot!! the content is very helpfull :) Only your pronunciation makes it real hard to follow.

Can you do cs50X2023 course

+

1.02.22 with one 's' 💀

Did you just describe javascript users lunatics??? 😂😂😂

Amazing! You actually manage to get this out lol

EDIT: nevermind, i realized that the hamburger only activates at a certain screen width haha Question: in NavBar.tsx, but the Hamburger menu isn't there and the Hello link is just adjacent to the NextJS Image Gallery link. any likely reasons why it isn't showing up even with the same NavBar.tsx?