Authentication Doesn't Get Easier Than This
ฝัง
- เผยแพร่เมื่อ 21 เม.ย. 2023
- Really doesn't. Let's compare the "traditional" next-auth approach with a whole different approach from Clerk, one I've come to enjoy over the last weeks of extensively using it for a full-stack project. However, there are 2 trade-offs you need to keep in mind.
My links
My GitHub: github.com/joschan21
Discord: / discord
Video links
NextAuth: next-auth.js.org/
Clerk: clerk.com/
Very interested in hearing your thoughts on this. - วิทยาศาสตร์และเทคโนโลยี
![[Full Episode] MasterChef Junior Thailand มาสเตอร์เชฟ จูเนียร์ ประเทศไทย Season 3 Episode 4](http://i.ytimg.com/vi/e7Oqqo90x_w/mqdefault.jpg)
Man I love you, never change your content, as user experience designer who wants to learn code and create his own business, your channel is helping me map out the tools that I need to have under my tool belt to have the best dev experience and for that thank you. A suggestion I have is make your tutorials incremental eg. One episode you introduce next js, second episode let’s say typescript, third episode clerk and fourth episode create Airbnb with next js, typescript and clerk. Put that in a playlist and voila we have a fullstack course on our hands. Keep it simple and omit too technical jargon that’s unnecessary.
Once again thank you
Thanks for covering Clerk :)
About a month ago I was confused whether to use clerk or not, common reason was very few people were covering it. Finally I decided to use it, and yes it's really good.
or maybe because their pricing is insanely overpriced
Your content is awesome, Josh. Thanks for sharing.
Clerk has been awesome, I still ended up creating a users table and pass the basic info such as name and email to the schema from clerk so that I can then pull a list of emails and send newsletters.
how did you do that pls tell me
I'm using fast api as the backend, as far as I known, there is no official pip package from clerk. May I know how did you get all the user information from clerk?
Great video. I am also tilted to the control side as a developer but I also understand the benefits that these solutions provide. I must say they are very generous to offering a well thought-out ux for authetication, and if you don't have the time and expertise, I suggest you opt in for it.
Good point. Always skeptical when it comes to these graphical tools that don't involve code too
I use cookie sessions for my project (based on express-session). It's easy to implement, it's fast with Redis, and I completely own my auth.
What do you think about cookie sessions?
Hey @codinginflow how do I use cookies in auth, do you know any tutorial that I can learn and use cookies in my next project?
@@AlgorithmDoctor Nextauth uses sessions + cookies automatically if you connect a database adapter
Teacher great video, I have a question, such as customizing the login screen and registering in my local language; In my country, we do not use the English language.
interesting, but do we need to pay if we used it to certain degree with clerk ?
Can you suggest an OAuth lib for a React project with an API as a back-end, other than passportjs? I don't like reading poorly written OAuth docs.
The clerk expressRequireAuth middleware 1:58 is impressive, any idea how we can create smth like that for next-auth? It seems challenging to protect backend API routes if we have separate backend/frontend projects.
Your content is great, keep going!
I was also thinking about this thing where I was trying to use express+nextjs
We can attach the user session in the request header manually for every API request. I don't think this is related to next auth because it is not related to sending a fetch request. So if we manually attach the session, we could get it from the express app right? Can create a middleware function in express to check the whether the user session is available
I have recently built a Nextjs application and used Auth0 for the authentication. It looks the same in terms of user dashboard and functionality is similar and the code syntax is simple too. Arguably it’s more battle tested? Haven’t heard of clerk before but glad to know of an alternative. Keep up the good vids 👍
From the most known authentication platforms, Clerk is the the most similar to Auth0, but Clerk beats it.
@@shawn-skull but openai uses auth0, not clerk.
@@twitchizle auth0 is expensive
@@yatsuki_i2918 clerk is also not free.
@@twitchizle true but it’s way cheaper
Also, authentication doesn't get cheap with this 💀
Yep definitely not, fees are gonna be quite high once you reach some scale
@@joshtriedcoding i would prefer to have my own authentication setup in my machine than using 3rd party lib, since it cost 0 money.. so i can focus on scaling with edge tech
@@ashron4472 time is money
Once your PoC starts to generate some revenue, and you are able to hire some engineers, sure you can switch to free open source authentication methods.
Actually it is more costly than supabase. I ended up thinking about using authjs with supabase.
Hey josh, can you please tell me how can I know the current URL/path am on to set my navBar button active (Server Component in Next 13). For example if I am on my home page, the button should be active/green-color-bg.
I have searched alot and but there is noting on the internet about it....
Can we add 2 users using clerk? Like suppose I am building an e-commerce platform, I will need seller registration, login as well as buyer(Client) signup and login?
I’ve been searching for something like this for quite some time now.
Thank you so much for making a video about it. 🙏
cheers dude
I was thinking about clerk vs auth0 but this video gave me some clarity
what clarity did it give you?
happy to hear that
In fact there are comparison tables of Clerk vs Auth0, and Clerk wins certainly.
@@smotch7533post nut clarity
my password manager subscription expired and wanted to build my own instead of paying more. I use MERN so i needed auth with nextjs and Clerk made the authentication part soo easy that it took me just a few minutes to integrate full-stack auth. You don't even need any tutorials, just follow the docs and you're good. That is just sooo good.
Wow this idea is very good actually 🤔
@@blazi_0 just use mongodb free cluster, encrypt password at rest and in flight, vercel to host it for free, and bam! You have your own simple password manager for free.
Could you give us an example of setting up auth in a MV3 chrome extension?
What do you think about Firebase auth ?
what is the extension that ads the lock symbols?
Not only was setup easy with Clerk but USING it is easy. It's just components so it feels intuitive in React code vs some things that have so many seemingly unecessary boilerplate to setup.
It's like oh I have a Sign In widget component, do I have a Sign Out or Log Out component then? Yea. Sometimes it can just be that easy.
its a masterpiece!
Crisp vid. Says everything you need to hear, wastes no time
how about include info into the jwt token and use middlewares?
Hi is this also easy to do with MongoDB?
How did you remove the secured by clerk slogan in the clerk authentication box ??
it can possible after purchasing premium
can we use this with a custom api ?
Error: Clerk: Clock skew detected. This usually means that your system clock is inaccurate. Clerk will continuously try to issue new tokens, as the existing ones will be treated as "expired" due to clock skew.
To resolve this issue, make sure your system's clock is set to the correct time (e.g. turn off and on automatic time synchronization).
---
JWT cannot be used prior to not before date claim (nbf). Not before date: Thu, 19 Oct 2023 06:43:38 GMT; Current date: Thu, 19 Oct 2023 06:43:29 GMT; (reason=token-not-active-yet, token-carrier=cookie)
this is the consent error keeps coming even after deployment ... how can I fix this ???
most useful content
Clerk is awesome, how do I create user roles in Clerk, seems not possible? Sync to my own database? Can you cover user roles, I see clerk has middleware
pretty sure you can do it through private user metadata
With Nextauth you can also do what you are doing in line 35 on minute 1:07 with one singe line too..
how do we handle the user registration using clerk with next js?
Are there benefits to using a NEXT + express stack?
What are the limitations to keep in mind when using NEXT's builtin node runtime? I'm assuming there are some backend stuff that are too complex for NEXT to handle?
Main reason is the serverless function timeout, on the free plan after 10 seconds and on the paid plan after like 30 seconds. Not viable for what I'm building
I see, thank makes sense.
Next and express is probably the most complete full stack traditional option. Express is very mature and can deal with pretty much anything you could come up with. On the front-end side, next is also very good. There's quite a few alternatives to express nowadays, such as trpc and next server components. Both of those work like a charm in serverless environments but they are also available through express. I'd say express is the way to go if you don't plan on using serverless or relying on 3rd parties, or if you need more advanced features, such as caching, websockets, etc.
@@dan_____ i see, how does one typically deploy a next-express app?
can they be deployed on the same domain? And i'm also assuming that for these use cases, it'd be more appropriate to deploy them using providers like linode/digital ocean?
Okay it seems easy to use but in most companies you wont have all your user stored somewhere else than your own servers to comply with data privacy.
the t3 stack docs also recommend this auth solution as well, letting an external solution handle your auth is just much more safe and convenient for most use cases.
and by safe I mean safe if you're a noob to auth like me
T3 😂
Please make a tutorial on nextjs testing with jest
The best!
Never had a fun experience with providers. Especially now Im rolling a Go backend, Im rolling my own auth and its so simple as well. And free ofc.😂
Oh rolling your own auth, how hard is it?
I flew through getting clerk up and running then realized we cant store the data - then you have to write a bunch of middleware to get it synced in your prisma db
Not great
What type of data are you talking about? Like if we wanted to store user contact info, preferences, and perhaps media like avatar photo, it can't be done directly on the cloak server?
one more thing.... u can not add extra fields to user schema... for example user role(Admin, Client, Co-Admin....)
you can via private / public metadata
Hi I'm trying to deploye a next 13 app in azure with different environments as test dev and prod and it's not working in any way
All I'm getting is how to deploy it on vercel which i don't want to do
So could you please help people like me who are trying this by explaining the process
Because I'm able to do it with NextJs 12 but not with 13
Yeah i was trying T3 app and clerk is really simple to setup and less configuration is needed
bro how to make nested routes ssg
for eg : how to make /types/[type]/[id] ssg
i made [type] ssg but i am not able to make [id] page ssg, any idea regarding that
export async function generateStaticParams({ params: { type } }) {
console.log("Something", type);
const recipesList = await getRecipesList(type);
const recipes = await recipesList;
return recipes.meals.map((recipe) => {
id: recipe.idMeal;
});
}
i am getting Something undefined in terminal when using this function
i don't know why @Josh tried coding
I think building auth on supabase and frontend on next js can be much efficient
Clerk is alright, assuming you don't run into EU data privacy issues. It also works in pretty much any application as you're deferring the actual job to a 3rd party. Issue of cost exists, but only if your application is meant to target a huge amount of users or you plan to grow it.
Next-auth is honestly hard to like. The team behind it is very anti credentials, and, because it's so easy to setup, it means it has to do too much so customizing it is almost always gonna be a pain. One use-case where next-auth breaks entirely is when you want to cache sessions, and that's on purpose as they're trying to get you hooked on serverless.
Honestly, I don't like either approaches and I believe both of them have very specific use cases. If the need ever arises, you should keep an eye on these two. But other than that, spinning up session based authentication is piss easy and you can customize it however you see fit.
tldr: unless you plan to do serverless, both tools are kind of meh
Interesting view, thanks for sharing. I enjoy using next-auth and can get behind the discouragement of credentials as it entails lots of security implications. Interesting choice implementing auth by yourself, definitely doable if you know what you're doing
Yea, using next auth always sucked for me , had to jump thru major hoops to make it work...
$25 every month for auth is insane compared to what vercel gives you for $20
($25 required if you don't want their branding)
Yeah, definitely not cheap. I think it comes down to what you value your time and how much time it saves you in the first place
25$ just to remove branding and remove "limits" on monthly active users, for MAU above 1k you still have to pay / user
for 10k extra MAUs you need to pay 200$ extra.
Supabase seems like a far better option. 50k MAUs on free plan and 100k for pro (25$) and offers many more (storage, database, edge functions)
they are even working on auth UI (not perfect yet).
Lol $25/month would be sweet. Trying to decide on a solution for a 100k MAU site and a lot of these solutions get really expensive really fast
I don't have idea clerk with Stripe integrations yet...
Learning how to code with Kevin de Bruyne
What’s better, Clerk or Supabase?
Supabase is a BaaS so I think you get more for the price, like storage, serverless functions, postgreSQL etc... the auth service is also cheaper. I think Clerk would be more comparable to Auth0.
Auth0 and Clerk are expensive.
Hi all,
Can someone please help me with TRPC and s3 presigned url.
i"m trying to create a form
next-auth supermacy
brother, make a video on "Best UI Components library for React Native"
never done react native, so I'm probably not the best person to ask there
u know firebase auth
Clerk loads up 3rd party scripts on the page, don't think I would want that we creating a new system.
Understandable. Even though I like the approach of offloading so many concerns to clerk, using e.g. pre-built components that you don't fully control can feel backward
the price is soooooo small tho compared. Even at $150/m you get like 10,000 accounts? If you charge $49/m per person that's $490,000 per month for $150/m spend
Clerk vs Kinde
It sucks for complicated org/user tenant structure. For simple user signup yes it is...... but who builds such easy apps?
Ultimately, the decision will depend on your organization's specific needs, priorities, and resources. If the second server offers significant improvements in security, compliance, and other critical factors, it may be a better choice. However, it's crucial to weigh the benefits against potential drawbacks, such as increased costs and performance impacts.
chatgpt loooooooooooooooool
Clerk is very expensive
google firebase auth isn't cheaper and better?
not a fan of 3rd party platform
Agree for most platforms as well. For example, firebase and its platform felt super clunky to use. In this case, I felt like it was a cool approach, understandable tho
Yo, first to comment.
you were in fact the first to comment
It makes no sense.
Why a developer should pay to another developer to build a auth script?
Bahhhhh
To save time? Why pay for any software if you can build it yourself
Ugh paid video by Clerk? Not a fan. Lucia-auth, next-auth, plenty custom auth's. Who would want this. (So this will save you may be 5 hours, but you will pay more, and you need to offload all your users to third party...) Most of the time currentUser() is not enough, unless you have a totally simplistic app. Sorry buddy.
No, not paid
used both and both are rly amazing, if you go with planetscale db that has also an amazing free teir, its not a problem for you to manage users on your side with nextauth
guess they serve different use-cases depending on cost and how you like to handle the user data
I was also looking for an authentication service recently and came across "supertokens". It's free if its self hosted. Gonna give a try.