前言

该系列文章并非零根底入门，所以在咱们一起开始之前，须要您补充一些技术常识的储备。当然，我也会为想要入门的同学升高一些门槛。所以本文旨在介绍和对照一下，须要哪些前置的技术储备。

根底筹备

一台可能晦涩拜访网络的电脑

可能拜访 Github 开源我的项目。我的 Github 主页是：https://github.com/willin/

国内的话，后续会同步在码云上：https://gitee.com/willin（但因为手动同步，可能会忘记。）

局部的演示示例会依据我的项目的大小，别离放在 Codepen、CodeSandbox 或者 StackBlitz 上。

肯定的英语浏览能力

因为很大一部分的文档是由英文编写的，并且国际化翻译的过程会比拟滞后。

当然，折中一下，有一个很好的翻译软件也是有肯定帮忙的。但语言是一种工具，可能不便的表白和传递思维，即使是编程语言也是这样，所以倡议千万不要把语言能力的根底落下。

一些前端的根底

比方可能装置和应用 Node.js、Typescript。以及对 React 或者 Vue 有肯定的根底入门。也可能逾越阻碍去装置一些依赖包。

比如说应用镜像装置：

npm install --save v0 --registry=https://registry.npmmirror.com
# 或者应用 yarn
yarn add v0 --registry=https://registry.npmmirror.com

国内镜像应用能够参考：https://npmmirror.com/

后续的文章中，不会过多论述语法根底、环境依赖之类的问题。

当然，如果有后端的一些常识储备，那就更好了。比方关系型数据库（MySQL）、缓存（Redis）等。

布局构想

从 02 年开始，前前后后搭建过了好多个集体网站。从 Z-Blog、Wordpress、Emlog、Typecho、Jekyll、Hexo 等。

也能够看到，我当初的集体网站 https://willin.wang 是齐全动态化的（基于 Nuxt.js / Vue 2）。

晚期的时候，我都是用服务器搭建动静网站。那时候服务器老本并不高（也次要是因为我的配置需要并不高）。动静网站更灵便，但服务器、数据库都是要免费的。尽管也有便宜的服务器，然而配置低，超卖景象重大，拜访体验挺差的。如果经济条件容许，还是能够整一台服务器折腾折腾试试的，对于学习成长还是很有帮忙的（本人在本地搭建服务器环境也是一样的学习效果，成就感会低一些）。就是收益不太高（个别只有投入，没有💰支出）。

起初随着工作后生存的累赘（当然也有一部分域名投资失败的前事不忘; 后事之师），不再把余钱投入到服务器上。所以用过一些动态的站点生成器，也本人写过一些，总体感觉……就是顺当，像是被压在了五指山下，空有洪荒之力却无处可用。因为不够灵便，很多事件做不了。比方评论零碎、文章访问量统计展现之类的。

目前的布局是这样：

• 框架选用 Remix（基于 React 的全栈框架）

• 部署在 Cloudflare Pages 寰球 CDN 减速

  • 并且还提供了 KV 缓存（这样就省下了 Redis 缓存的开销）

• 数据库应用 PlanetScale 云端 MySQL 服务

  • 应用 Prisma 下一代 ORM

整套配置均为收费，后续收费额度超出后阶梯免费，是我目前调研老本最低的后期计划了。在后续的更新中，可能会交叉一些动态或者动静计划、框架的简略比照。

中途退出

可能会有不少同学会在我的项目中途才发现这个系列的文章。所以我尽量优化代码提交，每次应用 Feature 分支，Squash 形式合并回主分支。这样，能够从提交历史中不便的回溯和查看对应的代码。

相似于图中箭头所示，main 分支中均以 PR 模式合并进来。点进 PR 查看各个 Feature 分支的代码提交，并且代码提交也如图中所示，参考 Angular 提交信息标准。

探讨和奉献

能够通过以下渠道参加探讨：

• 文章评论留言
• Discord 讨论版：https://discord.gg/ggFuFDNd
• 邮件：i(a)sh.gg，将 (a) 替换为 @

以及欢送对我的开源代码进行斧正和优化。