Clerk
Clerk
  • Видео 9
  • Просмотров 193 141
Build your own Next.js sign-in and sign-up pages with Clerk
In this video, @bookercodes at Clerk shows you how to use the SignIn and SignUp components with the Next.js optional catch-all route in order to build custom sign-in and sign-up pages for your Next.js app.
Read the written version of this guide on the Clerk documentation -clerk.com/docs/references/nextjs/custom-signup-signin-pages?
Просмотров: 12 387

Видео

An introduction to Clerk Elements
Просмотров 1,7 тыс.6 месяцев назад
Clerk's pre-built UI components are still the quickest and easiest way to add authentication and user management into your applications, but what about those times when you need even *more* customisation? That is where Clerk Elements (Beta) comes into play! 🙌 Watch on as @bookercodes at Clerk teaches you how to create bespoke authentication user experience with Elements. You can even bring your...
Enrich PostHog events with Clerk user data
Просмотров 7657 месяцев назад
In this video, you'll learn how to use the @PostHog `identify` function along with information about your Clerk users to connect the events logged in PostHog back to the user. PostHog Next.js onboarding docs: posthog.com/docs/libraries/next-js Read the written version of this video: clerk.com/blog/how-to-use-clerk-with-posthog-identify-in-nextjs
Fast Next.js App Router Authentication and User Management with Clerk
Просмотров 19 тыс.7 месяцев назад
Learn how to add authentication and user management to your Next.js app using Clerk. Follow along as @bookercodes from Clerk shows you how to set up sign-up, sign-in, and secure user management with Clerk components. 🍪 CLERK clerk.com/? ⏰ TIMESTAMPS 00:00 - Introduction 01:14 - Overview of the project 01:28 - Setting up Clerk and Next 04:31- Build your own sign-up and sign-in pages 07:19 - Acce...
Add authentication to your Next.js app in 100 seconds with Clerk
Просмотров 133 тыс.8 месяцев назад
Join Alex from Clerk as he quickly demonstrates how to integrate Clerk with a Next.js application in this brief tutorial. ABOUT CLERK 🍪 Need more than just a sign-in box? Clerk is a complete suite of embeddable UIs, flexible APIs, and admin dashboards to authenticate and manage your users. Learn more here 👉 go.clerk.com/authentication
Transfer users for a single login flow
Просмотров 2,8 тыс.2 года назад
Clerk allows you to transfer a user between sign up and sign in. This allows you to have a great user experience even if they select the wrong button or just want to have a single button.
Power your next app with Clerk + Supabase
Просмотров 17 тыс.2 года назад
This video shows you how to start with Supabase and Clerk using RLS and JWT templates. - JWTs - Supabase Clerk - Using RLS and custom RLS. Links Clerk homepage: clerk.dev to get a free account today! Clerk Supabase Docs: clerk.dev/docs/nextjs/supabase
What is useUser and what is it for?
Просмотров 1,6 тыс.2 года назад
In this video, we describe how to use useUser, what it is user for with a few examples. Links Clerk homepage: clerk.dev to get a free account today! useUser documentation: clerk.dev/docs/nextjs/useuser Chapters 00:00 - Introduction 00:25 - Application Overview 00:35 - Adding useUser 01:18 - Accessing user object 01:56 - Updating the user object. 02:47 - Outro
TRPC + CLERK - Move fast break nothing, secure everything
Просмотров 4,1 тыс.2 года назад
This video describes how to integrate Clerk into a TRPC application. Once you finish his tutorial, you will understand the usage of: - Clerk APIs - TRPC middleware and context. - Protected Routes Links Next.js middleware matcher: nextjs.org/docs/advanced-features/middleware#matcher Clerk homepage: clerk.dev to get a free account today! Clerk TRPC Docs: clerk.dev/docs/nextjs/trpc GitHub Starter ...

