Easy Multi-tenant NextJS Apps With Clerk

Поділитися
Вставка
  • Опубліковано 8 чер 2024
  • 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
  • Наука та технологія

КОМЕНТАРІ • 53

  • @bs8028
    @bs8028 4 місяці тому +12

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

  • @KWerder92
    @KWerder92 4 місяці тому +2

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

  • @JEM_GG
    @JEM_GG 3 місяці тому +1

    Just another reason to love Clerk! TY Jack

  • @incarnateTheGreat
    @incarnateTheGreat 4 місяці тому +7

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

  • @jrichardw
    @jrichardw 4 місяці тому +5

    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 Місяць тому +1

      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-ow2ge 4 місяці тому +2

    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.

  • @varandz
    @varandz 4 місяці тому +1

    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

  • @francomore1758
    @francomore1758 Місяць тому +1

    que grande Jack, este contenido me sirve mucho!

    • @jherr
      @jherr  Місяць тому

      De nada

  • @mettle_x
    @mettle_x 4 місяці тому +6

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

  • @eleah2665
    @eleah2665 4 місяці тому +1

    Cool. Thanks.

  • @mattisovereighteen
    @mattisovereighteen 4 місяці тому +1

    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?

  • @roberth8737
    @roberth8737 4 місяці тому +1

    This looks great - awesome tutorial!

  • @Tian-wi6qr
    @Tian-wi6qr 4 місяці тому +3

    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 місяці тому +1

      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.

  • @randomuser6789
    @randomuser6789 4 місяці тому +1

    Very good

  • @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.

  • @emmanueleban1096
    @emmanueleban1096 26 днів тому +1

    Lol “UA-cam loves that so thank you for that “

  • @LemonSix
    @LemonSix 2 місяці тому

    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?

  • @Shishir.435
    @Shishir.435 3 місяці тому

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

  • @niconel7659
    @niconel7659 2 місяці тому

    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)

  • @avishekdas4947
    @avishekdas4947 4 місяці тому +3

    Can you tell me when will your nextjs course come?

    • @jherr
      @jherr  4 місяці тому +2

      I'm working on it every day.

  • @ComputationalArt
    @ComputationalArt Місяць тому

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

  • @Roryfn2387
    @Roryfn2387 4 місяці тому

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

  • @jasonkwilliamson
    @jasonkwilliamson 5 днів тому

    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

  • @Orvibo-smart-home
    @Orvibo-smart-home 16 днів тому +1

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

  • @anasouardini
    @anasouardini 4 місяці тому

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

  • @AndriusLau
    @AndriusLau 2 місяці тому

    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
    @cornensue 4 місяці тому +2

    When do we spect the pronextjs course?

    • @jherr
      @jherr  4 місяці тому +1

      Working hard every single day on it.

    • @cornensue
      @cornensue 4 місяці тому

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

  • @ToriaDev
    @ToriaDev 4 місяці тому

    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 :(

  • @meharjeetsingh5256
    @meharjeetsingh5256 4 місяці тому

    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

  • @teleshyam26
    @teleshyam26 4 місяці тому

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

  • @jaspreetmaan121
    @jaspreetmaan121 4 місяці тому +3

    hey you leaked your credentials 😂😂😂

  • @Dylan_thebrand_slayer_Mulveiny
    @Dylan_thebrand_slayer_Mulveiny 4 місяці тому

    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 місяці тому +2

      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?

  • @doguarunbayraktar
    @doguarunbayraktar 4 місяці тому +12

    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 місяці тому +5

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

    • @HumanoAI
      @HumanoAI 4 місяці тому +6

      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 місяці тому +3

      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

  • @danko95bgd
    @danko95bgd 4 місяці тому

    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.

  • @taunado
    @taunado Місяць тому

    Thanks. Please review PayloadCMS multi-tenancy.