概要
BootStrap5がリリースされて「使ってみたい」ということから調べていたら、GitHub Pagesを使うと、GitHubにコミットするとWebページが公開できる「ワザ」があるということで、急遽「GitHub Pagesにポートフォリオを公開する」ことを目標にBootStrap5を学ぶことにしました。
就活や転職でGitHubが有効とかいう時代になったんですねぇ・・・(遠い目)
GitHub Pagesってなんやねん
■ GitHub Pages
一般的に、GitHubにソースなどをコミットしてリポジトリとして使っている人がほとんどだと思いますが、GitHubのリポジトリでホームページが公開できるというものです。
実際に、今回作って公開しているのが下記となります。
方法
いろんな方がYouTubeや本Qiitaで説明してくれているので、ざっくりまとめると
- リポジトリを「(自分のGitHubアカウント名).github.io」という名前でPublicとして作成すると、自動的にGitHub Pagesとして公開される
下記は「たにぐち まことのともすたチャンネル」さんの該当動画です。(毎回わかりやすく説明してくれます)
- リポジトリを「AAAA(なんでもいい)」でPublicにて作成すると、GitHub Pagesの設定後に「(自分のGitHubアカウント名).github.io/AAAA」で公開される
下記は「大学生がエンジニアになるまで / コーディングテスト実況」さんの該当動画です。
私の場合は、前者を選択しました。
いざ実食!
BootStrap5の配布されているThemeを使うのは、BootStrapの勉強にならないだろうということで、1からカキカキしてます。
作成の方針としては、
-
文章量
- 「すでに20年の社会人経験がある」ITエンジニアなので、書き始めると長くなる・・・・のでシンプルな情報量にする
- いろいろできるけど、「なんとなく」分かってもらえればヨシとする(誰かにレビューしてもらうためのたたき台とする)
- 廃れたプログラミング言語とか、最後に使って年数た経ちすぎて忘れかけてるのは除外する
-
デザイン
- フロントエンドエンジニアではないし、デザイナーでもないので凝った作りはしない
- ソースを見たらだれでも「ハハーン、マネしたるわ」と思える作りにする
-
その他
- SEO対策は、ある程度は入れておく
- GA4なども実装しておく
- Googleフォントなども面白そうなので使っておく
あとは、もうBootStrap5のDocumentを見ながら作ります。
最初は、載せる文章を決めるほうが進行が楽ですね・・・
所感
BootStrap5の最初のとっかかりとしては、適度なコンテンツになりました。
次は、別のサイトを作るときに使ってみたいと思います。
それでは、もう一度完成したポートフォリオを。
感想や、私のデザインをパクりたい申告などは随時受け付けてます。(私はデザイナーじゃないんで・・・・・)