エンジニア転職でポートフォリオをGitHubに公開する方法やメリット

最終更新日:2024年12月6日

「ポートフォリオをGitHubに上げるべき?」
「どのようにポートフォリオを公開すればいい?」

エンジニアへの転職を検討する際、このような疑問を持つ方が多く存在しています。結論からいうと、エンジニアは、ポートフォリオをGitHubに公開しておいたほうが良いです。GitHubを使うことで簡単にWebサイトを公開できます。

この記事では、ポートフォリオをGitHubに公開すべき理由、公開する方法、ポートフォリオ例を紹介します。ポートフォリオ作成の参考にしてみてください。

メガベンチャーに内定したエンジニアの自己PR・職務経歴書で書類の完成度をさらに上げる!

※1 弊社にて一部加工処理を施しています

この記事のまとめ

  • エンジニアはポートフォリオをGitHubに公開すべき
  • GitHubで公開すべき理由は「サーバーの準備が不要」「ポートフォリオとソースコードを一緒に提出できる」「GitHubを扱うスキルも評価される」の3つ
  • ほかの人のポートフォリオを参考にすることで、自分とは違う視点やアイデアをインプットできる

エンジニアの求人を紹介してもらう

エンジニアがポートフォリオをGitHubに公開すべき理由

エンジニアは、ポートフォリオをGitHubに公開することがおすすめです。

GitHubとは、ソフトウェア開発によく使われるツールです。GitHub Pagesという機能でWebサイトを簡単に作成・公開できます。

エンジニアがポートフォリオをGitHubに公開すべき理由は、以下の3つです。

  • ・サーバーの準備が不要

    ・転職活動の際、ポートフォリオとソースコードを合わせて提出できる

    ・GitHubを扱うスキルも評価対象になる

GitHubを使えば、ポートフォリオサイトをサーバー不要で作成できます。ポートフォリオサイトを公開するには、サーバーの構築が必要です。しかし、GitHubが提供しているGitHub Pagesを利用すればその必要がありません。

また、転職の際にポートフォリオとソースコードを合わせて提出できるのもメリットです。GitHubは、サイトだけでなくソースコードも公開できます。合わせて提出することで、サイトの動作とソースコードを同時に確認できるため、企業が求める水準のコードを書ける人材か評価してもらえます。

企業によっては、GitHubの使用経験が必要です。そのため、GitHubを使ってポートフォリオサイトを作成し、使い方に慣れておくと良いです。

エンジニアの転職についてより詳しく知りたい方は「ITエンジニアになるには?必要なスキルや未経験者の転職方法を解説」をご覧ください。

エンジニアの求人を紹介してもらう

エンジニアのポートフォリオをGitHubで公開する方法

エンジニアのポートフォリオをGitHubで公開する方法を紹介します。手順としては以下の4つです。


  • 1.GitHubアカウントを作成する

    2.リポジトリを作成する

    3.ファイルをアップロードする

    4.サイトを公開する


ここからは各工程について詳しく説明していきます。ポートフォリオをGitHubで公開したいと考えている方は参考にしてみてください。

1. GitHubアカウントを作成する

GitHubを使ったことがない方は、まずアカウント登録をする必要があります。すでにGitHubアカウントを持っている方は、次の章「2.リポジトリを作成する」へ進んでください。アカウント作成の手順は以下のとおりです。

  • GitHubのトップページを開く

    ・サインアップをクリックする

    ・指示に従って、必要な情報を入力する

GitHubのアカウント登録にはメールアドレスが必要です。

2. リポジトリを作成する

アカウントを登録したら、リポジトリを作成します。リポジトリとは、ファイルや画像などをGitHub上で管理するためのフォルダのようなものです。リポジトリがなくては、GitHub上でサイトが作成できません。

リポジトリの作成手順は以下のとおりです。

  • ・画面右上の+マークをクリックする

    ・「New repository(新しいリポジトリ)」を選択する

    ・「Repository name(リポジトリ名)」の欄にリポジトリ名を入力する

    ・リポジトリの可視性(PublicもしくはPrivate)を選択する

    ・「Initialize this repository with a README(このレポジトリをREADMEで初期化)」を選択する

    ・「Create repository(リポジトリの作成)」をクリックする

リポジトリ名は基本的に自由ですが、公開するページのURLに反映されるため注意が必要です。具体的には、以下のようになります。

リポジトリ名を「アカウント名.github.io」にした場合

https://アカウント名.github.io

リポジトリ名を上記以外にした場合

ttps://アカウント名.github.io/リポジトリ名

特に理由がなければ、「アカウント名.githu.io」で作成するのがおすすめです。また、リポジトリ名はあとからでも変更可能です。

3. ファイルをアップロードする

作成したリポジトリにファイルをアップロードしましょう。まず最初に「index.html」というHTMLファイルを作る必要があります。HTMLファイルの作り方は以下のとおりです。

  • ・「Add file」から「Create new file」を選択する

    ・入力欄にファイル名「index.html」と入力する

    ・「Edit new file」に自分で書いたHTMLのコードをすべてコピー&ペーストする

続いて、CSSファイルも作成します。上記のHTMLファイルと同様の手順で作成できます。CSSのファイル名については、HTMLのコード内で記載しているファイル名に揃えましょう。

