Build Full Stack Doctor Appointment Booking System Using MERN Stack | Complete React JS Project

Published: 26 September 2024
on channel: GreatStack
87,233
3k

Learn How to make MERN Stack Doctor Appointment Booking App using React JS, MongoDB, Express and Node JS | Compete Full Stack React JS project for Resume

👉 Source Code: https://greatstack.dev/go/prescripto

👉 Live Preview: https://prescripto.vercel.app/
👉 Download the assets: https://greatstack.dev/assets/prescri...
👉 Figma Design: https://greatstack.dev/go/figma-presc...

SUBSCRIBE: ‪@GreatStackDev‬

-------------------

In this tutorial we are going to learn How to create a Full Stack Doctor Appointment Booking system. This is step by step tutorial we will use React JS, MongoDB, Express JS and Node JS to build our own appointment booking website, so It will be a MERN Stack project. You can use thi project for your Resume or College projects.

This full stack appointment booking system can be used by a doctor or a hospital. Because in this project we have created 3 level of authentication. 1st one is for Patients, so that patient can login on the website, book appointment with doctor and manage the booked appointment. 2nd one is doctor login, so that doctor can login and check the appointment and their earning. Doctor can update their profile also from dashboard. 3rd one is Admin Dashboard where admin can manages the appointment and admin can also manage the doctor profile.

In this full stack application we will integrate the online payment gateways so that user can pay the appointment fee online on this website. You can also customize this full stack appointment booking app and use this project for your college projects and your personal portfolio or resume.

-------------------
Watch Full Stack E-commerce Website tutorial:
👉    • Create Full Stack E-commerce Website ...  

Watch Full Stack Food Order Website tutorial:
👉    • How To Create Full Stack Food Deliver...  

Watch Full Stack Chat App tutorial:
👉    • Full Stack Real-time Chat Application...  

Watch Full Stack Music Streaming Website
👉    • How To Create Full Stack Spotify Clon...  

Watch Full Stack Blog Website Tutorial
👉    • How To Create Full Stack Blog App Usi...  

-------------------------------------
Build more React JS projects:

Complete Portfolio Website In React:
👉    • How To Make Portfolio Website Using R...  

Build ChatGPT Clone In React:
👉    • Build ChatGPT In React JS Using OpenA...  

Build AI Image Generator with OpenAI In React
👉    • Build An AI Image Generator App In Re...  

Create Weather App In React
👉    • How To Create Weather App Using React...  

-------------------------------------
Timestamps:

00:00 Project Overview
08:14 Create a React Project
12:30 Add Tailwind CSS In React Project
17:17 Create Components and Pages in React project
28:40 Create Home Page
01:49:51 Create All Doctors Page
02:08:54 Create Doctor Appointment Page
03:03:26 Create About and Contact Page
03:20:12 Create Login Page
03:36:12 Create Patient Profile page
04:04:44 Create Appointments page for patients
04:17:18 Make the website responsive
04:35:07 Create Backend Server
05:00:23 Create MongoDB model to store Doctors Data and User Data
05:13:23 Create API to add Doctor data in Database
05:46:44 Create API for Admin Login
06:03:57 Create Admin Panel
07:29:29: Create Add doctor functionality in Admin Panel
07:57:34 Display all doctors list in Admin panel
08:29:53 Display all doctors on frontend website from Database
08:43:18 Create Patient Login and Registration system
09:25:34 Display and update patient profile data on website
10:15:45 Create Appointment Booking Functionality
10:56:03 Display Booked appointments on Website
11:13:58 Create Appointment Cancellation Feature for Patient
11:34:13 Integrate Online payment gateway to make online payment
12:14:57 Display and Manage Appointment for Admin panel
12:49:48 Create Dashboard Page for admin panel
13:17:32 Create doctor panel ( doctor dashboard )
13:41:31 Display and manage appointments in Doctor panel
14:33:07 Create Dashboard page for Doctor panel
14:53:25 Display and Update profile data In Doctor panel

-------------------------------------
Images Credit:
https://www.pexels.com/
https://unsplash.com/
https://www.freepik.com/

-------------------------------------
Connect with me:
👉 https://linktr.ee/iamavinashkr

Connect with GreatStack:
Instagram:   / greatstackdev  
Twitter:   / greatstackdev  
Facebook:   / greatstack  


Watch video Build Full Stack Doctor Appointment Booking System Using MERN Stack | Complete React JS Project online without registration, duration hours minute second in high quality. This video was added by user GreatStack 26 September 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 87,23 once and liked it 3 thousand people.