Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Build Your Own AI Website Builder Using PERN Stack - Full Stack React JS Project Tutorial

GreatStack via YouTube

Overview

Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
Learn to build a comprehensive AI-powered website builder similar to Lovable, Replit, or Base44 using the PERN stack (PostgreSQL, Express, React, Node.js) in this extensive full-stack development tutorial. Master the creation of an intelligent website generator where users can input prompts and instantly generate custom websites using a free AI model, complete with user authentication, credit-based usage system, and Stripe payment integration for purchasing additional credits. Start by setting up a React project with Tailwind CSS, Router, and TypeScript, then progress through building a responsive user interface and creating a robust Express backend server. Connect your application to a PostgreSQL database using Neon, implement secure user authentication, and develop APIs for AI-powered website creation functionality. Integrate your backend APIs with the frontend, add Stripe payment gateway for seamless credit purchases, and deploy the complete application online using Hostinger VPS. Gain hands-on experience with modern AI SaaS application development best practices, full-stack deployment strategies, and payment processing integration while building a production-ready website builder that can handle real users and generate revenue through its credit system.

Syllabus

00:00 Project Overview
07:01 React Project Setup with Tailwind CSS, Router & Types
30:58 Building Frontend User Interface
04:04:14 Create Backend Basic Express server
04:15:24 Connect PostgreSQL Database with Neon
04:26:43 Implement user authentication
05:14:25 Build API for AI website creation
06:54:26 Integrate Backend APIs with Frontend
08:04:19 Add stripe payment gateway
08:49:15 Deploy Online with Hostinger

Taught by

GreatStack

Reviews

Start your review of Build Your Own AI Website Builder Using PERN Stack - Full Stack React JS Project Tutorial

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.