Learn to code with AI

With AI tools like ChatGPT, you’re already a developer, regardless of your experience, if you know how to work with them. So in this course, you’ll build functional, interactive front-end projects while learning how to write effective prompts and debug and refine your code with the help of AI. No coding experience needed! We’ll focus on helping you prototype and build projects with AI’s assistance, turning you from a non-coder into a capable problem solver. By the end of this course, you’ll have a collection of mini-projects, newly acquired skills, and a solid foundation to keep building with AI. You’ll work on various projects using HTML, CSS, and JavaScript. Let’s do this! Course is created by Guil Hernandez and Per Harald Borgen.

Contents

Section 1: Build and deploy your first projects with ChatGPT

⌨️ (0:00:20) Intro
⌨️ (0:03:40) Welcome to a new kind of coding course
⌨️ (0:05:26) Building with AI & ChatGPT
⌨️ (0:07:30) Sign up for and access ChatGPT
⌨️ (0:09:20) What you need to know about HTML and CSS
⌨️ (0:17:30) Build a login button
⌨️ (0:27:09) Website hero section
⌨️ (0:36:40) Subscription signup form
⌨️ (0:50:27) What you need to know about JavaScript
⌨️ (0:59:23) Interactive event invite – part 1
⌨️ (1:09:07) Interactive event invite – part 2
⌨️ (1:16:03) Cake raffle app
⌨️ (1:30:38) Dive deeper and level up your coding skills
⌨️ (1:32:23) Debug, get feedback, and improve your code
⌨️ (1:44:11) Drum kit app
⌨️ (1:54:41) Deploy and share your projects
⌨️ (1:58:10) Share your feedback and project ideas

Section 2: Next-level projects with AI

⌨️ (1:59:26) What’s in store for you?
⌨️ (2:01:38) Build a wac a mole style game with facebomp
⌨️ (2:14:44) FaceBomp game – part 2
⌨️ (2:28:23) Project slideshow
⌨️ (2:40:20) Personal homepage
⌨️ (2:51:03) Personal homepage – part 2
⌨️ (3:00:55) Pushing projects to GitHub
⌨️ (3:05:34) Smart home mobile interface
⌨️ (3:18:06) Smart home mobile interface – part 2
⌨️ (3:24:29) Turn your project into a mobile app
⌨️ (3:31:11) SnapStash Chrome extension
⌨️ (3:38:08) SnapStash Chrome extension – part 2
⌨️ (3:51:39) Automate project deployment with GitHub and Netlify
⌨️ (3:53:57) Pause to reflect & recharge

Section 3. Build database-powered apps

⌨️ (3:54:58) Build database-powered projects
⌨️ (3:57:17) What you need to know about Firebase
⌨️ (3:59:31) Get set up with Firebase
⌨️ (4:03:09) Add Firebase to a project
⌨️ (4:09:52) Compliment generator
⌨️ (4:15:13) Compliment generator – part 2
⌨️ (4:20:48) Lunch break poll
⌨️ (4:29:16) Lunch break poll – part 2
⌨️ (4:34:22) RoadWallet app
⌨️ (4:44:56) Reflect and wrap up