きり丸の技術日記

技術検証したり、資格等をここに残していきます。

【技術】GitpodでLeetCodeを解く

※ 特別な新規性はない記事です。


表題の通り、GitpodでLeetCodeを解くだけの記事です。
GitpodはVSCodeライクなEclipse Theiaなので、VSCodeでできるのであれば、理論上は同じようにできるはず。

基本的には環境構築に苦労することもなかったので、VSCodeでの環境構築のページを見ても十分です。
GitHubのCodeSpacesでも同じようにできるはずなので、当選したらサクっと構築してみます。

環境

  • Gitpod

環境構築の前提

  1. Gitpodを使える状態にすること
  2. LeetCodeに登録していること
  3. LeetCodeにGitHub、またはLinkedinのThrid-Partyを登録しておくこと
  4. WebのLeetCode上で問題が解ける状態であること
    • メールアドレスで認証していればいけるはず

環境構築

  1. LeetCodeの拡張機能をブラウザからダウンロードする

Gitpodから直接LeetCode拡張機能はダウンロードできないので、1回ローカルをダウンロードする必要があります。

f:id:nainaistar:20200815164222p:plain
拡張機能のダウンロード

https://marketplace.visualstudio.com/items?itemName=LeetCode.vscode-leetcode&ssr=false#overview

  1. LeetCodeの拡張機能をGitpodに読み込ませる

下記のどちらかにドラッグ&ドロップします。
LeetCodeに関しては、「THIS PROJECT」でいいです。

なお、読み込ませた後すぐは読み込まないので、リロードしましょう。

  • 「INSTALLED FOR THIS PROJECT」
  • 「INSTALLED FOR {GitHub名}」

f:id:nainaistar:20200815164254p:plain
拡張機能DnD

  1. GitHubでログインする

LeetCode拡張機能の制約で、メールアドレスでログインするのは中国語のページしか対応されてないようです。
なので、GithubかLinkedinでログインしてください。

f:id:nainaistar:20200815164335p:plain
LeetCodeにログイン

ログイン後、難易度やカテゴリごとの画面が表示されます。

f:id:nainaistar:20200815164405p:plain
ログイン後

  1. 好きな問題を解く

好きな問題を選択すると問題文が出力されます。
「Code Now」をクリックすると、問題を解くためのファイルが出力されます。

f:id:nainaistar:20200815164431p:plainf:id:nainaistar:20200815164439p:plain
コーディングする

あとは、頑張る。

その他

コードをGitHubに残したい

LeetCodeの拡張機能だと、想定と異なる箇所にファイルが設定されます。
なので、拡張機能のデフォルトディレクトリを修正してあげる必要があります。

  1. File -> Settings -> Open Preferencesから設定を開く。

  2. leetcodeの設定にて、Workspace Folderを指定する。

※ デフォルトだと、以下の設定です。

/home/.leetcode
/workspace/{リポジトリ名}であれば以降は好み。

私は、LeetCodeというリポジトリ名にしているので、以下にしています。

/workspace/LeetCode/.leetcode

LeetCodeで解きたいデフォルト言語を変更したい

  1. File -> Settings -> Open Preferencesから設定を開く

  2. Default Languageで言語を選択する

その他の拡張機能を修正したい場合

LeetCode拡張機能のページに載ってるから、それを修正してください。

https://marketplace.visualstudio.com/items?itemName=LeetCode.vscode-leetcode&ssr=false#overview

終わりに

私は、Easyから詰まってしまったので、とりあえず今年中にEasyだけでも終わらせたいですね。
普段、アルゴリズムここまで意識してコーディングしないので、競プロは苦手です…。


もしこの記事が役に立ったのであれば、はてぶ、Twitterでの記事の拡散、twitterのフォローもよろしくお願いします。