全栈工程之旅——构建精简的前端。

这篇文章最初发表在我的博客legobox上。

从我开始构建 Spectre 到现在已经过去三周多了。两周前，所有设计都已完成，是时候深入到具体的实现细节了。在这个阶段，对我来说，从前端入手是最合理的做法，通常来说，这也是最合理的做法。
大多数人会建议先构建 API，但这需要非常周全的预见性，而在这个例子中，应用程序的核心结构很简单。

这些都是需要 API 的主要方面，因此我决定先从前端入手，以便更好地了解这些 API 的使用方式。

思考过程

我的开发过程很大程度上依赖于 Scrum 方法，但我也会结合 KPI 来最大限度地发挥自己的潜力。因此，在接下来的几周里，我会把要完成的任务放在 Scrum 看板上，并为每个任务设定 KPI 分值，然后尽力达到目标 KPI 分值。有时我能达到，有时则不能，但这总能让事情运转起来。

作为单页应用程序（SPA）的拥护者，我非常喜欢它们的结构。SPA有很多优点，对于那些不熟悉这个术语的人，让我们从头开始。

单页应用程序 (SPA) 是一种前端全部加载在单个文件（通常是 index.html）中的应用程序。这样，SPA 只需加载一次所有资源，即可实现前端无缝运行，无需从服务器加载其他页面。SPA
应用加载完成后，仅加载 JSON 响应以及应用程序中其他区域可能需要的数据。

框架：
在本例中，我的单页应用程序 (SPA) 工具是 React JavaScript 框架。我使用 React 编程大约一年多，总的来说，它是一个非常不错的工具，功能结构良好，并且能够快速构建原型。

我还会将 React 与其他一些库结合使用，这些库在开发过程中发挥着不同的作用。其中包括：

服务器方面，
我使用一台VPS服务器来运行项目，用于实时预览。
目前已实现以下页面。

这些功能完全按照设计规范创建，所有实现都可以在服务器预览网站上找到。

部署：
该项目已配置为使用 GitLab 的 CI 集成来搭建 CI 系统，每当我向 master 分支推送代码时，系统都会自动部署到服务器。为了更好地了解这方面的内容，我之前写过一篇文章。

服务器的搭建是通过 Ansible 完成的，对我来说，在项目中使用 Docker 有点杀鸡用牛刀了，因为我的 VPS 上的其他项目大部分时间都在相同的堆栈上运行，除非是自定义软件或特殊情况。

本周我将按照设计实现其他界面，以便更清楚地了解用户使用该应用程序的体验。这可能需要进行一些 A/B 测试和网站分析，以便清晰地了解用户在使用该工具时遇到的所有痛点。由于这是一个 SaaS 应用，而非面向社交的系统，因此该项目必须专注于其工作原理和功能。

到下周结束，我应该就能完成所有接口的实现，并准备好上线，同时身份验证功能的基本设置也应该到位。
搭建平台的过程总是充满乐趣，而且在大多数情况下，它能为你开启通往更广阔天地的道路。至于工作习惯、职业道德和时间管理，或许以后我会另写一篇，但目前我们进展顺利。