Cody Bontecou
Cody Bontecou
  • 42
  • 122 649
Nuxt and Stripe Tutorial #7 - Webhooks
Resources:
Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_07-stripe-webhook
Repo: github.com/CodyBontecou/nuxt-stripe/tree/07-webhook
My Links:
🔔 Newsletter: www.codybontecou.com/
📁 GitHub: github.com/codybontecou/
🤖 Website: www.codybontecou.com/
🐦 X: x.com/codybontecou
🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social
🧵 Threads: www.threads.net/@bonteq
Переглядів: 25

Відео

Nuxt and Stripe Tutorial #6 - Stripe Checkout
Переглядів 317 годин тому
Resources: Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_06-stripe-checkout Repo: github.com/CodyBontecou/nuxt-stripe/tree/06-checkout My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 X: x.com/codybontecou 🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social 🧵 Threads: www.threads.net/@bonteq
Nuxt and Stripe Tutorial #5 - Stripe Customer
Переглядів 329 годин тому
Resources: Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_05-stripe-customer Repo: github.com/CodyBontecou/nuxt-stripe/tree/05-stripe-customer My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 X: x.com/codybontecou 🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social 🧵 Threads: www.threads.net/@bonteq
Nuxt and Stripe Tutorial #4 - Pricing Page
Переглядів 239 годин тому
Resources: Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_04-pricing-page Repo: github.com/CodyBontecou/nuxt-stripe/tree/04-styling My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 X: x.com/codybontecou 🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social 🧵 Threads: www.threads.net/@bonteq
Nuxt and Stripe Tutorial #3 - Authentication
Переглядів 12212 годин тому
Resources: Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_03-auth Repo: github.com/CodyBontecou/nuxt-stripe/tree/03-auth My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 X: x.com/codybontecou 🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social 🧵 Threads: www.threads.net/@bonteq
Nuxt and Stripe Tutorial #2 - Installation
Переглядів 4812 годин тому
Resources: Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_02-installation Repo: github.com/CodyBontecou/nuxt-stripe/tree/02-installation My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 X: x.com/codybontecou 🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social 🧵 Threads: www.threads.net/@bonteq
Nuxt and Stripe Tutorial #1 - Introduction
Переглядів 11212 годин тому
Resources: Blog post: www.codybontecou.com/stripe-integration-in-nuxt-3.html#_01-introduction Repo: github.com/CodyBontecou/nuxt-stripe/tree/01-intro My Links: 🔔 Newsletter: www.codybontecou.com/ 📁 GitHub: github.com/codybontecou/ Website: www.codybontecou.com/ 🐦 X: x.com/codybontecou 🔵 Bluesky: bsky.app/profile/codybontecou.bsky.social 🧵 Threads: www.threads.net/@bonteq
Nuxt Auth - Postgres.js
Переглядів 1,9 тис.4 місяці тому
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/10...
End to End Typesafety in Nuxt
Переглядів 1945 місяців тому
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
Переглядів 6 тис.5 місяців тому
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
Переглядів 1875 місяців тому
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
Переглядів 1415 місяців тому
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,3 тис.8 місяців тому
👨‍💻 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!
Переглядів 6298 місяців тому
🔥 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,3 тис.8 місяців тому
🔥 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 UA-cam 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 m...
Screencasting Automation Crash Course #7 - Figma Designs with JSON
Переглядів 78Рік тому
Screencasting Automation Crash Course #7 - Figma Designs with JSON
Screencasting Automation Crash Course #6 - Do Not Disturb
Переглядів 36Рік тому
Screencasting Automation Crash Course #6 - Do Not Disturb
Screencasting Automation Crash Course #5 - Controlling Chrome in CLI
Переглядів 55Рік тому
Screencasting Automation Crash Course #5 - Controlling Chrome in CLI
Screencasting Automation Crash Course #4 - Creating a CLI
Переглядів 82Рік тому
Screencasting Automation Crash Course #4 - Creating a CLI
Screencasting Automation Crash Course #3 - Programmatic Changing VSCode Settings
Переглядів 50Рік тому
Screencasting Automation Crash Course #3 - Programmatic Changing VSCode Settings
Screencasting Automation Crash Course #2 - Cursor Automation
Переглядів 96Рік тому
Screencasting Automation Crash Course #2 - Cursor Automation
Screencasting Automation Crash Course #1 - Intro
Переглядів 212Рік тому
Screencasting Automation Crash Course #1 - Intro
Nuxt Auth Crash Course #13 - Prisma Integration
Переглядів 3,1 тис.Рік тому
Nuxt Auth Crash Course #13 - Prisma Integration
Nuxt Auth Crash Course #12 - Prisma + DB Setup
Переглядів 3,4 тис.Рік тому
Nuxt Auth Crash Course #12 - Prisma DB Setup
Nuxt Auth Crash Course #11 - Custom User Data
Переглядів 2,9 тис.Рік тому
Nuxt Auth Crash Course #11 - Custom User Data
Nuxt Auth Crash Course #10 - REST API
Переглядів 4,1 тис.Рік тому
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
Переглядів 5 тис.Рік тому
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

