我在不使用框架构建我的 PORTFOLIO 时学到的东西

Source: Dev.to

我构建的每个项目都以 npx create-react-app 开始。这个例外。

常见的启动命令

• npx create-react-app
• npm create vite@latest
• npx create-next-app

启动一个项目，开始构建。UI 正常，功能正常，但浏览器常常像个黑盒子。

不同的做法

我没有直接使用框架，而是把一切简化为：

• ✅ index.html
• ❌ 没有构建工具
• ❌ 没有 npm 安装
• ❌ 没有抽象层

仅仅是 HTML、CSS 和原生 JavaScript。

我必须重新实现的内容

摆脱框架意味着要处理那些平时被隐藏的任务：

• 在多个断点下的响应式布局
• 平滑的页面切换
• 使用 CSS 变量实现的暗/亮主题
• 极光风格的动画（需要比我愿意承认的更多关键帧实验）

这更慢，但迫使我重新面对基础。

最终的作品集

成品刻意保持简洁：

• 干净的 Bento 风格布局
• 一个小型实时钟表小部件
• 六个我真的很享受构建的项目

没有花哨的东西——只是一种提醒：基础依然重要。

如果你想看看没有上层抽象的网页是什么样子，欢迎点击下方查看 👇
(链接在评论中)

Tags: #webdevelopment #frontend #javascript #webdev #learninginpublic