草稿预览:黄色标出的内容是占位符,之后需要替换。
Vibe Coding for Everyone
English
← 全部免费课程

把你的网站发布上线

这些免费课只是非常基础的入门,内容是用 HTML 和 CSS 做一个简单的网页。视频为英文,录于 2025 年,当时用的工具是 Cursor 和 Windsurf。它们只是让你先感受一下,和周末营教的内容完全不是一回事。周末营会深入得多:规划一个真正的产品,用 Claude Code 把它做出来,再放到网上。

  1. 1 / 6 · 1:56

    Module 2 Overview

    In this module, I’ll guide you through building a multi-page HTML-based web project and show you how to host it live. We’ll cover best practices and tips to make your project clean and scalable, even if you’re new to coding. I’ll also highlight common mistakes to help you avoid them. Remember, our approach will be agile, allowing us to quickly iterate and improve our project. I encourage you to actively engage with the material and apply what you learn to your own projects.

  2. 2 / 6 · 10:32

    Structuring Your Web Project for Success

    In this video, I shared some essential tips on structuring your web development project to make your life easier down the line. I emphasize the importance of having a clear vision and organization, starting with a root directory that includes an index.html file as the main entry point. I recommend creating subfolders for pages, images, CSS, and JavaScript to maintain a clean structure and enhance scalability. Additionally, I suggest using meaningful file names and considering the use of UI libraries to improve design. Please take the time to implement these organizational strategies as you begin your project.

  3. 3 / 6 · 21:16

    Follow Along: Eeevee VS Peppa Pig

    In this video, I'm excited to guide you through building a fun website featuring Eevee and Peppa Pig. We'll start by creating a folder structure, including an index.html file, and I'll show you how to use AI to help design the site and generate content. I encourage you to follow along with your own ideas, and remember to use PNG images for better quality. At the end, I’ll demonstrate how to create a multi-page website, and I’ll ask you to think about your own project ideas as we go. Let's get started!

  4. 4 / 6 · 4:30

    AI Limitations: Tips and Best Practices

    In this video, I discuss the limitations of using AI agents and share some do's and don'ts based on my experiences. I highlight the importance of validating AI outputs against other models and the need to maintain manageable code lengths, ideally under a thousand lines, to ensure clarity and maintainability. I recommend restoring checkpoints when encountering persistent issues and consulting experienced individuals or other AI for insights. Additionally, I emphasize the significance of having a solid understanding of the code to avoid getting stuck in unproductive loops. My main action request is for viewers to be mindful of code structure and to seek help when necessary.

  5. 5 / 6 · 14:00

    Putting your Local Folder on GitHub: A Step-by-Step Guide

    In this video, I guide you through the crucial steps of deploying and hosting your site on GitHub, making it live and accessible to others. I walk you through creating a repository, which serves as the root folder for your project, and emphasize the importance of adding a README file for documentation. I also discuss the benefits of using Git for version control and collaboration. Please make sure to create a GitHub account if you haven't already, and follow along as I demonstrate how to sync your local files with the repository. Your active participation in this process is essential for successfully launching your project.

  6. 6 / 6 · 6:00

    Deploying Your Website with Vercel

    In this video, I walk you through the process of deploying our website using Vercel. I explain how to create an account, connect it to GitHub, and add our project for automatic deployments whenever we push updates. I also cover how to purchase a domain directly through Vercel and compare prices with other providers like Squarespace and GoDaddy. If you're interested in making this project scalable, I encourage you to consider buying a domain and following the steps to connect it to our site. Please take a look at the deployment and let me know if you have any questions or need assistance with errors.

想在线下系统地学?

周末营带你从一个想法开始,一直做到放上网,每一步都有人带着你。