activenode
activenode
  • 21
  • 86 098
😱 Crazy new Supabase feature: Understand and learn about anonymous users
Support me on: TH-cam (Super Thanks) or ko-fi.com/activenode
Subscribe to my book release: supa.guide/
The repository: github.com/activenode/yt-edu-supa-happy-store
Book me for expert Supabase consultancy for your project (45mins sufficient for most): meet.brevo.com/david-lorenz
00:00 - Start
01:03 - Project Setup
02:48 - useUser hook
04:02 - Product / addToCart
04:20 - Cart Page / Checkout
04:54 - Allowing anonymous Users
06:34 - adding signInAnonymously
09:51 - Showing "signed in" only for real users
10:29 - user.is_anonymous
10:52 - Checkout and convert anonymous user to real user
12:07 - Understanding what happened to the anon user
12:55 - Confirm mail with Inbucket
13:16 - Google SignIn with Anonymous User
14:21 - Merging an existing user with an anonymous cart
18:21 - Cleaning up anonymous users
19:27 - Security and Stability Implications
มุมมอง: 1 112

วีดีโอ

2️⃣ Realtime Chess Game | The Chess Pieces [Pure JS Game Logic + Next.js + (Supabase)]
มุมมอง 5586 หลายเดือนก่อน
The second part of the Realtime Chess Game! 🎉 If you want me to do more videos like this please like, share & subscribe as I really love doing this videos but this takes massive amounts of time and money (Hardware). Find the related GitHub repository including the first branch here: github.com/activenode-edu/realtime-chess/tree/part2 If you wanna get me a coffee 💙: ko-fi.com/activenode I also h...
🎮 1. Creating a Realtime Chess Game | Pure JS Game Logic + Next.js + (Supabase)
มุมมอง 1.2K6 หลายเดือนก่อน
This is the very first step to get up and running with your Chessboard. Please find the related GitHub repository including the first branch here: github.com/activenode-edu/realtime-chess/tree/part1 I love doing this videos but this takes massive amounts of time and money (Hardware). So please help me out by subscribing and maybe, if the video helped you, get me a coffee 💙: ko-fi.com/activenode...
Supabase Interview with the CEO🔥: Insights and Advice from Paul Copplestone
มุมมอง 6677 หลายเดือนก่อน
Talking about Startups and clarifying common questions with Paul Copplestone, CEO from Supabase. It was my pleasure. You can listen to this like a Podcast in the background if you don't like my face, but if you do wanna see 2 laughing faces, you're welcome to enjoy the video. Links: Reddit Post: www.reddit.com/r/Supabase/comments/15f6h0j/what_do_you_want_to_know_about_supabase_for_real/ PostgRE...
Understand the Supabase SSR Package easily
มุมมอง 11K8 หลายเดือนก่อน
Sure, you can read the docs - but aren't you confused about it? Get a full-fledged, detailed explanation which removes all future barriers. About the info Box in the video: I use the same Client for Server Components, Route Handlers and Server Actions with NextJS App Router without the differentiating in set/remove; Because: I want to make sure that Server Components are not misused and hence i...
🔄 Easily Sync different Supabase Instances with Supabase Migrations / CLI
มุมมอง 7K9 หลายเดือนก่อน
Syncing Supabase Instances with Supabase Migrations should come easy - without manual backups and imports. Hope it does with this video. I love doing those videos but this takes massive amounts of time and money (Hardware). So please help me out by subscribing and maybe, if the video helped you, get me a coffee 💙: ko-fi.com/activenode I also have a newsletter planned for WebDevs, so if you wann...
Complete Guide ⚡️ Supabase Self-Hosted ➕ Custom S3 ➕ Authelia
มุมมอง 28K11 หลายเดือนก่อน
Supabase self hosted including S3 Storage, Customs Domains and Authelia. 🚨 Important Notes: I got informed on my blog that User Creation via Dashboard wasn't possible and that for some very specific things such as e.g. certain POST requests the Dashboard wasn't 100% working. There were only small things missing (updated in the Blog Article already): 1. In 23:10 we configure the location /storag...
🐍 A Neon-Snake moving at the Border: Fancy CSS Button
มุมมอง 827ปีที่แล้ว
Animating Borders isn't easy. Here I am showing you one way of CSS-only-animating a snake-like border. The Sandbox for this Code: codesandbox.io/s/neon-snake-button-css-drqkyv?file=/index.html Chapters: 0:00 Intro 0:39 Button Foundation 1:45 Base Animations 4:23 Making the Snake 10:40 Fixing the Shadow 12:03 Outro Credits: - Licensed Music from Envato Elements
⚛️ The fastest Kick-Off for react-query & unglitch in less than 20mins
มุมมอง 465ปีที่แล้ว
react-query solves the problem of multi fetching with query keys. So does unglitch with tokens. Get yourself familiar with both of those libraries in this video and understand why it's crucial to use such. Chapters: 0:00 Intro 0:59 Weather App Setup 4:11 React Query 11:53 unglitch 18:44 Outro Sources: - Unglitch unglitch.activeno.de/ - TanStack react-query tanstack.com/query/v4/docs/react/refer...
NextJS reveals Password🥲: Create Secure Server Actions 🔐💯
มุมมอง 2.6Kปีที่แล้ว
Everything is insecure if the concept isn't understood. However the question here is: Is this a feature or something that NextJS will iterate on? Let's have a closer look at the potential pitfalls of Server Actions (and remember, that, as of this date, they are still in Alpha!) Music Credits: - Outro: Rain, Book And Cup Of Tea by | e s c p | escp-music.bandcamp.com Music promoted by www.free-st...
🙌 Deploy NextJS, Astro, Wordpress, Supabase - DEPLOY JUST ANYTHING
มุมมอง 4.2Kปีที่แล้ว
Deploying Just anything ist so easy with #CapRover. I found this gem. Even though it could really need a website overhaul (just like Astro in its early stage) CapRover is more than convincing in its ease of use. CapRover is a wonderful abstraction layer, built for easy deployments, on top of Docker that also comes with free, automatic HTTPS Certificates via Let's Encrypt. #webdevelopment #apps ...
A ToDo List with #NextJS Server Mutations #ServerActions
มุมมอง 4.5Kปีที่แล้ว
Let's build a dynamic ToDo List with NextJS Server Actions and learn more about why the UI might flash and how the caching can be controlled. This is the follow-up to my other video (th-cam.com/video/jsEJsi2FD1U/w-d-xo.html) about #nextjs13 Server Actions. The GitHub Repo: github.com/activenode/yt-server-todos Sources: - nextjs.org/docs/app/building-your-application/data-fetching/server-actions...
🤯 NextJS Server Actions - never write Post Requests again
มุมมอง 10Kปีที่แล้ว
🤯 NextJS Server Actions - never write Post Requests again
4mins: HTML Template Tag - Learn the Web Components Technology
มุมมอง 3K2 ปีที่แล้ว
4mins: HTML Template Tag - Learn the Web Components Technology
⚡️4mins Supabase: Get a Random Row out of Supabase with Table Views
มุมมอง 3K2 ปีที่แล้ว
⚡️4mins Supabase: Get a Random Row out of Supabase with Table Views
Scale it! 🌈 Create reusable Elements with Tailwind custom configurations
มุมมอง 4402 ปีที่แล้ว
Scale it! 🌈 Create reusable Elements with Tailwind custom configurations
4mins Frontend Quickie: Understand Node.normalize()
มุมมอง 1022 ปีที่แล้ว
4mins Frontend Quickie: Understand Node.normalize()
⚡️ In 30mins from 0 to Web Service 😲 : Supabase, Next.js, Tailwind + Vercel 💚
มุมมอง 5K2 ปีที่แล้ว
⚡️ In 30mins from 0 to Web Service 😲 : Supabase, Next.js, Tailwind Vercel 💚

