VSコードで作ったサイトをポートフォリオに載せる方法|URLの作成手順とポイント

ホームページ作成

VSコード(Visual Studio Code)でサイトを作成した後、そのサイトをポートフォリオとして公開するためには、適切なURLを作成する必要があります。今回は、VSコードで作成したサイトをインターネット上に公開し、ポートフォリオに載せるための具体的な方法を解説します。

VSコードで作成したサイトを公開するための準備

まず、VSコードで作成したウェブサイトのファイルが整ったことを確認しましょう。サイトが正しく動作するかどうかを確認するために、ローカル環境でテストすることが重要です。ローカルサーバーで確認できたら、次にそのファイルをインターネット上に公開する手順に進みます。

VSコードには「Live Server」という拡張機能があり、これを使うことでローカルでのテストが簡単に行えます。ローカルサーバーで動作を確認した後、次は公開先を決める必要があります。

サイト公開先を選ぶ

VSコードで作成したサイトをポートフォリオとして公開するためには、Webホスティングサービスを選ぶ必要があります。無料で使えるホスティングサービスには、GitHub PagesやNetlify、Vercelなどがあります。これらのサービスを使えば、簡単にウェブサイトをインターネット上に公開することができます。

例えば、GitHub Pagesを使う場合、GitHubアカウントを作成し、リポジトリを作成して、その中にサイトのファイルをアップロードします。アップロード後、GitHubの設定で「GitHub Pages」を有効にすると、指定したURLでサイトを公開できます。

GitHub Pagesでサイトを公開する方法

GitHub Pagesを使用してサイトを公開する手順は次の通りです。

  1. GitHubにアカウントを作成し、リポジトリを作成します。
  2. VSコードで作成したウェブサイトのファイルをリポジトリにプッシュします。
  3. GitHubのリポジトリ設定ページにアクセスし、「GitHub Pages」を有効にします。
  4. 公開されたURLが表示されるので、そのURLをポートフォリオに追加することができます。

これで、VSコードで作成したサイトを簡単に公開することができます。

NetlifyやVercelを使ってサイトを公開する方法

GitHub Pages以外にも、NetlifyやVercelを使ってウェブサイトを公開する方法があります。どちらも簡単にサイトをデプロイでき、無料プランでも十分に利用することができます。

NetlifyやVercelでは、GitHubリポジトリを連携させるだけで、自動的にデプロイが行われ、公開用のURLが提供されます。これにより、手動でのアップロード作業が不要になり、スムーズにサイトを公開できます。

ポートフォリオにURLを追加する

サイトが公開された後、ポートフォリオにそのURLを追加することで、実際のプロジェクトとして紹介することができます。ポートフォリオは、プロジェクトのURLを掲載するための重要な場所です。GitHubやLinkedInなどのプロフィールにリンクを追加したり、個人のウェブサイトに埋め込んだりして、他の人が簡単にアクセスできるようにしましょう。

まとめ

VSコードで作成したサイトをポートフォリオに載せるためのURLを作成するには、まずローカル環境でサイトをテストし、その後、GitHub PagesやNetlify、Vercelなどの無料のホスティングサービスを使用してサイトをインターネット上に公開することができます。公開後は、そのURLをポートフォリオに追加することで、他の人があなたの作品を簡単に見ることができるようになります。

コメント

タイトルとURLをコピーしました