![Cody Bontecou](/img/default-banner.jpg)
- Видео 35
- Просмотров 113 718
Cody Bontecou
США
Добавлен 4 апр 2008
is enjoying life.
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...
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
Keyboard Shortcuts in Your Electron App
Просмотров 5062 года назад
Keyboard Shortcuts in Your Electron App
U look great bro
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
love how no youtuber comes further than showing some buttons.
awesome!!!
Oh I really wished I found this one month ago.... (but I moved to lucia-auth which has porsager/pg)
Nice! Are you using lucia-auth with Nuxt?
@@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.
I was beside Nuxt UI and Shadcn. I'm with Shadcn 100% now.
can you explain why you choose Shadcn?
@@YusnielBrocard it’s 100% customizable and easy to use.
@@MikeTheCook thanks bro
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.
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.
What about nuxt ui ?
A comparison would be nice 👍
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.
Nuxt UI is free. I'm using in production. Needs some updates, but works really well
its trash
@@phojie6868 why do you say that?
How do I get the raw jwt token within the callback?
Master
Great! Thx
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.
Great Library, Thanks :)
Thanks for awesome tutorials 💚💚
Slowly but surely getting content out!
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.
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.
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
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
I believe it's just having a /login.vue page that overrides it.
@@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
These are very cool components library 🔥
Dude, it's the best
Brother make some Nuxtjs full stack projects.
I'm happy to make a proper full stack project/video course. Any project in particular you're interested in seeing me build?
@@codybontecou Authorization and authentication with roles session or cookies based. And protected routes etc
@@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
After long time 😊 Thanks for Nuxt tutorials 💚
More to come!
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 :)
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.
🙏🙏🙏🙏🙏⛪
neat project!
Great video. I have one question though, why did you sidebase/nuxt-auth as dev dependency?
Thanks for the tutorial! How to integrate it in a pipeline? And are you for hire as a freelancer by any chance? 👀
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.
Hi, Can you do a video on how to use the refresh provider ?
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?
i have this error : [worker reload] [worker init] Package subpath './core' is not defined by "exports" in ....
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
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
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
I always love out-of-box stuff, so thank you for introducing that to me.
Me too! It makes onboarding and exploring it much easier.
Looks clean and simple, thank you and Happy new year!
It's a great application! I'm glad you like it. Happy new year! I hope 2024 is a great one for you.
Cool, thanks for sharing, I wonder if can it run this locally, say in a Docker?
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
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?
(Regarding the problem at the end:) It should work properly if you simply add --> middleware: 'auth' <-- to the definePageMeta of the guest.vue :))
Thanks! This helped me allot
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? :)
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.
@@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 :)
I needed `npm i -D next-auth@4.21.1` as well
I have the error message when submit form "Error: Callback for provider type credentials not supported"
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
After adding Prisma Adapter to the NuxtAuthHandler credentials login breaks, nothing happens when you log in by credentials
breaks for me aswell, but using azure-ad as the provider
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.
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))
Oh, i'm just retarded, i have accidentally prepended clientId with a space character
Can you Link the Prisma Docs where you find the Schema?
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 !
hi, getServerSession() always return null, can you help me?
I'm halfway through your crash course and it's superb. Thank you for this.
I’m glad you like it!
Hi Cody! Great videos! what are you using to record your screencasts? Thanks sharing😁 keep it up!
Heyo. I use QuickTime and feed it into Descript for easier editing.
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! 😊