← All freeCodeCamp videos

Google Calendar Clone Tutorial – PHP, MySQL, JavaScript, HTML, and CSS

48,623 views 1,631 likes 2025-07-03 3:01:41 Watch on YouTube ↗ freeCodeCamp ↗
FullstackWeb DevelopmentPHPMySQLJavaScriptHTMLCSS

Chapters (9)

Show the creator's full description
Learn how to build a full stack Google Calendar clone using built entirely from scratch using PHP, MySQL, JavaScript, HTML, and CSS — no frameworks, no external libraries — just clean, understandable code. Mohammed Al Abrah created this course. Code: https://github.com/MOHAMMEDFAHD/web-development-collections Course developed by @programmingoceanacademy Academy Website: https://www.programming-ocean.com ⭐️ Contents ⭐️ 0:00:00 🟢 Welcome & Overview 0:00:55 🚀 Live Demo: Full Calendar App in Action 0:11:19 🧱 HTML Structure: Building the Foundation 0:43:19 🎨 CSS Styling: Responsive & Modern UI Design 1:23:04 🗄️ Database Setup: MySQL Schema & PHP Connection 1:29:59 🧠 PHP Logic: Handling Add, Edit, Delete Appointments 1:59:19 🧩 JavaScript Logic: Dynamic Calendar Rendering & Modal Control 2:38:24 ⏰ Time Feature: Adding Time Slots & Fixing Issues 2:51:16 ✅ Final Showcase: App Demo + Full Walkthrough ❤️ Support for this channel comes from our friends at Scrimba – the coding platform that's reinvented interactive learning: https://scrimba.com/freecodecamp 🎉 Thanks to our Champion and Sponsor supporters: 👾 Drake Milly 👾 Ulises Moralez 👾 Goddard Tan 👾 David MG 👾 Matthew Springman 👾 Claudio 👾 Oscar R. 👾 jedi-or-sith 👾 Nattira Maneerat 👾 Justin Hual -- Learn to code for free and get a developer job: https://www.freecodecamp.org Read hundreds of articles on programming: https://freecodecamp.org/news

Description and video by freeCodeCamp.org. This page is an independent companion view; the video is embedded from YouTube.