56
45

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

就活生がGitHub PagesとBootstrapで自己紹介サイト作ってみた

Last updated at Posted at 2019-06-27

#背景
就活(サマーインターン)の時期になりESを書くことが多くなってきました。めんどくさいなあと思っていた時に、GitHub Pagesを使ってwebサイトを簡単に作っている記事をいくつか発見(GitHub Pagesで静的サイトを簡単に作るとか)。
ESはどの会社もだいたい同じことを聞いてくるので、じゃあESで書きそうな内容全部まとめてwebサイトに書いちゃえばよくね?ということで自己紹介サイトを作ることにしました。

理想としては、ESにはリンクを貼るだけ!みたいにしたいのですが社会はそれを許してくれるのだろうか…。

#やりたいこと

  • 自己紹介サイトを作る目的
    • 自分のことを知ってもらう場として
    • ESに書きそうなことを保管する場として

だったので

  • 実装(したかった)内容
    • 自分語りをするパート
    • ESに書きそうなことをまとめておくパート(時間の都合で実装できず…)

です。

現時点での僕のwebサイトはこちら

#GitHub Pagesの作成
こちらのサイトを参考にさせていただきました。
GitHubのmasterブランチをWebページとして公開する手順(GitHub Pages)

とにかくレポジトリ作って、SettingsからGitHub Pagesを有効にするボタンを押せば公開できます。超簡単ですよね笑。

#Bootstrap
HTMLはともかくCSSはめちゃくちゃ初心者だった僕ですが、Bootstrapがなんとかしてくれました。これを使えばCSSあまり分からなくても、webサイトをそれなりに整えてくれます。めっちゃ綺麗なわけではないですが、webサイトを自分で作るのは今回が初めてなのでとりあえず良しとしました。
今回僕がやりたかったことは、

  • 写真の挿入
  • 表の作成
  • ボタン押したら同じページ内を移動するアレ
  • ヘッダーとフッダー

でした。このページのチュートリアル(英語ですが)を読めばほとんどすべて実装できました。

#終わりに
今回は途中までの実装となってしまったのですが、サーバーを立てたりすることなく自分で書いたコードをオープンできるのはすごく良いですよね。BootstrapもHTML/CSS初心者にとってはとてもありがたいツールだと思います。自己紹介サイトはもっとかっこよくしていきたいと思います。

他の記事を参照しまくりの初投稿ですが、これからもQiitaにも投稿していこうと思います。
最後まで読んでいただきありがとうございました!

56
45
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
56
45

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?