序
こんなことありませんか？
- 言語を覚えて頑張ってアプリ作った
- けどlocalhost:3000はダサい！(別にダサくない)
- →公開、したくね？
こうも思いませんか？
- アプリを公開するためにはサーバを立てればいい。なるほどね。
- で、なにすればいいの？Nginx？コンテナ？ふぇぇ。。。
- 😫。○(言語で精いっぱい…もう体力の限界)
ということで、簡単にアプリを公開しよう
注
- gh-pagesで公開できるのは静的なアプリだけです
- サーバとかDBとか色々使いたい人は自分でサーバを立ててみましょう(インフラないがしろにするといつかエンジニア人生詰む気がします。。。)。
- さくっと半自分用。スライドモードのテストも兼ねているため、割と説明粗めです
手順
- 手順1.gitHubアカウントの用意
- 手順2.アプリケーションの用意
- 手順3.リポジトリ作成
- 手順4.gitHub Pagesの設定
手順1.gitHubアカウントの用意
- まずはgitHubアカウントを用意しましょう
- 色々なエンジニアサイトのアカウントを登録するときに連携できてべんり。Qiitaアカウントはgitに紐づけていたような気がします。
- gitって何？や、細かい設定方法についてはこちらを見てください。
手順2.アプリケーションの用意
- 上げたいアプリを選びましょう
- 何でもいいので用意しましょう。「~.html」ファイル用意して
<div>test</div>だけでもOKです
手順3.リポジトリ作成
- 超簡単に言うと、アプリの単位みたいなものです。
- コマンドでやる人向け
手順4.gitHub Pagesの設定
- gitHubアカウントページ＞作ったリポジトリ＞「Setting」タブ＞左側メニューの「Pages」をクリック
- 「Branch」の欄が「None」になっていたら、masterとかmain(ブランチ名)に変更してSaveボタンを押しましょう
以上で操作は終了です。
- 数分待ってから公開されたアプリを見てみましょう
終
- reactアプリで作ってみたものの、割と使いやすげ。サクッとこんなん作りました～と見せられるのもポイント高い
- firebaseとかも似たようなことができたような。あんま調べてないけど次そっちやりますか
参考文献と追記
- ReactアプリをGitHub Pages(Project Pages)で公開する
- 超編集後記なんですが、この記事初心者向けでとても分かりやすい…(この記事いらなくね…)