Webishブログ

未経験から海外でweb開発を目標に、必死に勉強している人のブログ

PortfolioをGithubで作った。

スポンサードリンク

ポートフォリオを作れば、いろんな人に紹介する時とても便利と言う事もあり

自分のポートフォリオを作ってみようと思っていた。

 

サーバー借りて、ドメイン買って・・・とか面倒臭いので、なんとか無料で手軽に作れるポートフォリオがないかと調べて見たら

 

なんと、Githubで作れるみたいではないか!

 

よく、ポートフォリオ作成サイトなどは見ていたのだが、無料のものが少なかったり、参加するのに敷居が高かったり、カスタマイズ性が弱かったりであんまり好きじゃなかった。

 

特に僕の場合は、HTML/CSS/JSで自分の好きなように作りたいと思っていたので、そういうのができて、無料なのが前提だった。

これはありそうな条件だが、意外となかったのも不意打ちで、なかなか手が出せなかった。 

 

今回、Githubで作る事ができたという事で、普通にかなり困った面もあり、調べまくった挙句、ちょっとしたミスで作るのが難しくなっていたので、自分のメモのためにもブログに記述しておこうと思ったのが、今回の記事の理由。

 

なので、基本的に将来の自分に話しかける感じで書きます。

 

 

 

1.Github上で新しいレポジトリを作成する。

 

レポジトリ名は、

[user name].github.io

にする。

ここを別のにするとうまく表示してくれないそうだ。

 

2. ターミナルを開く

 

  $ git clone [ レポジトリのURL ] 

でクローンしてくる。

クローンする場所は、作業場所になるが

分かりやすいように「デスクトップ」にするといい。

ターミナル内で「自分の位置」を作られたクローンのフォルダの中に移動する。

 

3. index.html を作る

 

これはしなくてもいいけど、テストも兼ねてやっておく。

 

$ echo "Hello World" >> index.html

 

これで、クローン内にindex.htmlが作られる。

 

4. あとは、コミットしてプッシュするだけ

 

$ git add .

$ git commit -m 'Initial Commit'

$ git push origin master

 

これで、プッシュも無事行われ、ページに表示される。

 

5. ポートフォリオのURL

自分のポートフォリオにアクセスするには

URLに

 

http://[User Name].github.io

 

で、左上に "Hello World" と表示されれば成功。

 

あとは、その(2)のデスクトップに作ったフォルダ内のファイルをいじって、プッシュしまくればオーケー。

 

 

この手順を順番にやれば、まずはページが開かれる事は可能になる。

 

 

たまには、こういうの書かないと自分の蓄積にもならないかなぁと思ったのでまとめました。(僕くらいのエンジニアの助けになればいいかなぁ)

 

いやぁ、しかし・・・紹介してくれてる人がたくさんいてくれて助かりましたぁ〜・・・。(笑)