Video

When starting off this example, is it necessary to do some configuration before it can be used? It is immediately giving me a error upon first npm run dev - Error: connect ECONNREFUSED ::1:5432 Do i need to create a server it can communicate with before this example can be used?

This was great. Thank you

Hi, I'm having a problem using authjs, when the admin deletes the user from the admin dashboard or database, then the user who is deleted should be logged out and their session cookie should be deleted but nextauth is not following that behaviour or maybe I'm not setting things up correctly, so If you have any idea about this then please let me know, and I'm using the "JWT Strategy". Thanks

npx create-next-app --example with-tailwindcss image-gallery no need thanks 😃

awesome

I want to thank you for this excellent introduction to authentication in Next.js

this thing definitely gonna hurt my head for a few days. thanks for the video.

It is a shame that server components can initialize context.

I added the server only imports to my data access files, but I had to remove it when I wrote some import scripts. Is there a way to share data access code between my server components and CLI scripts?

I looks nice form first view. But if you had localisation with page router, that comes out of the box in Next 12, you won't have possibility for incremental transfer you routes from pages to app architecture. You can imagine that you have app with 2-3 years of developing by 6-9 developers, and now you should swap in one step all your entire code base to the new app router.

I'm following this example to the tea and when I submit my form, in the network requests, I'm keep getting a 404 status from the server-action-reducer.js

Authjs is still in beta 😢 When will it be ready for production?

I just finished watching the full video. So interesting and helpfull! Ijust completed a FullStack WebDev Botcamp and after this video everything makes even more sense! By the way, for the numbers, the font that you are looking for are monospace fonts. Cheers!

Hello! Great video! I am a UX-UI designer with some front end skills. I am diving in design system, tokens and the whole ecosystem that gravitate around it. Naturally I am wondering how to integrate Tailwind into that, and eventually landed here :) Now I am wondering why, if you took the time to properly design the UI in Figma, trying to be consistant with the spacing, etc, why you only use it as a visaul reference once you are coding? Why don't you just check the editable Figma file and read the style value? I am really curious about that, because that would explain so much about the difference between the design and first delivery on stage environment? Is it a common practice? In advance thank you for the answer!

Then why do we need to annotate with "use client"?

I also do this. But the example is pretty small. When you start getting to 500 line files with a lot of useState and useEffect type logic I find it helpful to break it down into a folder. Not the components folder, just the folder where this code was before.

please share the repo ??

We need more videos like this! 💪

What ' that theme?

What's that theme?

I've been doing it that way and I concluded with this rule, if the component is going to be used in multiple places it makes sense to put it in its own separate file, if it's only used in one parent component or it accompanies an exported parent component at all times I keep them is the same file. Except when you're using Next and a component needs to be flagged as a "client component", then you're forced to extract its logic to its own file.

Lemme join the chorus of "oof, really can't see this as a good idea" - esp. with Tailwind, you've got a ton of code to parse if you want to refactor anything or especially work with someone(s) else on the same project. I think this implies you do a lot of solo work perhaps?

I usually write components up to 150 lines of code until I make sure everything is working fine and then start breaking them into smaller components only if I need to use some part somewher else or if they need to get larger than that

won't this introduce a slight flickering in the styling until the path state is hydrated?

I do search components using vscode shortcuts. For example I do just Cmd + P then write component name. And bum here it is. But in your way, we have to use global search. Also css may messy. I may try in small projects but, in real world projects hell no

Thank you, I actually look for exactly this pattern for my NextJS project

What's this VSCode Theme? Looks clean & minimal.

the goat has spoken

Excellent video. Question, what is the theme you use in VS Code?

How is it different from useSelectedSegment

What is the theme extension you're using

Love next but returning a 200 on an Error from the server actions feels very very wrong

Naaah bro you are drunk for sure

Do I have to export all compound components explicitly? I mean should I default export Breadcrumb then export function BreadcrumbList(){}, export function BreadcrumbItem(){} and so on. With this way I can use Client Compound components inside Server components but I have question. Why I can't use them like export default Breadcrumb, and then no exports just Breadcrumb.BreadcrumbList = function (){}, Breadcrumb.BreadcrumbItem = function () {} if I do it in this way it gives React Client Manifest error but why?

I personally dont enjoy reading through large files. I get lost quick.

Thank you for a basic tutorial

Is the source code already public for this ?? This approach is quite common in enterprise application and complex codebases but i would say proprr folder structure is better than having everything in one file like this.

If it's just you fine. If you're working with others, you need to clean it up fr

I hate vertical scroll though so probably not for me

this can be solved using proper folder structure

No database session in nextAuth credentials strategy, hence why i prefer Lucia Auth

I would do that, but these components are usually client components, so i would have to create a new file anyway

thanks

i got this error below when using getSession() on the middleware and other page. also the cookies is suddenly got deleted in random occassion. although i did the exact same method with your example. node_modules\jose\dist\browser\lib\jwt_claims_set.js (89:18) @ default "exp" claim timestamp check failed

post the code?🥺

Wow always your contents cool and helpful thanks. Please a lot clone coding course

in your dashboard layout, how do you highlight the current page (products and then customers in your demo)? since usePathName is client side only, do you use headers?

I wanted to use Zustand to have my user data and token in a client-side store, the I made my <<root template.tsx>> as server component and did the "get token and user" logic there and wrapped the zustand Provider around the children of the component, since I couldn't use layout.tsx because it didn't update I used template.tsx instead is it a bad practice? what should I do? I am using Laravel as my backend service please answer I need your help

state returned from action always contain: 0:[$@1, “development, null]. how to remove that?