Sonatta: 生活小栈

10 分钟教你创建个人网站——傻瓜式的网站搭建教学

2020-02-23 · 4 min read
Blog Gridea

前言

在疫情肆虐全国,且尚未平息的当下,相信有很多被迫宅在家里的 有 志 青 年 ,不是葛优瘫在家里过养老生活,就是漫游在网课的海洋里(大雾)。由于我也没什么事情干,那么今天就给大家带来一篇教程,用通俗易懂的方式教你如何搭建个人网站来展(酷)示(炫)自(装)我(逼)。

请放心,全程不会产生任何费用,所以就算你跟我一样寒酸,也可以轻松的创建一个个人网站

注册 Github

首先,因为网站是托管在 GitHub Pages 上的,所以首先我们要注册一个 Github 账号(同样,代码也可以托管在 Coding Pages 中,有兴趣的同学自己尝试,这里只谈用 GitHub Pages 的方法)。

自上而下依次是:用户名、邮箱、密码。


下一步。


Choose Free。


一些个性化设置,可以直接跳过往下滑。


直接 Skip this step 跳过。


进行邮箱验证。


验证完成后就可以开始使用了,恭喜你,第一步完成!

创建仓库

接下来我们要创建一个仓库,用于存放网页代码(放心,不需要你来写代码),点击 Start a Project

请注意,Repository name(即仓库名)须按照图示方法填写,即 用户名.github.io(填写你自己注册时使用的用户名),然后直接 Create Repository(可以不用像图示一样勾选README)。

创建令牌

顾名思义,令牌就是通行证,有了令牌我们才能在后续的步骤中将我们的代码上传到仓库中。

点击左上角的头像,进入设置。



选择最下面的 Developer settings。


选择 Personal access tokens,然后 Generate new token。


接下来,Note 栏随便填一下,在下面的 Select scopes 中勾选 repo 即可。


直接 Generate token。


接下来生成的一串神秘代码(大雾)就是令牌了,复制后记得保存起来,令牌只会出现这一次,丢失的话就只能重新创建了。

运用 Gridea

接下来就是穷极大杀器登场的时候了!,Gridea 可以直接让你使用预制好的网页模版(免去了自己写代码的步骤,当然你想自己创建模版也是可以的)。

下载Gridea:
百度云 密码:u4fn
Github
(由于 GitHub 下载速度可能过慢,这里提供 Gridea 0.9.2 版本的百度云下载,后续更新版本请移步 GitHub 下载)

一波安装操作以后,我们进入 Gridea 界面

从侧边栏进入“远程”界面


按图示配置,域名和仓库名就是 用户名.github.io,邮箱填你注册 GitHub 时的邮箱,令牌就是刚刚创建的那串代码,填写完成后先点保存,然后点左下角的检测远程连接。


检测成功后,就可以开始根据模版修改出你自己的网站了,一共有四个内置主题(模版),还有更多模版可以下载。点击预览可以看到网页最后的效果,待修改完成后,点击同步,就可以将个人网站的代码上传刚刚创建好的 GitHub 的仓库中了。


同步完成后,如果你回到 GitHub 上再看,就会发现自己的仓库中多了一堆东西了。

进入网页

在浏览器地址栏打入 https://用户名.github.io/ 即可访问你自己的网站了,怎么样,是不是很酷炫,接下来你就可以向你的朋友装逼了(bushi)
本教程提及的仅仅是教你如何搭建出一个简易的个人网站,Gridea 有很多方便的功能,可以让你轻松添加评论系统、添加统计系统、实现代码高亮……精力有限,这些功能不能一一讲解,也希望各位有志青年们能自己多多探索,多搞骚操作,实现更多高级功能。