Skip to main content

简介

全栈开发

全栈开发涉及多个技术、产品和服务。从大的方面来说,至少包括三个层次:

  • 前端:主要用于页面的展现,实现与用户的交互;
  • 后端:实现各种业务功能,并且保障业务的平稳运行;
  • 服务商:负责提供各种后端服务的基础架构,包括服务器、域名处理等;

仅前端的技术就包括 Javascript/Typescript, html, css, 各类框架, 后端的技术包括数据库,鉴权, 函数调用,消息队列,文件存储,文档处理,域名托管,与 AI 互动等诸多事项。对于服务商,也要考虑这些服务商能提供的服务种类以及成本。并且还包括在这之下的开发工具,工具链的选择,软件版本/仓库管理,冲突解决等事宜。

目标

本教程的目标还是为了把各个技术环节用最简要的信息提供最基础的功能,使得在这个技术迅速进展的时代,能够用合理的方法快速搭建出一套基本能够满足日常需要的 Web 应用。

服务选择

主要的服务选择包括 CloudflareGoogle Cloud PlatformSupabaseVercel。选择这几家的服务主要是考虑功能和价格的因素,在初期主要集中在 CloudflareSupabase。其中 cloudflare 完成了大部分服务的提供,如:网站、云函数、存储、数据库、KV、消息队列等功能。Supabase 则实现了大部分鉴权、授权、高并发数据库的功能。

Cloudflare

  • Workers & Web Pages Functions: Up to 10ms CPU time per request, Up to 100,000 per day (UTC+0)
  • R2: Storage 10 GB-month / month, Class A Operations 1 million requests / month, Class B Operations 10 million requests / month, Egress (data transfer to Internet) Free
  • D1: Serverless SQL database, Up to 5 million rows read per day, Up to 100,000 rows written per day, 5GB of included storage
  • KV: Global low-latency key-value edge storage, Up to 100,000 read operations per day, Up to 1,000 write, delete, list operations per day
  • Durable Objects: Serverless compute and SQL database, Up to 100,000 requests per day, Up to 13,000 GB-sec of duration per day, Up to 5 million rows read per day, Up to 100,000 rows written per day, 5GB of included storage

Supabase

  • 无限 API 请求;
  • 每月 50,000 活跃用户(MAU);
  • 数据库容量:500 MB
  • 共享 CPU + 500 MB RAM
  • 带宽出口(Egress):5 GB
  • 缓存带宽出口:5 GB
  • 文件存储容量:1 GB

前端技术栈

  • 开发语言:Javascript/Typescript, Tailwindcss
  • 框架结构:Vue, Nuxt
  • 仓库管理:Monorepo, pnpm
  • 开发软体:VSCode

后端技术栈

  • 开发语言:Javascript/Typescript, Markdown, python, SQL
  • 数据库:SQLite, PostgreSQL
  • 文档管理后台:Docusaurus
  • 服务 APIWrangler, Supabase

安排

第一阶段

时间:2周。主要关注内容:

  • 熟悉 javascript/Typescript 异步函数,包的管理与引入;
  • 文档数据库的实现;
  • 基于 Javascript/Typescript, Nuxt 前端的实现;
  • Cloudflare Workers 的调用,并且在 Nuxt 框架中可以使用完成云端函数功能;

第二阶段

时间:2周。主要关注内容:

  • Supabase 服务的调用;
  • 鉴权/授权,jwt
  • 进一步掌握 Nuxt 的内容,完成视频至少一个教程;