0 to Prod in Seconds - Full Stack Next.js with Kirimase (Lucia v3, Vercel Postgres)

it is insane how fast you can go from zero to a full stack production app with nextjs and kiras let me show you so we're going to create a new nextjs app we're going to call this quick deploy uh we are going to say yes to everything here we're using App router typescript and until in CSS Let's uh jump into that project we're going to run kiras in it we're going to use Shad nuui drizzle postgres versel postgres Luchia V3 and that's it finishing configuration uh copying some files in installing some packages and then we'll be installing some sheden UI components in the meantime let's go to uh the browser and let's create a new database uh we are going to call this quick quick deploy create perfect let's head to the m. local copy that snippet head back to the browser we're going to jump in head to the EnV and we are going to copy down those uh values we're also going to paste in uh just replace this database you L perfect so let's run bun DB generate we follow these instructions here so bun DB generate bun DB migrate and we should be good to go so let's add everything to git and we're going to run GH repo create local uh we're going to call this quick deploy uh public yes yes yes awesome so now all we should have to do is head back to versell uh head to a workspace hit add newu project we are going to select that brand new uh project we are going to paste in our environment variables uh so if we go down paste uh copy them in here and then we are going to hit deploy and then in about 30 seconds we should be up and running so while this is happening I will mention that kiras is a lot like Shaden UI but on the level of a full stack application so what's happening behind the scenes is that we've modularized each of these components and then we effectively just past them into your project and so what that means is that you get all of this production ready code um but that you can do anything you want with it there are no libraries there are no abstractions so you can see um we have layout groups and um within your layout groups we're checking off these are things that are just things you would have done otherwise but are done for you by default um so if we head back here should be deployed and there we go so here's our project wait for the confetti yay head over you can see that this is deployed on brell quick deploy red uh let's sign in zoom in a bit we can try with a fake thing you can see incorrect username and password obviously we haven't created any accounts we do test.com and you can see that this has browser validation built in as well invalid email test.com let's make it test one 123 sign up and boom we're in we've got an application we have got uh everything responsive right out of the box and uh We've even got we can update our session we've got sonor toasts it's all just it just works and we've got light and dark mode ready to go so yeah this is it this is how fast you can do it and I hope you can use this to help Kickstart your many ideas that you want to push into production so yeah have fun

Channel: Nico Albanese

Views: 1,370

Keywords:

Id: g6MwDnDJvQE

Length: 3min 26sec (206 seconds)

Published: Mon Feb 26 2024