Web Course 6 – 新手教程：代码重用

这一节课主要涉及内容：组件化的概念、对新手项目进行组件化重构 在上一节课，我们基本完成了一个带有 waitlist 链接的站，其实他就已经可以跑起来了，接下来，我们继续为这个网站添砖加瓦 优化代码结构 组件化 回顾一下什么是组件化 ✨ 这是我在 2017 年入职前一家公司时，做的关于自己岗位职责介绍的 PPT，现在看起来，应该能概括那个阶段的技术架构：web-architecture 认识 components 目录 https://nuxt.com/docs/guide/directory-structure/components 归化组件 公共组件: common social TitlePrimary 业务组件: features waitlist LabelMini Container Header Description JoinButton 重组代码 社交链接组件化 参考设计（先参考一下别人的设计 ），添加新组件 添加顶部导航栏 底部信息公共组件 我们在课上对设计稿样式的还原度不会做太多追求，主要是为了展示功能完成的思路。因为多数都需要时间不断去调试、打磨，大家在课后练习的过程中可以花时间研究 模版化 认识 layout 目录： Layouts：https://nuxt.com/docs/guide/directory-structure/layouts Views：https://nuxt.com/docs/getting-started/views#layouts 示例：https://nuxt.com/docs/examples/features/layouts 实际操作 创建一个默认 layout 迁移公共容器 迁移公共组件 多页面 认识 pages 目录：https://nuxt.com/docs/guide/directory-structure/pages 创建一个 about 页面 创建一个…...