Full Stack Web Development in the Cloud Course - Svelte, Postgres, Vercel, Gitpod

Channel:
United States freeCodeCamp.org
Subscribers:
10,700,000
Published on ● Video Link: https://www.youtube.com/watch?v=OUzaUJ3gEug


Duration: 7:20:37
193,524 views
5,478

In this tutorial for beginners, you will learn how to develop a full-stack web application entirely in your browser using Gitpod (https://www.gitpod.io/). You will build the app with Svelte and Postgres. From creating a new repository to deploying to production, we will write and discuss every line of code.

✏️ Course developed by Mike Nikles. Mike on Twitter: https://twitter.com/mikenikles.

📝 Code: https://github.com/gitpod-io/full-stack-web-development
Pull requests are available for each section of the course.

💻 The technology stack for this course includes:
💿 Svelte (https://svelte.dev/)
💿 SvelteKit (https://kit.svelte.dev/)
💿 Prisma (https://www.prisma.io/)
💿 Postgres (https://www.postgresql.org/)
💿 Vercel (https://vercel.com/)
💿 Railway (https://railway.app/)

🎉 This course was made possible through a grant from GitPod.

⭐️ Course Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:08:51) What you will learn
⌨️ (0:12:07) Gitpod developer environment
⌨️ (0:13:33) Project Overview: A todo app
⌨️ (0:16:33) Architecture
⌨️ (0:20:39) Initialize the application
⌨️ (0:40:12) Intro to SvelteKit
⌨️ (0:55:31) Configure Gitpod
⌨️ (1:32:07) Develop HTML structure
⌨️ (1:53:46) Apply CSS styles
⌨️ (2:44:32) Develop CRUD endpoints: GET and POST
⌨️ (3:31:54) DELETE
⌨️ (4:16:45) PATCH - Edit Text
⌨️ (4:33:22) PATCH - Mark as Done
⌨️ (4:48:41) Enhance HTML forms
⌨️ (5:40:56) Install & start the dev database
⌨️ (5:50:33) Use Prisma ORM
⌨️ (6:26:32) Update API to use Prisma
⌨️ (6:47:58) Deploy Database on Railway
⌨️ (7:03:33) Deploy web app & API on Vercel
⌨️ (7:12:28) Project review
⌨️ (7:16:14) What's next?
⌨️ (7:19:22) Wrap up

Closed captions for this video were provided by Primsa. You can get free captions for your own videos that feature Prisma here: https://pris.ly/closedcaptions

🎉 Thanks to our Champion and Sponsor supporters:
👾 Raymond Odero
👾 Agustín Kussrow
👾 aldo ferretti
👾 Otis Morgan
👾 DeezMaster

--

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://freecodecamp.org/news



Other Videos By freeCodeCamp.org


2022-01-1110 Common Coding Interview Problems - Solved!
2022-01-10React Course - Beginner's Tutorial for React JavaScript Library [2022]
2022-01-06PyTorch and Monai for AI Healthcare Imaging - Python Machine Learning Course
2022-01-05Figma Tutorial for UI Design - Course for Beginners
2022-01-03Code a 2D Game Engine using Java - Full Course for Beginners
2021-12-22Learn to Code RPG - A freeCodeCamp.org Game [playthrough + gamedev interview]
2021-12-21Build a CRM with Google Sheets + PostgreSQL + Stripe API Tutorial (Ecommerce Course)
2021-12-20Internet History, Technology, and Security - Full Course from Dr. Chuck
2021-12-15Linked Lists for Technical Interviews - Full Course
2021-12-14Web App Vulnerabilities - DevSecOps Course for Beginners
2021-12-13Full Stack Web Development in the Cloud Course - Svelte, Postgres, Vercel, Gitpod
2021-12-08Can you code on a phone? Android Mobile Programing Tutorial
2021-12-07Bootstrap CSS Framework - Full Course for Beginners
2021-12-06The Business of Building Apps - App Product Management Course for Developers
2021-12-02Razor Pages for ASP.NET Core - Full Course (.NET 6)
2021-11-30Rust Programming Course for Beginners - Tutorial
2021-11-29NoSQL Database Tutorial – Full Course for Beginners
2021-11-24Data Analysis with Python for Excel Users - Full Course
2021-11-23Feature Toggles - Why and How to Add to Your Software
2021-11-22Learn ASP.NET Core MVC (.NET 6) - Full Course
2021-11-18Advanced Git Tutorial - Interactive Rebase, Cherry-Picking, Reflog, Submodules and more