Reactの初期ページをGitHub Pagesで公開(デプロイ)する方法
という記事がありました。
一方、別のところに
TypeScript 入門 Reactでいいねボタンを作ろう
と言う記事があって、
これらを組み合わせれば
いいねボタンが簡単に公開できるね!!!! と思いついてやってみたら出来ました。
いいねボタン https://kalz2q.github.io/react-likebutton/
ハートマークをクリックすると数字がカウントアップします。
- 具体的にはまずローカルで作って
- npx create-react-app リポジトリ名 --template typescript
- npm start で動くことを確認する
- 次に github にリポジトリを作り紐づける
- ローカルに戻って
- npm install gh-pages --save-dev
- package.jsonを編集し"homepage"と"scripts"配下の"deploy"を追加
- "homepage": "https://githubのアカウント名.github.io/リポジトリ名/",
- package.json の scripts に次の行を追加する。
"scripts": {
"deploy": "npm run build && gh-pages -d build",
},
- npm run deploy
- 後始末: ローカルの内容を github で見れるようにするため
- git add . git commit git push して保存する