КОМЕНТАРІ

  • @homeofgamesnews
    @homeofgamesnews 2 дні тому

    Is prisma works good with nuxthub ?

  • @16CXx
    @16CXx 4 дні тому

    Wow, that’s a great bonus video for this playlist. Thank you ❤

    • @codybontecou
      @codybontecou 4 дні тому

      Haha it’s a rapid authentication tutorial.

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

    video portion to the write up , thanks for this 🙏

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

    you create the tutorial I'm looking for while I'm looking for it ahah, perfect, thank you

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

      Awesome. Let me know if there’s anything specific you’d like covered.

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

      Stripe and supabase combo, just a detailed walk through on Nuxt patterns using them, although I don't use prisma.

    • @codybontecou
      @codybontecou 4 дні тому

      @QtheCoder sure, I have quite a bit of supabase + Nuxt experience actually.

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

    Thanks for the series tut. I was waiting something like that.

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

    Awesome! Already used your next-auth Tutorial for my Nuxt-auth project. Thank you! Is there any way to support you with a coin?

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

      Awesome! I hope you enjoy this one. Thank you but the only support I need is your likes and comments!

  • @16CXx
    @16CXx 5 днів тому

    Perfect, keep uploading bro ❤

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

      Just finishing up some editing! I should have episode 2 and 3 out by tomorrow.

    • @16CXx
      @16CXx 5 днів тому

      @@codybontecou yes let’s go man🔥 thank you ❤️❤️

  • @pir0zh0kDevTV
    @pir0zh0kDevTV 21 день тому

    Please, more info about Credentials auth!!! 🎉

    • @codybontecou
      @codybontecou 20 днів тому

      Hey pir0, what store of information would you like to know?

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

    here is an update version of the code, useSession is replace by useAuth and signIn expect a parameter: <script setup lang="ts"> const { status, signIn, signOut, data, getSession } = useAuth(); const loggedIn = computed(() => status.value === "authenticated"); async function handleSignIn() { await signIn("github"); } async function handleSignOut() { await signOut(); } </script> <template> <div> <button v-if="loggedIn" @click="handleSignOut">SignOut</button> <button v-else @click="handleSignIn">SignIn</button> </div> </template>

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

    This video is both interesting and ASMR. 😊

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

    U look great bro

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

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

    love how no youtuber comes further than showing some buttons.

  • @PieroSavastano
    @PieroSavastano 3 місяці тому

    awesome!!!

  • @edhahaz
    @edhahaz 3 місяці тому

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

    • @codybontecou
      @codybontecou 3 місяці тому

      Nice! Are you using lucia-auth with Nuxt?

    • @edhahaz
      @edhahaz 3 місяці тому

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

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

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

      can you explain why you choose Shadcn?

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

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

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

      @@MikeTheCook thanks bro

  • @berrybush6545
    @berrybush6545 3 місяці тому

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

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

    What about nuxt ui ?

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

      A comparison would be nice 👍

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

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

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

    • @phojie6868
      @phojie6868 3 місяці тому

      its trash

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

      @@phojie6868 why do you say that?

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

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

  • @JesusMartinez-kn8hz
    @JesusMartinez-kn8hz 4 місяці тому

    Master

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

    Great! Thx

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

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

    Great Library, Thanks :)

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

    Thanks for awesome tutorials 💚💚

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

      Slowly but surely getting content out!

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

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

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

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

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

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

    • @paaqwesilowell6141
      @paaqwesilowell6141 5 місяців тому

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

    These are very cool components library 🔥

  • @iUmerFarooq
    @iUmerFarooq 5 місяців тому

    Brother make some Nuxtjs full stack projects.

    • @codybontecou
      @codybontecou 5 місяців тому

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

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

    • @iUmerFarooq
      @iUmerFarooq 5 місяців тому

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

    After long time 😊 Thanks for Nuxt tutorials 💚

  • @randomtimessomehow
    @randomtimessomehow 5 місяців тому

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

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

    🙏🙏🙏🙏🙏⛪

  • @bcpr
    @bcpr 5 місяців тому

    neat project!

  • @miladnouri4364
    @miladnouri4364 5 місяців тому

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

  • @randomtimessomehow
    @randomtimessomehow 7 місяців тому

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

    • @codybontecou
      @codybontecou 7 місяців тому

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

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

  • @gutsbaiano7212
    @gutsbaiano7212 7 місяців тому

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

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

    • @irvingriosortiz
      @irvingriosortiz 6 місяців тому

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

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

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

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

    • @codybontecou
      @codybontecou 8 місяців тому

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

  • @jonathandonda2700
    @jonathandonda2700 8 місяців тому

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

    • @codybontecou
      @codybontecou 8 місяців тому

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

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

  • @mikhalpalych
    @mikhalpalych 9 місяців тому

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

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

    (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 10 місяців тому

    Thanks! This helped me allot

  • @randomtimessomehow
    @randomtimessomehow 10 місяців тому

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

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

      ​@@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 10 місяців тому

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

  • @ratanontsukapan3621
    @ratanontsukapan3621 11 місяців тому

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