一名大学生的前端开发练习

📝 起因

• 灵活：高度的自定义、灵活、可调整

• 美观：具有设计感，让人眼前一亮

• 展示：展现我的能力、理念和价值
• 能力：在学习过程中优化该项目
• 理念：简洁、高效的解决问题
• 价值：能为用户提供什么问题

• 程序员没博客？做贼酷炫个人网站的5个技巧！_哔哩哔哩_bilibili
  

  程序员没博客？做贼酷炫个人网站的5个技巧！_哔哩哔哩_bilibili

  程序员没博客？做贼酷炫个人网站的5个技巧！, 视频播放量 93705、弹幕量 120、点赞数 4517、投硬币枚数 2182、收藏人数 9347、转发人数 523, 视频作者 数字游牧人, 作者简介 账号在招人，有意私信；前微软工程师；28岁即将退休；创业公司在职，四名开发，一亿市值；数字游民；ACM金牌。个人网站：qzq.at，相关视频：YIKE博客2.0，一款简约风格的个人网站主页，绝美！，你也可以拥有这个个人网站--我将自己的网站改成了公开版，手把手教你搭建属于自己的hexo+github博客，Hexo搭建个人博客——系列教程，GitHub Pages 个人网站构建与发布，大二自学 𝕎𝕖𝕓 做的个人网站，打造地表最强个人网站，博客、导航、看电影、追剧、听歌、素材管理，一站搞定！，个人网站 with React JS和Tailwind CSS，React - 🚀手把手教你用 Next.js 搭建超酷个人网站！🔥 2025最新React教程，零基础也能学会！💻

  

基础

• 文档
• web.qianguyihao.com

  web.qianguyihao.com
  ：优质的前端图文教程
• 菜鸟教程 - 学的不仅是技术，更是梦想！

  菜鸟教程 - 学的不仅是技术，更是梦想！

  菜鸟教程(www.runoob.com)提供了编程的基础技术教程, 介绍了HTML、CSS、Javascript、Python，Java，Ruby，C，PHP , MySQL等各种编程语言的基础知识。 同时本站中也提供了大量的在线实例，通过实例，您可以更好的学习编程。..

  
  ：最好的儿童读物
• MDN Web DocsMDN Web Docs
  

  MDN Web Docs

  The MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps.

  MDN Web Docs
  ：Web 官方文档
• 以及更多官方/非官方文档，博文

• 工具
• Cursor - The AI Code Editor
  

  Cursor - The AI Code Editor

  Built to make you extraordinarily productive, Cursor is the best way to code with AI.

  
  ：主要的AI开发手段，几乎不用自己写代码，只要明确自己的需求，AI 就能很好的完成工作

• 技术栈
• www.tailwindcss.cn

  www.tailwindcss.cn
  ：CSS 框架，生活必需品
• Magic UI
  

  Magic UI

  Beautiful UI components and templates to make your landing page look stunning.

  
  ：美观的组件库

过程

Stage 0

0. 新建项目

1. 启动项目

2. 开发过程

• 通义灵码等插件提供了自动编写提交信息的功能

• 直到 Stage 0 结束前一次提交，才开始使用 TODO 管理开发计划

Stage 1

0. 重建项目

1. 瓶颈