Retodo - 用 React 写一个自己的 Todoist(上)
前言
点这里 → Hower’s Todoist⚡
拥有自己的Todoist真的是太coooooool了(虽然没有什么用hh)
这篇文章主要讲一下整个的流程吧,算是对这个项目的一个总结,也能给初学者提供一些思路吧(如果有人能看到的话)
如何创建一个 React 项目
使用官方脚手架creact-react-app
在一个文件夹内,右键选择在终端中打开
首先通过npm全局安装 create-react-app
1 |
|
然后使用 create-react-app 命令来创建项目
1 |
|
就ok啦!
如何将 React 项目上传到 Github
-
进入 Github,点击 Repositories,点击New,起个Repository name,建立一个新仓库
-
进入仓库,点击 Code 里面的 SSH ,复制链接
-
到刚刚生成的 React 项目旁边,右键选择在终端中打开,输入
1 |
|
-
把 React 项目文件拖入本地仓库
-
进入本地仓库,右键选择在终端中打开,输入
1 |
|
也可以不敲这些代码,用VScode十分的方便哦
如何将 React 项目部署到自己的 Github Page 上
我也是查了很多资料才成功上传啊
- 安装gh-pages(github page一般用master和gh-pages分支部署)
1 |
|
- 修改 package.json
- 加上 “homepage”: “https://howerrr.github.io/todoist” 就是你的github page加上仓库名
- 在"scripts"里加上两条
“predeploy”: “npm run build”,
“deploy”: “gh-pages -d build -r https://github.com/howerrr/todoist.git -b gh-pages”
- 推送到 github
1 |
|
之后如果进行内容更新,通过 npm run deploy 更新到网页上
总结
主要是巩固下一些 git 指令吧,争取以后初始化项目就可以摆脱查资料,自己就可以流畅地敲出来hh
下一篇博客就更新完整的 Todoist 项目吧
Retodo - 用 React 写一个自己的 Todoist(上)
http://howerrr.github.io/2022/05/29/Retodo-用React写一个自己的Todoist(上)/