Back to Browse

27 - Payment Method Page | React Hook Form | Action - [Next js 15, React 19, PostgreSQL , Prisma]

259 views
Mar 17, 2025
21:22

27 - Payment Method Page | React Hook Form | Server Action - (Next js 15, React 19, PostgreSQL , Prisma, ShadCN, PayPal, Stripe API integration) In this Session we'll be creating Payment Method Type selection Page where user will select payment method as (PayPal, Stripe and Cash On delivery) and data will be saved to the database. Live URL: https://shoes-store-sage.vercel.app/ 🚀 Welcome to our channel KUMAR Programming! 🎉 Welcome to the Next.js eCommerce Complete Project tutorial! 🚀 In this series, we’ll give you an overview of the full-stack application and we’ll be building using Next.js, React.js, PostgreSQL, Prisma, and ShadCN-UI. Whether you’re a beginner or an experienced developer, this series will guide you through every step of creating a fully functional eCommerce website, from setting up the database to designing an intuitive user interface. 🎯 What we’ll cover in this project: Next.js for server-side rendering and seamless page transitions React.js for building interactive and dynamic user interfaces PostgreSQL as our relational database to store products, users, and orders Prisma for ORM and easy database management ShadCN-UI for a modern, customizable UI design Paypal and Stripe integration for payment. By the end of this series, you'll have a fully functional eCommerce platform that you can customize and deploy. So, let’s dive in and start building! 🔔 Don't forget to like, subscribe, and click the bell icon to stay updated with the latest tutorials! 📌 Source Code & GITHUB Repository : https://github.com/kyprogramming/shoes-store 🚀eCommerce Website: https://pre-shoes-store.onrender.com 🎯 YT Channel: https://www.youtube.com/@kyprogramming ☕ Buy me a Coffee: https://buymeacoffee.com/kkyprogramming ⏰ Timestamps for Easy Navigation 📌 02:00 - Create Cart Session id 🔥 Next js 15 New Features: 1. Support for React 19 2. Enhanced CLI 3. Turbopack Dev (Stable) 4. Static Route Indicator 5. Enhanced Forms (next/form) 6. TypeScript Support 🔥 React Js 19 New Features: 1. Actions 2. New Hooks useActionState, useFormStatus, 3. React Server Components 4. New API: use 5. Enhanced Error Reporting 6. Support for Document Metadata 7. Improved Hydration and Resource Loading 🔥 Prisma Prisma is an open-source Object-Relational Mapping (ORM) tool designed to streamline database interactions in Node.js and TypeScript applications. It offers a suite of tools that enhance database workflows: Prisma Client Prisma Migrate Prisma Studio Integrating Prisma with PostgreSQL: Type Safety Schema Migrations Developer Experience 🔥 PostgreSQL Database Features: PostgreSQL is a powerful, open-source relational database management system (RDBMS) that offers a rich set of features designed to handle a variety of data management and application needs. Here are some key features of PostgreSQL: 1. ACID Compliant 2. Advanced SQL Features 3. Extensibility 4. JSON and JSONB Support 5. Concurrency Control 6. Full-Text Search 7. Foreign Data Wrappers (FDWs) 8. Replication and High Availability 9. Partitioning 10. Security Features 11. Foreign Keys and Data Integrity 12. Indexes and Performance Optimization 13. Backup and Recovery 14. Cross-Platform Compatibility 15. Advanced Analytical Queries 🔗 Useful Resources & Links 📌 Official Next Js : https://nextjs.org/ 📌 Prisma: https://www.prisma.io/ 💬 Join the Conversation! 💡 What other Angular topics should we cover? Drop your suggestions in the comments! 🔥 Like, Share & Subscribe to support the channel! 🔔 Turn on notifications so you never miss an update! 🔥 Popular playlist 🔹 Next.JS - Full Stack Complete Project - React Js ,Typescript, Prisma, PostgreSQL , ShadCN-UI , Paypal , Stripe , React Form Hook , ZOD Validations: https://www.youtube.com/playlist?list=PLbDH2D6bQCl1HoXZOQg39Ux9st0e9Ka0W 🔹 Unit Testing - Mocha Chai: https://www.youtube.com/playlist?list=PLbDH2D6bQCl2hNtDUvCyG11ehDCWF-0tu 🔹 Angular Interview Question Answer Series: https://www.youtube.com/playlist?list=PLbDH2D6bQCl1lCLachXihVpxsFMktiT6S 🔹JavaScript - Interview Questions Answer Series - Introduction : https://www.youtube.com/playlist?list=PLbDH2D6bQCl2arbEbC3uH-VWeyr7XR344 🔹 Learn Docker Step By Step : https://www.youtube.com/playlist?list=PLbDH2D6bQCl3iqP258CxpA4u2mVzUAy_3 🔹 NodeJs - Express - TypeScript - MongoDB - Library Management (Complete Project) - Step by Step: https://www.youtube.com/playlist?list=PLbDH2D6bQCl3ixcLdeUaJHIDj9qj_boEv #NextJs #eCommerce #ReactJS #PostgreSQL #Prisma #ShadCNUI #FullStackDevelopment #NextJsTutorial #ReactJSProject #WebDevelopment #eCommerceWebsite #NextJsEcommerce #DatabaseManagement #UIDesign #WebApp #ModernWebDevelopment #PrismaTutorial #ShadCNUIComponents #FrontendDevelopment #BackendDevelopment #React19 #ReactNewFeatures #ReactTutorial #ReactUpdate #ReactDev #WebDevelopment #FrontendDevelopment #ReactHooks #ReactNewRelease #ReactApp #ReactComponents

Download

0 formats

No download links available.

27 - Payment Method Page | React Hook Form | Action - [Next js 15, React 19, PostgreSQL , Prisma] | NatokHD