Комментарии

  • @professorjamm
    @professorjamm 15 дней назад

    r u bazhinga from sidemen?

  • @Blue-u9t
    @Blue-u9t 28 дней назад

    i listened the video with my head tilted the whole time lol

  • @zub8eti
    @zub8eti Месяц назад

    Would love to collaborate on authentication!

  • @santoshkumarmarar7048
    @santoshkumarmarar7048 Месяц назад

    can you please make video on how to integrate clerk using express in backend and nextjs as only frontend

  • @ryan_roga
    @ryan_roga Месяц назад

    @clerkdev I can't find information anywhere that tells me how to change light and dark mode for the clerk cards in my app. I can set the baseTheme in my ClerkProvider, but what if I want that theme to change if my user toggles light/dark modes? I've looked through the docs and had a peak at the package itself but I don't see a clear way to modify SignIn, SignUp, and the popup I get from UserButton so that I can use the current theme in styling the component, or telling it to use a given theme from @clerk/themes. Thoughts?

    • @ryan_roga
      @ryan_roga Месяц назад

      Never mind, I think I've figured it out. Not the prettiest but for demo purposes, it's fine. Here's what I found... 'use client' import { ClerkLoading, UserButton } from '@clerk/nextjs' import { dark } from '@clerk/themes' import { LoaderCircle } from 'lucide-react' import { useTheme } from 'next-themes' import { Fragment } from 'react' const _UserButton = () => { const { resolvedTheme } = useTheme() return ( <Fragment> <ClerkLoading> <div className='flex items-center justify-center'> <LoaderCircle className='animate-spin' /> </div> </ClerkLoading> <UserButton appearance={{ baseTheme: resolvedTheme === 'dark' ? dark : undefined }} afterSignOutUrl='/' /> </Fragment> ) } export default _UserButton

  • @SalomonSerfati
    @SalomonSerfati Месяц назад

    We want to remove the "Secured by Clerk" on both the <SignUp /> and <SignIn /> components. Is there any way to do so? If there is no way, that may be a deal breaker.

  • @guidollaurado2319
    @guidollaurado2319 Месяц назад

    Is there any way to fully customize the account portal? I need it in Spanish, and I already tried using localizations, but I also want more control over the placeholders. Despite having the localization set to 'esES,' they remain in English.

  • @yashkhandelwal7423
    @yashkhandelwal7423 2 месяца назад

    Please do video on Remix + clerk

  • @SeyyidAnnan
    @SeyyidAnnan 2 месяца назад

    we need video on how to connect CLERK CNAME to our DNS @Clerk

  • @chillydill4703
    @chillydill4703 2 месяца назад

    Hey, clerk elements are great! The only thing I cannot find in the documentation is the "forceRedirectUrl" using OAuth, similar when we use <SignInButton forceRedirectUrl={process.env.CLERK_SIGN_IN_FORCE_REDIRECT_URL} /> Would be great if someone can link how to do that.

    • @chillydill4703
      @chillydill4703 2 месяца назад

      Nevermind, found we can set that in the provider which is nice. <ClerkProvider publishableKey="pk_test_c21p...." signInForceRedirectUrl="localhost:3000/dashboard">

  • @batman_yt04
    @batman_yt04 2 месяца назад

    How is your table filled filled already

    • @imkir4n
      @imkir4n 2 месяца назад

      just dumb some dummy data

    • @batman_yt04
      @batman_yt04 2 месяца назад

      @ How do you save the user Id to Supabase from clerk in real-time like how will it be updated in the table as soon as it’s loaded

    • @imkir4n
      @imkir4n 2 месяца назад

      @@batman_yt04 u need to save user_id along with the data.

  • @okirorfrank985
    @okirorfrank985 2 месяца назад

    please which clerk version is being used here

  • @okirorfrank985
    @okirorfrank985 2 месяца назад

    having this error in clerk middleware Property 'protect' does not exist on type 'ClerkMiddlewareAuthObject'. Property 'protect' does not exist on type 'SignedInAuthObject & { redirectToSignIn: RedirectFun<Response>; }

  • @BExploit
    @BExploit 2 месяца назад

    bro wasn't there

  • @impactsongs
    @impactsongs 2 месяца назад

    If you install Laravel with Sanctum is 10 seconds 😅

  • @mjylove2
    @mjylove2 2 месяца назад

    amazing

  • @kartikmehta7393
    @kartikmehta7393 2 месяца назад

    ailed to compile ./node_modules/@clerk/clerk-react/node_modules/@clerk/shared/dist/react/index.mjs Attempted import error: 'SWRConfig' is not exported from 'swr' (imported as 'SWRConfig'). i am getting this error plz help me

  • @arthuraraujo6479
    @arthuraraujo6479 2 месяца назад

    great vid

  • @TaigiTWeseDiplomat--Formosan
    @TaigiTWeseDiplomat--Formosan 2 месяца назад

    OKO

  • @SHUBHLAABHKITCHENRECEIPES
    @SHUBHLAABHKITCHENRECEIPES 3 месяца назад

    Quick, precise and easy, really great help buddy

  • @short_facts_entertaining
    @short_facts_entertaining 3 месяца назад

    You website is not functioning. What happened?

  • @arthurlewin1952
    @arthurlewin1952 3 месяца назад

    how will the redirection url will work now

    • @kartikmehta7393
      @kartikmehta7393 2 месяца назад

      /node_modules/@clerk/clerk-react/node_modules/@clerk/shared/dist/react/index.mjs Attempted import error: 'SWRConfig' is not exported from 'swr' (imported as 'SWRConfig'). i am getting this error plz help me

  • @AmarjeetKumar-x2j4o
    @AmarjeetKumar-x2j4o 3 месяца назад

    Hi, we used to have an afterAuth method in authMiddleware but since it is deprecated, so do we have any option to implement afterAuth using clerkMiddleware?? I checked the official documentation about afterAuth but could not find anything. Any help here will be appreciated.

  • @roailshah2701
    @roailshah2701 3 месяца назад

    THanks for 20 subscribers

  • @MopelolaDaramola-fj1uq
    @MopelolaDaramola-fj1uq 3 месяца назад

    Clerk website is not reachable, not working. Why?

  • @jeremyAr
    @jeremyAr 4 месяца назад

    So if I only need the userId its better to just use the auth() function? Also is currentUser() function cached?

  • @Stefan-m6o
    @Stefan-m6o 4 месяца назад

    How can we make a payment registration form? For users to sign in to our app, they need to first pay a subscription. Can it work with Stripe, for example?

  • @mrphethmalu9674
    @mrphethmalu9674 4 месяца назад

    How to connect them on mongodb? When signed in?

  • @code-env
    @code-env 4 месяца назад

    I really love the work y'all be doing at clerk. Really saves us a lot of time and money.

  • @FunCodingwithRahul
    @FunCodingwithRahul 4 месяца назад

    Hi, I am stuck at this below issue.. I have configured clerk webhooks to sync the clerk user data to my supabase during user creation event. since I have RLS policy enabled and user has to be authenticated to be able to insert the data, I need clerk token as you have also mentioned.. But since a webhook doesn't know who the user is and if that user is authenticated or not, the webhook body does not provide a Clerk token. and session.getToken always returns null. I understand that Clerk webhooks come from a server which has no users and no auth state (as mentioned before) and auth() from "@clerk/nextjs/server" expects a Nextjs frontend app to server request and its doesn't work from server to server. Hence I am not able to use that clerktoken to insert records into supabase during user.created event. please can you help ?

  • @Tanner-cz4bd
    @Tanner-cz4bd 4 месяца назад

    how to redirect after sign up?

  • @HunnyBunny-i5z
    @HunnyBunny-i5z 4 месяца назад

    I want to buy English content channels

  • @CodeWithOgochukwu
    @CodeWithOgochukwu 4 месяца назад

    ❤❤❤

  • @matthewgodwin4245
    @matthewgodwin4245 4 месяца назад

    Website not working

  • @zakianwar5118
    @zakianwar5118 4 месяца назад

    Sir ,You are the Greatest of all Time .Thank You Sir.I did it

  • @matthewgodwin4245
    @matthewgodwin4245 4 месяца назад

    Clerk website not working

    • @A-ds5hy
      @A-ds5hy 2 месяца назад

      Use VPN

  • @YouWatchGames
    @YouWatchGames 4 месяца назад

    Looks great!

  • @iamgroot494
    @iamgroot494 4 месяца назад

    Please help deploying this app to vercel, running into problems on vercel when the app still works on local

  • @foredu2865
    @foredu2865 4 месяца назад

    does it not redirect after signin . is there anyone face same issue?

  • @gnaneshnayak8790
    @gnaneshnayak8790 5 месяцев назад

    Can u plz reply which browser ur using how does it float?

  • @faisalamin001
    @faisalamin001 5 месяцев назад

    How can I get access token (Bearer). Actually I authenticate user through Tiktok and wants to use this access token to hit Tiktok posting API to publish videos from my web app.

  • @gnaneshnayak8790
    @gnaneshnayak8790 5 месяцев назад

    Which browser ur using how does it floats

  • @learn_languages8628
    @learn_languages8628 5 месяцев назад

    Kindly do clerk auth tutorial with prisma and mongodb plz

  • @raynosebastian6275
    @raynosebastian6275 5 месяцев назад

    Can i do role based access using clerk ?

  • @DhanushkaDeSilva-g3f
    @DhanushkaDeSilva-g3f 5 месяцев назад

    can you do a tutorial on role base authentication

  • @manishkhandagale26b15
    @manishkhandagale26b15 5 месяцев назад

    After login by clicking signin button, i logged in but sign in button is still showing

  • @manishkhandagale26b15
    @manishkhandagale26b15 5 месяцев назад

    After signing in by clicking signInButton and login but still sees the sign in button it doesn't go even after signing

    • @foredu2865
      @foredu2865 4 месяца назад

      yes i have same problem

  • @joshbakit
    @joshbakit 5 месяцев назад

    i use this in my project but the styles is not working its only the text ""sign-in" appears

    • @bookercodes
      @bookercodes 5 месяцев назад

      That sounds rather strange, I agree! Could you please get in touch with an email or in the Clerk Discord and make sure to include some code examples.

  • @GoldmediaSubscribeme
    @GoldmediaSubscribeme 5 месяцев назад

    cant modify the width and hieght of clerk components , f**ks up the entire page layout , in mobile view , I want it to be of a certain size

  • @shayaan567
    @shayaan567 5 месяцев назад

    Constantly getting this error from clerk in the browser console: The <SignIn/> component cannot render when a user is already signed in, unless the application allows multiple sessions. Since a user is signed in and this application only allows a single session, Clerk is redirecting to the `after SignIn` URL instead. (This notice only appears in development)

    • @bookercodes
      @bookercodes 5 месяцев назад

      Can you try in an incognito window and see what happens?