Build & Deploy Full Stack Next.js Expense Tracker app using React, Tailwind Css, Drizzle ORM, Clerk
Welcome to our beginner-friendly tutorial where we guide you through building and deploying a full-stack Next.js expense tracker app! In this step-by-step guide, we'll use React for the frontend, Tailwind CSS for styling, and Dirzzle ORM for managing our database. Whether you're new to web development or looking to expand your skills, this project is a fantastic starting point! ⭐ TubeGuruji : https://tubeguruji.com ⭐ Clerk : https://go.clerk.com/wPzIBHq ⭐ Eraser.io : https://www.eraser.io ⭐ Support me on : https://www.buymeacoffee.com/tubegurujiw 📚 Materials/References: Source Code of Application (give it a star ⭐): https://dcmk.short.gy/expense-tracker Dirzzle ORM: https://orm.drizzle.team Free Members Access : https://www.tubeguruji.com/course-preview/full-stack-expense-tracker-app 🌟 Free Source Code for Members: https://www.tubeguruji.com 🌟 App Demo : https://expense-tracker-tubeguruji.vercel.app/ 🖼️ Follow us on Instagram: https://www.instagram.com/tubeguruji 💼 Business Inquiries: [email protected] By the end of this tutorial, you'll have a solid understanding of building dynamic web applications and deploying them for the world to see. Let's dive in and start coding together! Join this channel to get access to perks: https://www.youtube.com/channel/UC33Tc4FCgd_to314_b2hNTg/join ⏰ Timestamps: 00:00:00 Introduction & App Demo 00:05:29 React-NextJs Project Setup 00:19:28 Landing Screen 00:32:33 Authentication 00:47:56 SideNav Bar 01:06:05 Backend Setup (Drizzle ORM + Postgres + Neon) 01:23:03 Create New Budget 01:52:50 Display Budget List 02:14:11 Skelton Effect (For Loading...) 02:20:26 Add New Expenses 02:45:18 Display & Manage Expenses 02:58:36 Delete Budget 03:07:34 Edit / Update Budget 03:19:01 Dashboard (Cards) 03:36:44 Bar Chart 03:43:28 Budget List & Expenses List (On Dashboard) 03:54:44 Quick Fix 03:59:13 Deploy App on Vercel #nextjs @neondatabase #tailwindcss #reactjs #expensetracker #nextjstutorial #nextjs14 #tubeguruji @tubeguruji
Download
1 formatsVideo Formats
Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.