Notion+Github+Vercel建站极速版

type

status

date

slug

summary

category

icon

password

📌

Before reading…

建站方案：Notion+Github(NotionNext)+Vercel

可免费实现（域名配置可能须购买，不过也可以申请免费的）

准备

这几步可以做到相关部分再注册。

notion账号（官网注册，非常简单，建议教育邮箱注册申请教育版）

github账号（同上）

vercel账号（通过github注册）

一个域名（可选）

最好全程挂梯

本篇博文是NotionNext建站的快速指南，基于官方操作手册。其实手册上讲得很详细很清晰，并且操作起来也很快，这里只是一个极简版的总结，跳过了一些非常基础的操作，适用于连官方快速指南都懒得看的懒人。这套方案操作难度低，几乎不会遇到什么问题。下面是官方项目地址和操作手册：

NotionNext中文 | Notion笔记，轻松建站，NotionNext官网

Notion笔记，轻松建站，NotionNext官网

https://www.tangly1024.com/

NotionNext-快速免费建站 | NotionNext帮助手册

无需服务器、即使是小白也能几分钟搭建自己的独立博客站～如果你在使用Notion这款神级笔记本的话，不妨来试试顺手建个网站🤣🤣🤣，这是一款基于NotionAPI的博客系统。

https://docs.tangly1024.com/about

💡

点击每一节小标题可跳转官方操作手册链接或对应的其他网址

🚀 操作步骤

1. 复制notion模板和github项目库到本地

1.1 notion模板复制

Notion 博客 | Notion

一个NotionNext搭建的博客

https://tanghh.notion.site/02ab3b8678004aa69e9e415905ef32a5?v=b7eb215720224ca5827bfaa5ef82cf2d

复制到自己的账号里后，点击右上角的Share选项—>Public—>复制URL中32位的页面ID（下面以官方手册中的网址为例）：

https://www.notion.so/tanghh/02ab3b8678004aa69e9e415905ef32a5?v=b7eb215720224ca5827bfaa5ef82cf2d 其中的02ab3b8678004aa69e9e415905ef32a5就是页面ID，即?v=前的数字字母

1.2 fork Github项目库

github.com

https://github.com/tangly1024/NotionNext/fork

2. Vercel部署

在官网注册账号，可以直接通过github注册：

Vercel: Build and deploy the best web experiences with the Frontend Cloud

Vercel's Frontend Cloud gives developers the frameworks, workflows, and infrastructure to build a faster, more personalized web.

https://vercel.com/

原作者提到在这个过程中可能会出现一些问题，我这里直接粘贴过来了：

可能出现的问题

若注册时提示 Error:This user account is blocked.Contact [email protected] for more information.
这是由于 Vercel 不支持大部分国内邮箱。可以将 github 账号主邮箱改为 Gmail 邮箱。
但是根据群友反应，将 github 账号主邮箱切换为 Gmail 以后，Vercel 又会提示需要使用手机号码验证。然而 github 并没有提供手机号码绑定的内容。
综上，建议一开始注册 github 账号时就使用 Gmail 等国外邮箱进行注册。
国内访问Gmail的方案：
直接使用 QQ 邮箱手机版，它提供 Gmail 的访问路线，可以直接注册并使用。使用 Ghelper 等浏览器插件访问。详情可以参考这篇文章：玩转 Microsoft-Edge
若是执着于当前Github账号，可以参考以下方案进行尝试:
完成了 Gmail 等国外邮箱的注册，打开 github-> 头像 ->settings->Emails>Add email address, 并完成邮箱验证。在Add email address 下方的Primary email address 选项中将 Gmail 设置为主邮箱。