🔗 Clerk - https://go.clerk.com/xZqJH6D 🔗 NeonDB - https://fyi.neon.tech/rc3 🔗 Arcjet - https://launch.arcjet.com/lntcDjf ➡️ My Frontend Interview Course - https://roadsidecoder.com/course-details (50% Discount) Build a Full Stack Journal App in React JS with Tailwind CSS, Supabase, Clerk Authentication, Arcjet, Shadcn UI Tutorial. This is an amazing project for your resume which will impress recruiters a lot and showcase your skillset. 🔗 React JS Interview Series - https://www.youtube.com/playlist?list=PLKhlp2qtUcSYQojD5G-ElgHezoCyq2Hgo ➡️ Next JS Course Form - https://forms.gle/ABmuVhYATuwhkcmVA ➡️ Source Code - https://github.com/piyush-eon/journal-app ➡️ Book a mentorship call with me - https://topmate.io/roadsidecoder 👤 Join the RoadsideCoder Community Discord - https://discord.gg/2ecgDwx5EE 🔗 Pagination Tutorial - https://youtu.be/cBsB7hhOzQI?si=O87nVrmwL1JyuUNF 🔗 MERN Stack Chat App Tutorial - https://www.youtube.com/playlist?list=PLKhlp2qtUcSZsGkxAdgnPcHioRr-4guZf 🔗 Complete Data Structures and Algorithms with JS Course - https://www.youtube.com/playlist?list=PLKhlp2qtUcSZtJefDThsXcsAbRBCSTgW4 🔗 JS Interview Series - https://www.youtube.com/watch?v=oUWRxJ19gfE&list=PLKhlp2qtUcSaCVJEt4ogEFs6I41pNnMU5&index=1 🔗 Cars24 Interview Experience - https://www.youtube.com/watch?v=vxggZffOqek&list=PLKhlp2qtUcSb_WQZC3sq9Vw3NC4DbreUL&index=2 🔗 Unacademy Interview Experience - https://www.youtube.com/watch?v=abbdJ4Yfm54 🔗 Tazorpay Interview Experience - https://www.youtube.com/watch?v=q-ylRxSxGcY 🔗 React Beginner's Project Tutorials - https://www.youtube.com/playlist?list=PLKhlp2qtUcSa_rX7glmB7HyFsEOEQa0Uk #reactjstutorial #frontend #ReactJS ------------------------------------------------------------------------- 00:00:00 Intro 00:00:50 Project Showcase 00:06:08 Setup Next JS with Shadcn UI 00:14:22 Root Layout Component 00:17:55 Header Component 00:20:49 User Authentication 00:25:30 Custom Login/Signup Page 00:39:29 Setup Postgres SQL DB 00:41:22 ArcJet Setup 00:43:18 Landing Page 01:14:20 Daily Prompts on Landing Page 01:19:23 Database Design 01:23:18 Creating Datbase Models with Prisma 01:32:23 Storing user data in DB 01:36:05 Routing in Next JS 01:40:53 Custom 404 Route 01:42:45 Write New Journal 01:52:34 Journal Entry Page 02:16:59 Custom Hook for Fetching APIs 02:25:19 Rate Limiting Journal Creation API 02:32:34 Create Collection Logic 02:40:14 Create Collection Dialog 02:50:05 Dasboard Page 03:15:34 Mood Analytics 03:36:52 Collection with Entries Page 03:41:30 Journal Filters 03:55:01 Delete Collection Dialog 04:03:29 Adding Shield and Bot Protection 04:07:29 Journal Page 04:17:50 Delete Entry 04:22:34 Edit Journal Entry 04:26:38 Save to Draft Logic 04:29:01 Edit an Draft UI Implementation 04:41:33 Deployment ------------------------------------------------------------------------- ⭐ Support the channel - https://www.youtube.com/channel/UCIPZVAwDGa-A4ZJxCBvXRuQ/join Special Thanks to our members -