Cody Bontecou
Cody Bontecou
  • Видео 35
  • Просмотров 113 718
Nuxt Auth - Postgres.js
Integrating a custom next-auth adapter to utilize postgres.js in a Nuxt 3 application that has authentication using Nuxt Auth.
Resources:
Repo: github.com/codybontecou/nuxt-sidebase-auth
nuxt-auth: sidebase.io/nuxt-auth/getting-started
postgresjs: github.com/porsager/postgres
pgmg: github.com/JAForbes/pgmg
postgresql: postgresql.org
postgresjs adapter PR: github.com/nextauthjs/next-auth/pull/10570
My Links:
🔔 Newsletter: www.codybontecou.com/
📁 GitHub: github.com/codybontecou/
🤖 Website: www.codybontecou.com/
🐦 Twitter: CodyBontecou
0:00 Intro
00:47 Installation + Setup
02:23 Nuxt Auth Endpoint
05:38 Environment Variables
09:00 Postgres.js Auth Adapter
12:03 Postgres,js initialization
14:11 Post...
Просмотров: 1 580

Видео

End to End Typesafety in Nuxt
Просмотров 1713 месяца назад
Exploring one of the main benefits to Fullstack Typescript. Resources: Repo: github.com/CodyBontecou/nuxt-e2e-typesafety nuxt-server-fn: github.com/antfu/nuxt-server-fn My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 Twitter: CodyBontecou 0:00 Intro 00:42 Project Setup 02:03 Native Implementation 06:12 Native Impleme...
My Favorite Way to Build UI's in Nuxt
Просмотров 5 тыс.3 месяца назад
Walking you through how to setup and use components from shadcn-vue. Resources: Repo: github.com/CodyBontecou/nuxt-shadcn Docs: www.shadcn-vue.com/ My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 Twitter: CodyBontecou 0:00 Intro 02:15 Project Setup 06:33 Button Component 08:40 Drawer Component 10:22 Mobile Showcase 1...
Using Assets in Nuxt Server Routes
Просмотров 1743 месяца назад
Managing assets within my Nuxt 3's Nitro server took me a bit more effort to figure out than expected. So, I figured I'd make this video to showcase how it's done! Repo: github.com/codybontecou/nuxt-3-server-files My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 Twitter: CodyBontecou
Convert Webpage to EPUB in Typescript
Просмотров 1054 месяца назад
Using Typescript to turn my favorite articles into EPUB files so I can enjoy them offline and on my reading devices. 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 Twitter: codybontecou
Integrate ChatGPT & Open Source LLMs in Your IDE for Next-Level Coding! | Full Tutorial
Просмотров 1,2 тыс.6 месяцев назад
👨‍💻 Unleash the power of AI in your coding environment with our comprehensive guide! In this video, I dive deep into how to seamlessly integrate ChatGPT and other leading open source Large Language Models (LLMs) like GPT-4 and FindCodeLlama into your IDE using the innovative 'Continue' extension. Perfect for developers looking to supercharge their workflow! 🌟 WHAT YOU'LL LEARN: Step-by-step wal...
Mastering Ollama: Run Open Source LLMs Locally with Ease!
Просмотров 6186 месяцев назад
🔥 Discover the power of running open source Large Language Models (LLMs) locally with Ollama.ai! In today's video, we dive into the simplicity and versatility of Ollama, a tool that brings AI directly to your desktop. 👉 What's Inside: A complete walkthrough of downloading and verifying Ollama. Insights into different models available, including a peek at the Hugging Face Models Leaderboard. A f...
Counting Items in Obsidian with DataviewJS
Просмотров 1,1 тыс.6 месяцев назад
🔥 Hey there! I'm Cody Bontecou, and welcome to my channel! In today's video, I'm diving into the powerful world of Dataview JS in Obsidian. Join me as I unveil how to count and manage your RUclips video ideas efficiently using this innovative tool. Whether you're a content creator, a note-taker, or just curious about Obsidian's capabilities, this video is packed with insights you won't want to ...
Screencasting Automation Crash Course #7 - Figma Designs with JSON
Просмотров 76Год назад
In this episode, we utilize the Figma plugin JSON → Content to automate aspects of our Figma design using JSON to populate them. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation/tree/lesson-7 💻 Credit: - Thumbnail graphic: Mappletons 🐦 My Network: - Twitter: codybontecou - Blog: codybontecou.com/
Screencasting Automation Crash Course #6 - Do Not Disturb
Просмотров 34Год назад
In this episode, we extend our CLI to automatically toggle our computer's do not disturb setting to disable notifications while recording our screencasts. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation/tree/lesson-6 💻 Credit: - Thumbnail graphic: Mappletons 🐦 My Network: - Twitter: codybontecou - Blog: codybontecou.com/
Screencasting Automation Crash Course #5 - Controlling Chrome in CLI
Просмотров 52Год назад
In this episode, we extend our CLI to spawn a Google Chrome window with my preferred settings - guest most, zoom level, development URL - when passing the web CLI argument. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation/tree/lesson-5 💻 Credit: - Thumbnail graphic: Mappletons 🐦 My Network: - Twitter: codybontecou - Blog: codybontecou.com/
Screencasting Automation Crash Course #4 - Creating a CLI
Просмотров 79Год назад
Beginning to build a basic CLI using NodeJS's v19.9 parseArgs function. With it, we can specify zoom-in and zoom-out arguments to control the functionality of our scripts. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation/tree/lesson-4 💻 Credit: - Thumbnail graphic: Mappletons 🐦 My Network: - Twitter: codybontecou - Blog: codybontecou.com/
Screencasting Automation Crash Course #3 - Programmatic Changing VSCode Settings
Просмотров 49Год назад
In this video, we programmatically update our visual studio code setting to update the zoom level when recording videos. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation/tree/lesson-3 💻 Credit: - Thumbnail graphic: Mappletons 🐦 My Network: - Twitter: codybontecou - Blog: codybontecou.com/
Screencasting Automation Crash Course #2 - Cursor Automation
Просмотров 94Год назад
When screencasting, it's best practice to maximize your cursor size for mobile viewers to see it easily. It's a hassle manually clicking through the UI to adjust it before filming. I found a script that we can use to automate this for us. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation/tree/lesson-2 💻 Credit: - Source discussion: apple.stackexchange.com/questions/88267/...
Screencasting Automation Crash Course #1 - Intro
Просмотров 202Год назад
Quick overview of the aspects of screencasting we will cover and automate in this course. 💻 Follow Along: - Repo: github.com/CodyBontecou/screencasting-automation 💻 Credit: - Thumbnail graphic: Mappletons 🐦 My Network: - Twitter: codybontecou - Blog: codybontecou.com/
Nuxt Auth Crash Course #13 - Prisma Integration
Просмотров 2,9 тыс.Год назад
Nuxt Auth Crash Course #13 - Prisma Integration
Nuxt Auth Crash Course #12 - Prisma + DB Setup
Просмотров 3,2 тыс.Год назад
Nuxt Auth Crash Course #12 - Prisma DB Setup
Nuxt Auth Crash Course #11 - Custom User Data
Просмотров 2,7 тыс.Год назад
Nuxt Auth Crash Course #11 - Custom User Data
Nuxt Auth Crash Course #10 - REST API
Просмотров 3,8 тыс.Год назад
Nuxt Auth Crash Course #10 - REST API
Nuxt Auth Crash Course #9 - Working with JWT
Просмотров 7 тыс.Год назад
Nuxt Auth Crash Course #9 - Working with JWT
Nuxt Auth Crash Course #8 - Server-side Integration
Просмотров 4,8 тыс.Год назад
Nuxt Auth Crash Course #8 - Server-side Integration
Nuxt Auth Crash Course #7 - Email + Password Sign In
Просмотров 7 тыс.Год назад
Nuxt Auth Crash Course #7 - Email Password Sign In
Nuxt Auth Crash Course #6 - Custom Sign In Page
Просмотров 6 тыс.Год назад
Nuxt Auth Crash Course #6 - Custom Sign In Page
Nuxt Auth Crash Course #5 - Client-side Middleware
Просмотров 8 тыс.Год назад
Nuxt Auth Crash Course #5 - Client-side Middleware
Nuxt Auth Crash Course #4 - Sign in and Sign out
Просмотров 9 тыс.Год назад
Nuxt Auth Crash Course #4 - Sign in and Sign out
Nuxt Auth Crash Course #3 - Configure Github Credentials
Просмотров 10 тыс.Год назад
Nuxt Auth Crash Course #3 - Configure Github Credentials
Nuxt Auth Crash Course #2 - Installation and Setup
Просмотров 10 тыс.Год назад
Nuxt Auth Crash Course #2 - Installation and Setup
Nuxt Auth Crash Course #1 - Introduction
Просмотров 17 тыс.Год назад
Nuxt Auth Crash Course #1 - Introduction
Let's Setup Nuxt 3 with Cypress
Просмотров 1,5 тыс.Год назад
Let's Setup Nuxt 3 with Cypress
Keyboard Shortcuts in Your Electron App
Просмотров 5062 года назад
Keyboard Shortcuts in Your Electron App

