Easy Multi-tenant NextJS Apps With Clerk

Ғылым және технология

Clerk 5 is an amazingly easy way to add authentication, with roles, permissions, and organizations to your application. It is a powerful toolkit for multi-tenancy. Let's dig in!
Code: github.com/jherr/clerk-5-role...
👉 Upcoming NextJS course: pronextjs.dev
👉 Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJ
👉 Discord server signup: / discord
👉 VS Code theme and font? Night Wolf [black] and Operator Mono
👉 Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF
0:00 Introduction
5:27 Clerk Provider in React
7:00 Protecting Routes with Clerk Middleware
11:53 Applying The Show List to a User
19:27 Sync Active Organizations
25:09 Revolutionary User Interaction
27:43 Clerk v5

Пікірлер: 55

  • @bs8028
    @bs80284 ай бұрын

    I would love to see this role based Auth with next/auth and your implementation of that cool Protect component. 👌

  • @KWerder92
    @KWerder924 ай бұрын

    Thanks! By far my favourite educational youtuber. Keep it up💙

  • @incarnateTheGreat
    @incarnateTheGreat4 ай бұрын

    A ton of people have been asking about Auth in Next.js. Thanks for this!

  • @JEM_GG
    @JEM_GG3 ай бұрын

    Just another reason to love Clerk! TY Jack

  • @jrichardw
    @jrichardw4 ай бұрын

    I'm working on an app now that needs role based permissions. I worry with this route that I'm putting too much of my "eggs in one basket." I'm looking for libraries that will allow me to keep this level in-house. Right now, I can't see past the nightmare of having my roles setup and something happens to Clerk. I'm loving the video the drag/drop functionality--as I need to implement that for my app too! Thanks!!!

  • @northerncoder

    @northerncoder

    Ай бұрын

    I am also wondering about this. does this increase the amount of calls to clerk as opposed to storing roles in the database? will this increase clerk costs?

  • @DS-ow2ge
    @DS-ow2ge4 ай бұрын

    Hi Jack, I recently migrated from Clerk to WorkOS due to needing to support multiple authentication types (SAML + magic link) depending on the organization. Would love to get your opinion of WorkOS auth solution.

  • @eleah2665
    @eleah26654 ай бұрын

    Cool. Thanks.

  • @roberth8737
    @roberth87374 ай бұрын

    This looks great - awesome tutorial!

  • @Tian-wi6qr
    @Tian-wi6qr4 ай бұрын

    Thanks for showing this! One question, why is SyncActiveOrganization not made into a hook (for eg useSyncActiveOrganization)? IMO it would be much more natural to use it in such a way since it doesn't return jsx.

  • @jherr

    @jherr

    4 ай бұрын

    Oh, that's a great idea!

  • @panteliselef239

    @panteliselef239

    4 ай бұрын

    In this example we grab memberships from a server component (RootLayout) and then we pass it to the client component (SyncActiveOrg), if we only had the hook we couldn't just call the hook inside the body of RootLayout. But yes this would be possible with just client components.

  • @francomore1758
    @francomore1758Ай бұрын

    que grande Jack, este contenido me sirve mucho!

  • @jherr

    @jherr

    Ай бұрын

    De nada

  • @randomuser6789
    @randomuser67894 ай бұрын

    Very good

  • @HumanoAI
    @HumanoAI4 ай бұрын

    Guess the question remains on what services the stack hosting the app supports. It also depends on the ability to code for the admin building the site. So databases, analytics, authentication, scalability become externally provided by third parties. Making money from these services and allowing free hosting like amplify aws is greared towards the use of databases, analytics, authentication, scalability by third parties. Many do it yourself programmers prefer to save time by using these services. Simple authentication is relatively easy but multiple types of authentication gets heavy. I don’t like these models either but the database and authentication have become third party unless one host provides them all. Even if a stack supports them all you’re left with the source code always at the mercy of the provider leaving a security layer uncontrolled. So static ips to host a server becomes the last option, expensive, hard to scale and securing the stack itself becomes another workload.

  • @varandz
    @varandz4 ай бұрын

    I had issues connecting clerk to expo(49) app with tamagui, the context providers for tama and clerk has some sort of race condition on app router system

  • @mattisovereighteen
    @mattisovereighteen4 ай бұрын

    Am I just dumb or is it impossible to have a checkbox that says "I have read and accept the Terms of Service and Privacy Policy" and another that says "I agree to receive marketing emails" in the Clerk ui?

  • @mettle_x
    @mettle_x4 ай бұрын

    Clerk's Phone OTP Auth doesn't work for several countries, especially in India & Bangladesh.

  • @ilearncode7365

    @ilearncode7365

    4 ай бұрын

    good

  • @avishekdas4947
    @avishekdas49474 ай бұрын

    Can you tell me when will your nextjs course come?

  • @jherr

    @jherr

    4 ай бұрын

    I'm working on it every day.

  • @LemonSix
    @LemonSix2 ай бұрын

    I was trying to design something like this for a project of mine but the sessionClaims never added the custom keys (even although i declared them on globals) and the JWT token does indeed contain the memberships. So i decided to copy your repo and check the differences, but to my surprise even the copy of your repository doesn't bring the membership on the custom claims. Could that be a Clerk update breaking change?

  • @Roryfn2387
    @Roryfn23874 ай бұрын

    Interactions!!!! you have leaked some CREDENTIAL CODES DUDE!!!! 😅 great video great content and thanks clerk for sponsoring!!

  • @emmanueleban1096
    @emmanueleban1096Ай бұрын

    Lol “KZread loves that so thank you for that “

  • @niconel7659
    @niconel76592 ай бұрын

    Thanks for making this video. I am confused. You are using a free account there right? I got the pro plan ($25 a month). When going to "Organizations Settings" both "Roles" and "Permissions" tabs, request I upgrade my account (Enhanced B2B SaaS which cost $100 a month..bit much for a hobby project!). Or am I missing something? Did you sponsor gave you an account with all add-ons loaded already?)

  • @niconel7659

    @niconel7659

    2 ай бұрын

    Hoping I'm just confused because I'm inches away from just implementing my own solution (auth0 or something)

  • @Shishir.435
    @Shishir.4354 ай бұрын

    I want to assign a default orgenozation to a user when he logins for the first time. how can i acheive this?

  • @ComputationalArt
    @ComputationalArtАй бұрын

    I’ve a custom backend with cookies and jwt, how to implement a custom Auth ?

  • @jasonkwilliamson
    @jasonkwilliamson16 күн бұрын

    How long on average should it take someone to set this up for me? I had Kinde set up and it took my developer like 7 days to get Kinde to work with a pro role and give pro features to that account, was frustrating and super slow

  • @anasouardini
    @anasouardini4 ай бұрын

    You planning on making WP videos? it's the only jobs that accept juniors right now.

  • @AndriusLau
    @AndriusLau3 ай бұрын

    Maybe Nextjs 14 with firebase auth? 50k users in a free plan :) A version with credentials (aignup and sign in) and with Google sign in.

  • @cornensue
    @cornensue4 ай бұрын

    When do we spect the pronextjs course?

  • @jherr

    @jherr

    4 ай бұрын

    Working hard every single day on it.

  • @cornensue

    @cornensue

    4 ай бұрын

    @@jherr Thank you for answering. Can't wait. 👍🏻

  • @Orvibo-smart-home
    @Orvibo-smart-home27 күн бұрын

    Omg, we know your credentials. There's a big leak on interent now.

  • @meharjeetsingh5256
    @meharjeetsingh52564 ай бұрын

    Yeah clerk is good for small scaled project, but for production level stuff I would choose next auth v5. I know it takes a lot of time to auth correctly but dude it’s a skill issue if you can’t do it. It’s cheaper for your customers as well. So you better learn the hard stuff

  • @ToriaDev
    @ToriaDev4 ай бұрын

    Looks cool of course, but I do not trust Clerk that much. And I do not know if it makes sense to use something like clerk. If you understand that you need such a complicated app with lots of roles where each user should have different rights, it is just safer and easier to go for AWS, where you can control and integrate auth, backend, roles and host your app in one place and pay just one bill. The only thing that I find useful is that Clerk is HIPAA compliant, Google still can't make their auth HIPAA compliant :(

  • @teleshyam26
    @teleshyam264 ай бұрын

    Really nice video! i was wondering if i could help you edit your videos and make them more engaging.

  • @jaspreetmaan121
    @jaspreetmaan1214 ай бұрын

    hey you leaked your credentials 😂😂😂

  • @taunado
    @taunado2 ай бұрын

    Thanks. Please review PayloadCMS multi-tenancy.

  • @lukem121
    @lukem1219 күн бұрын

    I don't like that it made all of my application dynamic.

  • @jherr

    @jherr

    9 күн бұрын

    It should depend on where you put auth checks. If you don't put them in the layout it shouldn't force you into dynamic routes. It's possible in the demo code it's in the layout, but that doesn't mean it needs to be there.

  • @doguarunbayraktar
    @doguarunbayraktar4 ай бұрын

    I am sorry I love watching you but we won’t use third party authentication, it is lazy and expensive. Also micropayments are everywhere in our lives. Netflix, etc. I don’t want to add one more.

  • @iandaley2295

    @iandaley2295

    4 ай бұрын

    Ya, they can sponsor all they want. I need a really good reason to ever even consider 3rd party auth

  • @HumanoAI

    @HumanoAI

    4 ай бұрын

    Guess the question remains on what services the stack hosting the app supports. It also depends on the ability to code for the admin building the site. So databases, analytics, authentication, scalability become externally provided by third parties. Making money from these services and allowing free hosting like amplify aws is greared towards the use of databases, analytics, authentication, scalability by third parties. Many do it yourself programmers prefer to save time by using these services. Simple authentication is relatively easy but multiple types of authentication gets heavy. I don’t like these models either but the database and authentication have become third party unless one host provides them all. Even if a stack supports them all you’re left with the source code always at the mercy of the provider leaving a security layer uncontrolled. So static ips to host a server becomes the last option, expensive, hard to scale and securing the stack itself becomes another workload.

  • @twitchizle

    @twitchizle

    4 ай бұрын

    I would use it at first, after i bake the product, i migrate to first party auth.

  • @devdeclan

    @devdeclan

    4 ай бұрын

    What about supabase with?

  • @devdeclan

    @devdeclan

    4 ай бұрын

    @@twitchizleagreed

  • @Dylan_thebrand_slayer_Mulveiny
    @Dylan_thebrand_slayer_Mulveiny4 ай бұрын

    By "Easy Multi-tenant" you mean have an app with users. Why use normal english when you can go with something more click-baity right?

  • @jherr

    @jherr

    4 ай бұрын

    Nope. I meant multi-tenant because this is multi-tenant. The org is the tenant. The data is sharded by org from the front to the back.

  • @ChrisMoleTV

    @ChrisMoleTV

    Ай бұрын

    ​@@jherris it possible to have a user signup straight into the smith family tenant from a Signup page from the slug?

  • @danko95bgd
    @danko95bgd4 ай бұрын

    Looks bad. When the first thing i see on their homepage is nextjs, remix and that youtuber clown with mustache i know itd bad. I hate when libraries have x/nextjs. What's next x/svelte x/nuxt x/solid x/alpine, they should use web components or just provide js sdk. I'll stick to ory kratos which i can self host easily and configure everything myself. I don't want to sign in anywhere and i don't want them to give me their forms, i make them myself.

Келесі