ความคิดเห็น

  • @AmxCsifier
    @AmxCsifier 3 วันที่ผ่านมา

    Great tutorial!

  • @katzenschildkroete
    @katzenschildkroete 3 วันที่ผ่านมา

    How do you upgrade the version of the backend services if supabase pushes new changes? Resolve merge conflicts whenever you pull from the upstream supabase repo?

  • @gunasheelan4130
    @gunasheelan4130 6 วันที่ผ่านมา

    found the life save i have been searching this for weeks thanks a bunch 😇😇

  • @g14wx17
    @g14wx17 7 วันที่ผ่านมา

    Thanks for this video, now I feel more comfortable to start working with supabase, but I have one question, I have been looking all around internet, but nobody explains, how you can sync edge functions into a git repository and then sync this edge functions into other envs. how you can do that?

  • @dozzauklondon2681
    @dozzauklondon2681 7 วันที่ผ่านมา

    The Vector setting is missing in the code downloaded actually. Doesn't match the one you got in video.

  • @jonkristian
    @jonkristian 9 วันที่ผ่านมา

    Very useful 🙂Thanks!

  • @elmagnificent8550
    @elmagnificent8550 10 วันที่ผ่านมา

    Is the book out?

  • @revatinikumbh7192
    @revatinikumbh7192 15 วันที่ผ่านมา

    How can I use it

  • @PhilippBlum
    @PhilippBlum 22 วันที่ผ่านมา

    The Authelia part came really handy for OpenSearch. Thanks for the tutorial :)

  • @traitpichardo2046
    @traitpichardo2046 23 วันที่ผ่านมา

    Would this be easier using coolify self hosting?

    • @activenode
      @activenode 23 วันที่ผ่านมา

      Hm, not really. Depends on "easy". Coolify has its own constraints. I use coolify as well but it's other things to adapt then. So I wouldn't necessarily say it is easier

  • @traitpichardo2046
    @traitpichardo2046 23 วันที่ผ่านมา

    Thank you

  • @belkoadam
    @belkoadam 25 วันที่ผ่านมา

    Great video!

  • @buxx5334
    @buxx5334 28 วันที่ผ่านมา

    Hey men. thank u for sharing your knowledge. but why i can't see settings button, can u help me with that?

  • @MsAlvigo
    @MsAlvigo หลายเดือนก่อน

    After the third thorough installation, I found out following: 1. Right after you set access list in NGINX, you can only manipulate with tables, but not with storage nor users. 2. After FULL installation by the guide, with Authelia, everything works. 3. supabase-vector doesn`t start. 4. supabase-storage & supabase-studio both are in 'unhealthy' state, 5. Error on sending invitation But, main functions works. Great job David ! Thank`s a lot !

  • @pcv-free-as-a-bird
    @pcv-free-as-a-bird หลายเดือนก่อน

    Hi there!! Thank you for the video it qas really nice.. I’ve setup supabase/srr on my Remix js app. The createBroswerClient and createServerClient works!! But I still not understand the concept between when to use the Broswer one or the Server one.. I know that when it’s for front-end is the Broswer client but I think I would need a real life example to understand both. Anyone can help me?

  • @PhilippBlum
    @PhilippBlum หลายเดือนก่อน

    It's quite annoying that the proxy manager doesn't use TLS by default, or via config flag. But great you later go over this.

  • @rohan7011
    @rohan7011 หลายเดือนก่อน

    Hi, How do i setup real-ip?

  • @andrew.derevo
    @andrew.derevo หลายเดือนก่อน

    ❤ good job 👏

  • @_joeleek
    @_joeleek หลายเดือนก่อน

    Hey David, where can i contact you for a chat?

  • @nothing9648
    @nothing9648 หลายเดือนก่อน

    Awesome video, its waay better then any docs on the supabase website.

  • @phantazzor
    @phantazzor หลายเดือนก่อน

    thanks ! what about with a docker container

  • @chetanchoudhary08
    @chetanchoudhary08 หลายเดือนก่อน

    what about edge functions, storage for multi environment. can't find much in docs

    • @activenode
      @activenode หลายเดือนก่อน

      Edge functions: see other comments where I responded:) Wdym with multiregion storage? CDN?

  • @reanyouda8299
    @reanyouda8299 หลายเดือนก่อน

    i cannot get in my S3 dashboard incorrect password and username

  • @reanyouda8299
    @reanyouda8299 หลายเดือนก่อน

    such as amazing tutorial, I love it much

  • @meet_codes7467
    @meet_codes7467 หลายเดือนก่อน

    Thanks, needed this.

  • @louis3195
    @louis3195 หลายเดือนก่อน

    Just spent a decade with monks, now back to startups :p

  • @dipereira0123
    @dipereira0123 2 หลายเดือนก่อน

    Legit question: Does the Self hosted version supports Users(creating users via studio Authentication)?? I thought i was breaking some configuration, but even with vannila install (without any config changes it always crashes with "canot fetch")

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Yes, sure it does! This should work. I haven't tried it in a while as I'm currently on the Supabase book writing process (supa.guide) but this does work (rn doing this with k8s). Have you checked the linked blogpost?

  • @Sansalvador67
    @Sansalvador67 2 หลายเดือนก่อน

    Hey my Man, i get an 403 "bad_jwt" "invalid JWT: unable to parse or verify signature, signature is invalid". Any ideas?

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Shouldn't happen. Have you tried generating one at supabase.com/docs/guides/self-hosting/docker#generate-api-keys ?

    • @Sansalvador67
      @Sansalvador67 หลายเดือนก่อน

      Yes, but these where invalid. I used one generated by a python script and it worked. I have no idea how and why but it works

    • @activenode
      @activenode หลายเดือนก่อน

      @@Sansalvador67 Indeed weird but wonderful you got it working. keep rockin!

  • @handler_k
    @handler_k 2 หลายเดือนก่อน

    Is there a way to enable edge functions in this tutorial?

    • @activenode
      @activenode 2 หลายเดือนก่อน

      They are active! Here's how: In every project, no matter if Cloud, self-hosted or locally, the URL to an Edge function is API_URL/functions/v1/function_name . Now on self-hosted, you need a way to get the functions there as `supabas functions deploy` only works with cloud. This is done with a docker volume which by default is found in the docker-compose.yml under functions.volumes (usually on your server where you execute the docker-compose.yml it's ./volumes/functions)

    • @handler_k
      @handler_k 2 หลายเดือนก่อน

      @@activenode thank you! great (unique) tutorial

    • @activenode
      @activenode 2 หลายเดือนก่อน

      @@handler_k Thanks so much

  • @karankhaira8497
    @karankhaira8497 2 หลายเดือนก่อน

    Thanks, most tutorials are outdated, you filled in the gap between the transition form the auth lib to ssr.

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Thanks!

  • @kurwacherry
    @kurwacherry 2 หลายเดือนก่อน

    cant express how helpful this was, thank you very much!

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Happy to hear!

  • @zeeshan9991
    @zeeshan9991 2 หลายเดือนก่อน

    bro when the next video is coming??

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Valid request mate! Sorry for keeping you waiting. I'm currently in the phase of finishing the book, I'll surely publish new parts soon!

  • @auchan42
    @auchan42 2 หลายเดือนก่อน

    supabase docs sucked, code samples sucked. thank you so much

  • @fulltimefrontend
    @fulltimefrontend 2 หลายเดือนก่อน

    Another like ! More subscribers to this channel.

  • @fulltimefrontend
    @fulltimefrontend 2 หลายเดือนก่อน

    The last part at from 25:00 made this really exciting. This channel is so under-subscribed, its a hidden gem.

  • @IncirDev-sq7cb
    @IncirDev-sq7cb 2 หลายเดือนก่อน

    very detailed tutorial, thanks. But need explanation on how to configure custom domains, how to point them dockerized nginx

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Isn't this what I show in the video? What are you missing? Cheers

  • @ROBOROBOROBOROBO
    @ROBOROBOROBOROBO 2 หลายเดือนก่อน

    Man this is great, thanks a lot, just subscribed I want to start Supabase as a newbie programmer and wanted exactly this video. Are there any limitations to Self Hosting features, compared with the paid Cloud options? I couldnt find a feature comparision table anywhere

  • @dipereira0123
    @dipereira0123 2 หลายเดือนก่อน

    God knows how much it takes to compress those 45h of work and research into a 35 minute guide for your audience. Def, earned this like comment and subscriber =) Keep up the good work, we are very thankfull

    • @activenode
      @activenode 2 หลายเดือนก่อน

      Thank you so much:)

  • @fulltimefrontend
    @fulltimefrontend 2 หลายเดือนก่อน

    Could not understand how to access serverClient in getServerSideProps, can you share an example ?

  • @antonionicolas2204
    @antonionicolas2204 3 หลายเดือนก่อน

    when i refresh the page the session is lost, why?

    • @activenode
      @activenode 3 หลายเดือนก่อน

      Hey there. Is it really lost or is it just yet another user? Calling signInAnonymously another time will create another user as stated in the Video!

    • @antonionicolas2204
      @antonionicolas2204 3 หลายเดือนก่อน

      I was calling the use user file as tsx

  • @antonionicolas2204
    @antonionicolas2204 3 หลายเดือนก่อน

    is it possible make anonymous sign in with supabase in the server?

    • @activenode
      @activenode 3 หลายเดือนก่อน

      Sure! That's even easier than on the frontend. Just check the session and if there's no session, you can trigger signInAnonymously()

    • @antonionicolas2204
      @antonionicolas2204 3 หลายเดือนก่อน

      I tried in server but it didn't work, anyway I did it like in the video and it worked. Great content!

  • @VATNIK-KILLER
    @VATNIK-KILLER 3 หลายเดือนก่อน

    does realtime work, and more importantly, can you have a second instance with working realtime ? @activenode

  • @joshuablew
    @joshuablew 3 หลายเดือนก่อน

    Hey, thanks for this amazing tutorial! I keep getting this error when building my project after following this setup: Static generation failed due to dynamic usage on /orders, reason: cookies I'm exclusively using the app router. My /orders page is a SSR page and calls a function "fetchOrders" before returning its components. This fetchOrders function lives in a server actions file with the "use server" file heading. It queries a pg database using Drizzle, and uses the "createSupabaseServerClient" function to fetch the user id for the database query. I'm unsure how to reliably get the user id of the logged in user for my database queries with this error throwing. Has anyone ran into something like this?

    • @activenode
      @activenode 3 หลายเดือนก่อน

      Can you try one thing to troubleshoot? This video shows calling `cookies()` in each function. However, I'm about to make an updated video where I'll be using `const cookieStore = cookies()` in the top of the utils function and then only `cookieStore.get`, `cookieStore.set` etc. So calling `cookies()` immediately will mark the file as "using cookies". Can you try if that helps?

  • @_bestbeast
    @_bestbeast 3 หลายเดือนก่อน

    I am getting an error that cookies can set in server action or route handler only

    • @activenode
      @activenode 3 หลายเดือนก่อน

      When exactly do you get it? What are you doing?

  • @kamil_supabase_enjoyer
    @kamil_supabase_enjoyer 3 หลายเดือนก่อน

    ❤❤❤ Great video. Next time please use dark theme in your apps. Its gonna be much easier to watch. Now you have dark theme on text editor and light theme in your app.

    • @activenode
      @activenode 3 หลายเดือนก่อน

      Great Feedback 💜

  • @ChristianKolbow
    @ChristianKolbow 3 หลายเดือนก่อน

    👍

  • @rishabsharma5307
    @rishabsharma5307 3 หลายเดือนก่อน

    waay too good video

  • @ChristianKolbow
    @ChristianKolbow 3 หลายเดือนก่อน

    I am writing here because others may be interested. I have a problem with Astro. I am using the new caching from Astro. During the build process, the data is cached in a folder. I would like to reuse this in the next build process. So I need a persistent app. But I don't understand how I can access a persistent folder or if it works at all. My Config: Path in App: /astro-cache Label: astro-cache In my Astro config I enter the following as the caching path: cacheDir: './astro-cache' That won't be correct, but I don't know how else to access the path. Is it even possible?

    • @ChristianKolbow
      @ChristianKolbow 3 หลายเดือนก่อน

      If it is possible, I would like to specify the persistent directory as cacheDir in my astro config.

    • @activenode
      @activenode 3 หลายเดือนก่อน

      As discussed previously, it's hard to access a VOLUME within a running build process. The best bet would be copying the files into the build context directory which comes with several problems: 1. You'd need to know where CapRover does the `docker build` 2. You'd need to copy the existing cache directory into that before the build starts and then do `COPY /cache-dir ...` within that 3. Where you get that `/cache-dir` from in the first place? The third question can be answered e.g. by having a git pipeline that will first trigger some script which will run `npm run build` and it's result is put to the cache-dir where it then later can be read from (2). But then again you still face problem (1) that you need to hook into it. That's why you're probably better of building in the container instead of the dockerfile and using a HEALTHCHECK command in the dockerfile to determine the healthiness of a container depending if a certain URL can be accessed or not (CURL request). Another idea: Use the Repository pipeline / GitHub actions to build on GitHub and re-use cache directories from the build which you then use to push to a specific branch when succesfull (like a `deployment` branch). That branch can then be used by CapRover. But all of these things aren't natively supported so if you didn't want workarounds you might wanna consider portainer instead which is a bit more versatile and I think it has Webhooks as well.

    • @activenode
      @activenode 3 หลายเดือนก่อน

      @@ChristianKolbow docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows also check this one to grasp ideas for prebuilding the cache