Комментарии

  • @devoxygen7395
    @devoxygen7395 22 дня назад

    U look great bro

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

    i really like naive-ui ...hold up, did you say they give you component code files instead of just interface? that's very nice one more thing that i also use for all nuxt projects is nuxtR vscode extension, makes creating projects and files so much easier

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

    love how no youtuber comes further than showing some buttons.

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

    awesome!!!

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

    Oh I really wished I found this one month ago.... (but I moved to lucia-auth which has porsager/pg)

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

      Nice! Are you using lucia-auth with Nuxt?

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

      ​@@codybontecou Using it with Next and Microsoft SSO, it's supported although it wasn't as straight forward as I would've liked. I had to glue it together from their docs on ms-sso, the github example and Microsoft's official ID token claims reference.

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

    I was beside Nuxt UI and Shadcn. I'm with Shadcn 100% now.

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

      can you explain why you choose Shadcn?

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

      @@YusnielBrocard it’s 100% customizable and easy to use.

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

      @@MikeTheCook thanks bro

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

    Can the Continue extension be aware of the entire directory opened in VSCode? What about being aware of an additional directory, not opened in VSCode? Thank you.

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

    Hi, I find out that since you added the prisma adapter the token endpoint is not working :/ . I had clone your repo to test it and it seems that there are the same issue. I'll be very thankful if you have an idea or a solution.

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

    What about nuxt ui ?

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

      A comparison would be nice 👍

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

      Honestly, the price tag puts me off. But, initial impressions look good. I imagine it being Nuxt-first brings a ton of nice things along with it.

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

      Nuxt UI is free. I'm using in production. Needs some updates, but works really well

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

      its trash

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

      @@phojie6868 why do you say that?

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

    How do I get the raw jwt token within the callback?

  • @JesusMartinez-kn8hz
    @JesusMartinez-kn8hz 3 месяца назад

    Master

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

    Great! Thx

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

    I think you could have made this video after you figured out what you wanted to do step by step and it would be better if you actually explained every step because you jumped around quickly between files and didn't describe what you're doing, especially when you made a mistake and corrected it.

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

    Great Library, Thanks :)

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

    Thanks for awesome tutorials 💚💚

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

      Slowly but surely getting content out!

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

    Hello, maybe you can tell me how to implement dynamic changes to Session.expires. So that there is an opportunity from the client part in the signIn("credentials") method using the checkbox to select Session.expires = "Session" and some number of seconds specified in the settings.

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

      Hey Corleone, take a look at this guide from next-auth: next-auth.js.org/v3/tutorials/refresh-token-rotation Specifically, the JWT callback logic has a accessTokenExpires value you should be able to adjust.

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

    Great tutorials, but could you make an example for production enviroment. Seems nuxt-auth fail to pass NEXTAUTH_URL, just is passing all the time localhost:300/..... not the dns domain config in .env and nuxt.config.ts

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

    The page with the huge github button is what keeps showing on my landing page. How do I customise it with my login form like you have in your tutorial

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

      I believe it's just having a /login.vue page that overrides it.

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

      @@codybontecou That worked thanks. I also realize I had not defined the “signIn:” property within the pages object within the NuxtAuthHandler({}) to point to the login.vue. Thank you

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

    These are very cool components library 🔥

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

    Brother make some Nuxtjs full stack projects.

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

      I'm happy to make a proper full stack project/video course. Any project in particular you're interested in seeing me build?

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

      @@codybontecou Authorization and authentication with roles session or cookies based. And protected routes etc

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

      @@codybontecou if you have enough time so please make series on "cover the different packages or plugins that we can use with Nuxtjs and what the purpose etc

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

    After long time 😊 Thanks for Nuxt tutorials 💚

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

    Haha I was wondering the same a couple days ago how I could keep the types in sync. I haven't tried it myself but have a look at the Medium article by Jamie Curnow "Nuxt 3 server routes and Typescript". I think this solves the problem in the most consistent way :)

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

      Oh nice! I just read through the article and it has some valuable information. I have to dig into building a custom $fetch a bit more. useAsync is a native wrapper around it which solves an SSR-related problem but I think it may be losing some of the type-safety that utilizing native $fetch provides. Not 100% on this yet.

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

    🙏🙏🙏🙏🙏⛪

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

    neat project!

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

    Great video. I have one question though, why did you sidebase/nuxt-auth as dev dependency?

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

    Thanks for the tutorial! How to integrate it in a pipeline? And are you for hire as a freelancer by any chance? 👀

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

      Hey Random, happy to chat more about this. Ping me at my email, codybontecou@gmail.com, and we can discuss how I might be able to help.

  • @afolabitimothy6091
    @afolabitimothy6091 6 месяцев назад

    Hi, Can you do a video on how to use the refresh provider ?

  • @gutsbaiano7212
    @gutsbaiano7212 6 месяцев назад

    Bro, i have a problem with every time i refresh the page when i'm authenticated i log out, do you know how to solve this?

  • @user-mk7cn1zw2r
    @user-mk7cn1zw2r 6 месяцев назад

    i have this error : [worker reload] [worker init] Package subpath './core' is not defined by "exports" in ....

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

      I had the same error. A current workaround is pinning to next-auth to v4.22.5 if you're using a version like 4.24.5

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

      you may fix it by inserting into "exports" : {} part with this "./core" : { "types" : "./core/index.d.ts", "default": "./core/index.js" }, in node_modules/next-auth/package.json

  • @glpzzzdev
    @glpzzzdev 6 месяцев назад

    Amazing series of videos! Just a note: As of Jan 02, 2024, I had to add `refresh_token_expires_in Int?` to Prisma Account model because "no `refresh_token_expires_in` exists" error was preventing the account creation and to complete the sign in operation. Visible in CLI output. I was using GithubProvider when testing

  • @hinoshimizu8351
    @hinoshimizu8351 6 месяцев назад

    I always love out-of-box stuff, so thank you for introducing that to me.

    • @codybontecou
      @codybontecou 6 месяцев назад

      Me too! It makes onboarding and exploring it much easier.

  • @jonathandonda2700
    @jonathandonda2700 6 месяцев назад

    Looks clean and simple, thank you and Happy new year!

    • @codybontecou
      @codybontecou 6 месяцев назад

      It's a great application! I'm glad you like it. Happy new year! I hope 2024 is a great one for you.

  • @lalpremi
    @lalpremi 7 месяцев назад

    Cool, thanks for sharing, I wonder if can it run this locally, say in a Docker?

  • @mikhalpalych
    @mikhalpalych 7 месяцев назад

    Why do we need to do it that way? I mean through middleware and event.context. I tried to attach prisma client to a nuxtApp (and nitroApp) as an attribute, but had no success, so i guess your way is only working

  • @leowivhagen7751
    @leowivhagen7751 8 месяцев назад

    Greate video! Do you know if there is a way to force nuxt-auth to present the provider login screen every time you press logi, instead of just instant redirecting?

  • @RazahLP
    @RazahLP 8 месяцев назад

    (Regarding the problem at the end:) It should work properly if you simply add --> middleware: 'auth' <-- to the definePageMeta of the guest.vue :))

  • @draggingtheshutter
    @draggingtheshutter 9 месяцев назад

    Thanks! This helped me allot

  • @randomtimessomehow
    @randomtimessomehow 9 месяцев назад

    Hi, this is a bit random, but: 1) Are you using a portable monitor as a digital nomad? If so, which one are you using? 2) Do you have any country/city recommendations for an aspiring digital nomad like me? :)

    • @codybontecou
      @codybontecou 9 месяцев назад

      Hey hey. 1. While traveling, I’ll use an iPad as my second monitor when needed. I rarely use a second monitor - primarily when I am implementing a Frontend design or following a tutorial. 2. Depends on what you like! I travel with the intention of surfing and being in remote, raw locations. So I recommend the southern coast of Mexico (Oaxaca, Chiapas), but I understand these locations aren’t ideal for many. If you like slightly more developed locations, than the Atlantic coast of Spain and France are also beautiful.

    • @randomtimessomehow
      @randomtimessomehow 9 месяцев назад

      ​@@codybontecou Thanks for sharing! It's cool to hear where other digital nomads are. I'm in Australia right now and it's amazing. You should definitely check it out if you haven't yet :)

  • @bn_ln
    @bn_ln 9 месяцев назад

    I needed `npm i -D next-auth@4.21.1` as well

  • @ratanontsukapan3621
    @ratanontsukapan3621 9 месяцев назад

    I have the error message when submit form "Error: Callback for provider type credentials not supported"

  • @kimquoctran3286
    @kimquoctran3286 10 месяцев назад

    thank you very much but the version Nuxt lastest not support Next-auth anymore (depency Nuxt-auth 0.5) hope you will take a video soon version nuxt-auth 0.6

  • @veracsthedefiled
    @veracsthedefiled 10 месяцев назад

    After adding Prisma Adapter to the NuxtAuthHandler credentials login breaks, nothing happens when you log in by credentials

    • @leowivhagen7751
      @leowivhagen7751 8 месяцев назад

      breaks for me aswell, but using azure-ad as the provider

  • @luisfrocha1
    @luisfrocha1 10 месяцев назад

    Have you been able to figure out the issue where the token expires after a minute when using the local provider, no matter what? I tried figuring it out, but had to roll a custom-made solution instead of this because of that token expiration. I really wanted to use it, but can’t have the user need to log in every minute.

  • @mikhalpalych
    @mikhalpalych 11 месяцев назад

    I have some trouble with using github oauth. When i'm clicking the "sign in with github" button it redirects me onto 404 github page. Does anyone know what could be the problem? (Previously i have installed preceding next-auth version like someone suggested in some nuxt-auth github issue(app was just crashing although i didn't do anything else that wasn't in "quick start" section of nuxt-auth docs))

    • @mikhalpalych
      @mikhalpalych 11 месяцев назад

      Oh, i'm just retarded, i have accidentally prepended clientId with a space character

  • @PhoenixTrust
    @PhoenixTrust 11 месяцев назад

    Can you Link the Prisma Docs where you find the Schema?

  • @henriqueS9653
    @henriqueS9653 11 месяцев назад

    Special shout out for you bro ! it was the only thing that fixed the same issue here ! thank you so much ! indeed following you at github !

  • @nikodemwicon8260
    @nikodemwicon8260 11 месяцев назад

    hi, getServerSession() always return null, can you help me?

  • @GTsurwa
    @GTsurwa 11 месяцев назад

    I'm halfway through your crash course and it's superb. Thank you for this.

    • @codybontecou
      @codybontecou 11 месяцев назад

      I’m glad you like it!

  • @Ksixx
    @Ksixx Год назад

    Hi Cody! Great videos! what are you using to record your screencasts? Thanks sharing😁 keep it up!

    • @codybontecou
      @codybontecou Год назад

      Heyo. I use QuickTime and feed it into Descript for easier editing.

  • @mod__08
    @mod__08 Год назад

    Hey Cody, Just wanted to say thank you for the awesome content around nuxt 3 you provide for free!! Also watched your video about nuxt 3 with trpc 💪 Alreay looking forward to your next videos! 😊