刚接触网站开发的新手，打开电脑往往一脸懵：代码写在哪？怎么运行？浏览器为什么打不开我写的页面？其实这些问题都指向一个起点——开发环境的搭建。别被这个词吓到，它就是让你的电脑准备好写代码、测试和预览网页的一套基础配置。
选个顺手的代码编辑器
写代码就像写文章，得有个好用的“写字板”。推荐从 Visual Studio Code（简称 VS Code）入手，免费、轻量，插件丰富。官网下载安装后，打开界面简洁直观，左边是文件列表，中间是编辑区，右边还能实时看效果。
装几个实用插件会省事不少：比如“Live Server”，点一下就能本地启动一个服务器，保存代码后浏览器自动刷新；再比如“Prettier”，帮你自动格式化代码，排版不再乱糟糟。
安装基础运行环境：Node.js
很多现代前端项目依赖 Node.js，它能让电脑运行 JavaScript 代码，不只局限在浏览器里。去官网下载 LTS 版本（稳定版），安装过程一路下一步就行。
装完打开命令行工具（Windows 用 CMD 或 PowerShell，Mac 用 Terminal），输入：
node -v如果返回一个版本号，比如 v18.17.0，说明安装成功了。
创建你的第一个项目文件夹
在桌面新建一个文件夹，叫 my-website 就行。用 VS Code 打开它，然后新建三个文件：index.html、style.css、script.js。
在 index.html 里写点简单内容：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>我的第一个页面</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Hello，世界！</h1>
<script src="script.js"></script>
</body>
</html>保存后右键选择 “Open with Live Server”，浏览器就会打开 http://localhost:5500，看到你写的标题。
让样式和交互动起来
在 style.css 里加一行：
h1 {
color: blue;
text-align: center;
}再在 script.js 里写：
alert('页面加载完成！');刷新页面，蓝色居中的标题弹出来，还带个提示框，这就是完整的前端三件套跑起来了。
版本控制：用 Git 管代码
改来改去容易搞砸，Git 能帮你记录每次改动。先去官网装 Git，装完在项目文件夹右键打开 Git Bash，输入：
git init初始化仓库后，把当前所有文件加入跟踪：
git add .
git commit -m "第一次提交，基础页面完成"以后每次改完代码，都可以提交一次，像存档一样安全。
这些步骤走完，你的电脑就不再是普通上网工具，而是能产出网页的开发机器了。接下来学框架、搭博客、接接口，都有了立足点。