南宁网站建设哪家公司,甘肃做网站的网络公司,网站设计方案书ppt,展厅设计的要点有哪些目录 1 选择 Astro 模板2 使用代码3 修改代码4 上传 Github5 部署 Cloudflare Pages6 后续修改 最近我搭建完了我的个人网站#xff0c;很多人问是怎么做的#xff0c;今天就来写一篇教程吧。
全部干货#xff0c;看完绝对能成功搭建自己的网站#xff01;#xff08;还不… 目录 1 选择 Astro 模板2 使用代码3 修改代码4 上传 Github5 部署 Cloudflare Pages6 后续修改 最近我搭建完了我的个人网站很多人问是怎么做的今天就来写一篇教程吧。
全部干货看完绝对能成功搭建自己的网站还不会你打我 我的网站https://yaoqx.pages.dev 话不多说正片开始——
1 选择 Astro 模板
如果你只是想建一个博客那么你直接往下看就行想了解 Astro 的可以到这里看看https://docs.astro.build/zh-cn/concepts/why-astro/
首先在 https://astro.build/themes 这里挑选一个心仪的模板我选择的是 Frosti。 选择之后点开主题上面的按钮是 Github 仓库下面的是网站示例。
直接点 Get started 就好。 Frosti 仓库链接https://github.com/EveSunMaple/Frosti 2 使用代码
进入 Github 仓库后点击右上角的 Code Download Zip或者右侧的 Releases 用最新版本下载。
如果你熟悉 Git可以直接使用 git clone 最终都会下载下来一个压缩包解压到任意位置。
接着在解压后的代码文件夹里打开 cmd 输入以下指令
npm install如果你没安装 nodejs可以去官网下载https://nodejs.cn/ 等它安装完毕没有报错那就接着执行
npm run dev这条指令可以让你在本地测试接着你就可以在 http://localhost:4321 上访问啦。
3 修改代码
使用 vscode 打开代码文件夹直接修改就行~
以下是一般需要修改的文件以 Frosti 为例
src/const.ts 常量、配置文件src/content/ 博客所在的文件夹src/pages/ 页面所在的文件夹如 Home, About 等等public/profile.webp 头像图片
4 上传 Github
打开 Github 没账号的先注册
https://github.com
新建一个空仓库。
接着把你的代码文件上传上去如图我选中的文件 稍等片刻点击下方按钮 commit changes 即可。
5 部署 Cloudflare Pages
打开 Cloudflare一样没有账号先注册
https://dash.cloudflare.com/
先点击左下角Workers Pages然后点击 Create。 选择 Pages点击 Connect to git 选择自己刚刚建的的 Github 仓库 接着按照下图
点击 Save and Deploy 后如果出现下图的情况那么恭喜你成功辣 你的站点已经可以访问了 6 后续修改
修改内容后直接上传 Github 即可Cloudflare 会自动配置十分方便 如果你成功了别忘点赞收藏
本文就到这里拜~