画像を取り入れる場合は画像ファイルのアップロードが必要です。画像ファイルのアップロード方法は以下の手順で行います。

  • ・「Add file」から「Upload files」を選択する

    ・表示されたページで、使用したい画像ファイルをアップロードする

    ・「Commit changes」をクリックする

4. サイトを公開する

アップロードしたファイルを使用して、サイトを公開しましょう。サイトを公開する手順は3つです。

  • ・画面右上の「Settings(設定)」タブを選択する

    ・サイドバーの「Code and automation(コードと自動化)」から「Pages」を選択

    ・「Branch」の項目を「main」に変更し、「Save」ボタンをクリック

「Your site is live at (サイトURL)」と表示される場合は、サイトが公開されています。「Visit site」をクリックし、公開したサイトを確認してみましょう。

エンジニアの求人を紹介してもらう

エンジニア転職におけるポートフォリオ例

実際にGitHubで作成されたポートフォリオ例やエンジニアの参考になるポートフォリオ例を紹介します。

取得資格等

GitHubで作成されたポートフォリオ例 Takane Komachi(Takaneko)
​・kurram
エンジニアの参考になるポートフォリオ例 HodaLab! ​
MAKOTO HIRANO PORTFOLIO

ほかの人のポートフォリオを見ることで、自分とは違う視点やアイデアをインプットできます。スキル・成果物の提示の仕方や項目の順番、ボタンの配置など、自分とは違う発想に触れ、良いと思ったものを取り入れていきましょう。さまざまなポートフォリオに触れると、引き出しが増え、自分の中で新たな選択肢が広がります。

GitHubで作成されたポートフォリオ例

GitHubを使ってポートフォリオを作りたい方は、どのようなポートフォリオが作れるのか気になるでしょう。GitHubで作成されたポートフォリオ例として、2つ紹介するので参考にしてみてください。


GitHubを活用すると、ポートフォリオとして基本的な機能を備えたサイトを簡単に作ることが可能です。具体的には、自己紹介、スキル、制作物、お問い合わせフォームなどが掲載できます。

エンジニアの参考になるポートフォリオ例

エンジニアとして、ポートフォリオを作成する際、参考になるポートフォリオ例を紹介します。ここで紹介するのは以下の2つです。


HodaLab!は全体的にシンプルで見やすいサイトです。特にスキルの項目が分かりやすく、フロントエンド、バックエンド、DevOpsと分野別にレーダーチャートでまとめられています。視覚的に得意分野が伝わります。

MAKOTO HIRANO PORTFOLIOは、成果物について詳細にまとめられているのがポイントです。概要や目的、こだわったポイントが図面とともに解説されており、スキルと問題解決力を同時にアピールできます。

エンジニアの求人を紹介してもらう

まとめ

この記事では、エンジニアがGitHubにポートフォリオを公開すべき理由と公開する方法、参考になるポートフォリオ例を紹介しました。

エンジニア転職では、GitHubにポートフォリオを公開することがおすすめです。GitHubを使えば、サーバーの準備をする必要がありません。また、ポートフォリオとソースコードを合わせて提出できるメリットもあります。さらに、GitHubを扱うスキルが求められる場合もあるため、扱っておいて損はないでしょう。

エンジニアとして転職を検討している方は、この記事を参考にポートフォリオを作成してみてください。

※本記事は2024年11月時点の情報を基に執筆しています

ITエンジニアの転職ならレバテックキャリア

レバテックキャリアはIT・Web業界のエンジニア職を専門とする転職エージェントです。最新の技術情報や業界動向に精通したキャリアアドバイザーが、年収・技術志向・今後のキャリアパス・ワークライフバランスなど、一人ひとりの希望に寄り添いながら転職活動をサポートします。一般公開されていない大手企業や優良企業の非公開求人も多数保有していますので、まずは一度カウンセリングでお話してみませんか?(オンラインでも可能です)

転職支援サービスに申し込む

また、「初めての転職で、何から始めていいかわからない」「まだ転職するかどうか迷っている」など、転職活動に何らかの不安を抱えている方には、無料の個別相談会も実施しています。キャリアアドバイザーが一対一で、これからのあなたのキャリアを一緒に考えます。お気軽にご相談ください。

「個別相談会」に申し込む

レバテックキャリアのサービスについて

この記事の監修

レバテックキャリア編集部

レバテックキャリアは、IT/Web業界のエンジニア・クリエイター向けに特化した転職エージェントです。当メディアでは、エンジニア・クリエイターの転職に役立つノウハウから、日々のスキルアップや業務に活かせる情報まで、幅広いコンテンツを発信しています。

プロのアドバイザーがあなたのお悩みや疑問にお答えします

- 転職個別相談会開催中 -

相談内容を選択してください

※転職活動や求人への応募を強制することはありません

関連する記事

人気の求人特集

内定率が高い

ITエンジニア未経験~3年目の方限定

  • ITエンジニア適職診断
  • 5年後の予想年収

簡単3分無料で診断してみる

×

今もらっている年収は高い?低い?

簡単60秒 エンジニア・クリエイター専門 年収診断 無料診断START ×