【ハッカソン参加者向け】VSCodeの拡張機能 Live Share が良さそうだった #VSCode

はじめに

こんにちは、RareTECHでメンターをしている ibaryobaryo です!
普段は福岡で開発業務をしながら、プログラミングスクールのメンターとしても活動しています。

今回は、RareTECHで実施しているハッカソンにおいて、学習者同士でのチーム開発時におすすめの VSCode 拡張機能を思い出したので、紹介したいと思います。

Live Share とは

CleanShot 2025-02-28 at 20.03.09.png

Live Shareとは、Microsoft 社が提供する Visual Studio Code 用の拡張機能で、リアルタイムでの共同開発を可能にするコラボレーションツールです。
コードの共有や同時編集が可能で、リモートでもペアプロやレビューがスムーズに行えます。

使ってみよう!

今回の環境

  • M1 Mac
  • Visual Studio Code バージョン: 1.97.2

拡張機能をインストール

まずは VSCode のマーケットプレイスで「Live Share」と検索し、一番上に表示されるものをインストールします。

CleanShot 2025-02-28 at 20.23.30.png

インストール後は、サイドバーに専用のアイコンが表示されます。

CleanShot 2025-02-28 at 20.25.24.png

VSCodeにサインインする

Live Share を利用するには、事前にサインインが必要です。

CleanShot 2025-02-28 at 20.28.18.png

GitHub または Microsoft アカウントでサインインが可能ですが、今回は GitHub を選びました。
クリックするとブラウザが開き、サインイン後に準備が完了します。

セッションを開始してみよう

「Share(Read-Only)」をクリックすると、セッションが開始され、以下のような画面が表示されます。

CleanShot 2025-04-12 at 19.56.27@2x.png

「Invite participants…」をクリックすると、招待リンクが自動でコピーされます。
これを共同開発者に送信することで、同じセッションに参加してもらえます。

CleanShot 2025-04-14 at 22.00.20.gif

これでペアプロの環境が整いました!

活用シーン

メンターに技術相談をしたいとき、このリンクを共有することで、具体的なコードをすぐに見せながら相談できます。
今回は「Read-Only」で共有しましたが、「Read/Write」で共有すれば、相談しながらそのまま一緒にコード修正も可能です。

まとめ

今回は VSCode の拡張機能【Live Share】を紹介しました。
実務で使う機会は少ないかもしれませんが、ハッカソンや学習の場面では非常に便利なツールです。
特にチーム開発に参加予定の方は、事前にインストールしておくと安心です!



フラッグシティパートナーズ海外不動産投資セミナー 【DMM FX】入金

Source link