何してきたかのメモ🍣🍣

エンジニアです、最近はPHPやってます。 ジャンル不問の備忘録です。 気になったことをメモ的に書いてます。

【Ruby】【VSCode】VSCodeを使ってのRuby開発環境の構築【完全初心者向け】【手順のみ】

どうもこんにちは、n清(@n_nkiyo)です。

 

今回はVSCodeを利用したRubyの開発環境の構築をしたため備忘録的に残しとこうと思って書いてます。

そのため足りない部分等々あるかと思いますが生暖かい目で見ていただければ幸いです。

 

下記は目次です。

 

  1. 使用環境
  2.  VSCodeのダウンロード
  3. Rubyのダウンロード
  4. 各種拡張機能のインストール
  5. 動作確認

 

1 使用環境

 

今現在、というか今回僕が環境構築を行った環境ですが

・MacBookAir

macOS High Sierra

Ruby 2.5.1

VSCode 1.25.1

という感じになってます。

 

2 VSCodeのダウンロード

 

さて、では早速VSCodeの方をダウンロードしていこうと思います。

 

下記のリンクから最新版をダウンロードして、インストールまでやっちゃってください。

ここで心配になるのが海外のエディタを使用する際に常につきまとう言語の壁ですが、VSCodeさんは優秀なので、全自動で日本語にしてくれているはずです!(すごい)

 

code.visualstudio.com

ダウンロードが終われば、いよいよRubyへ手を伸ばしていきましょう!

 

3 Rubyのダウンロード

 

Rubyのダウンロードに関してですが

開発をしていく予定のPCのOSがMacであれば最初からダウンロードされているため基本的には問題ありませんが。(最新版への更新が必要な場合もあります)

 

Windowsの場合Rubyそのもののダウンロードが必要になってきますので、下記のリンクからサクッとやっちゃいましょう。

 

オブジェクト指向スクリプト言語 Ruby 基本的には最新版で問題ありません

 

インストールが終わったら、次に先ほどダウンロードしたVSCodeの方にRubyを対応させていきます。

 

VSCodeはそれ単体に様々な機能があるわけでなく、多種多様な拡張機能を導入していくことでその機能を充実させていくのが主な使い方となっています。(少なくとも僕はそう思ってます(・_・;))

 

ということで必要な拡張機能をダウンロードするためにVSCodeを開いて左側にあるメニューの一番下「拡張機能」から「検索」に、「Ruby」と入力しましょう。

 

そしたらおそらく一番上に「Provides Ruby language and debugging support for Visual Studio Code」があると思うので、それをダウンロードします。

 

これでVSCodeRubyを書いていく準備が整いました!はい簡単!!

 

Ruby,RubyOnRails,VisualStudio,2018,Code,拡張機能,環境構築,環境,構築,拡張,機能,プログラミング,言語,ルビー,初心者,ビジュアルスタジオ,スタジオ,ビジュアル,開発,Web

ここをクリックして

 

Ruby,RubyOnRails,VisualStudio,2018,Code,拡張機能,環境構築,環境,構築,拡張,機能,プログラミング,言語,ルビー,初心者,ビジュアルスタジオ,スタジオ,ビジュアル,開発,Web

半角で入力しましょう!

Ruby,RubyOnRails,VisualStudio,2018,Code,拡張機能,環境構築,環境,構築,拡張,機能,プログラミング,言語,ルビー,初心者,ビジュアルスタジオ,スタジオ,ビジュアル,開発,Web

↑これを「インストール」

 

おつかれさまでした!!!

 

4 各種拡張機能のダウンロード

 

先程までの手順で、Ruby自体のダウンロードとVSCodeの準備は整いました、しかしせっかく使うなら便利に使いたいものです・・・ね?

 

ということで先程と同じように、「拡張機能」の方からいろいろインストールしていきます。

 

今回インストールした一覧 (クリックするとダウンロードページに飛びます)

 

・Code Runner

 書いたコードを実行するために必要、ほぼ必須だと思います。

 

ちなみにこの拡張機能Ruby以外にもC, C++, Java, JS, PHP, Python, Perl, Ruby, Go, Lua, Groovy, PowerShell, CMD, BASH, F#, C#, VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml, R, AppleScript, Elixir, VB.NET, Clojure, Haxe, Objective-C, Rust, Racket, AutoHotkey, AutoIt, Kotlin, Dart, Pascal, Haskell, Nim, D

といった言語を実行することができます。

 

いや正直これ作った人天才でしょ・・・

 

使い方は、実行したいコードを選択した後「F1」→「Run Code」と入力してEnterで実行されます。

Ruby,RubyOnRails,VisualStudio,2018,Code,拡張機能,環境構築,環境,構築,拡張,機能,プログラミング,言語,ルビー,初心者,ビジュアルスタジオ,スタジオ,ビジュアル,開発,Web,解説,説明,最初,初心者,入門,簡単,分かりやすい

選択して

 

Ruby,RubyOnRails,VisualStudio,2018,Code,拡張機能,環境構築,環境,構築,拡張,機能,プログラミング,言語,ルビー,初心者,ビジュアルスタジオ,スタジオ,ビジュアル,開発,Web,解説,説明,最初,初心者,入門,簡単,分かりやすい

「Run Code」と入力してEnter

Ruby,RubyOnRails,VisualStudio,2018,Code,拡張機能,環境構築,環境,構築,拡張,機能,プログラミング,言語,ルビー,初心者,ビジュアルスタジオ,スタジオ,ビジュアル,開発,Web,解説,説明,最初,初心者,入門,簡単,分かりやすい

実行された!!!

 

 

・file-icons

 ファイルの見た目をどこかで見たことがある感じにしてくれます。

確かにわかりやすいけど、VSCodeのデザインが『THE・シンプルッッ』って感じなので若干合わない感じもする、、かな?

まあ人によると思います。

 

・Guides

 これも必須級です!!あるとないとじゃだいぶ違います。

書いていったコードを見やすい用意自動で調整してくれます。

視覚的、感覚的にわかりやすくなるため、オススメです!

 

・Japanese Language Pack for Visual Studio Code

 VSCodeは特に設定なしで日本語を使用することができますが、その日本語機能をさ

らに強化してくれるのがこちらです。

・・・特に説明なしです・・

 

・Japanese Word Handler

 日本語を入力した場合のカーソルのずれを正しく修正してくれる拡張機能です。

とりあえず入れていて損はないです。

 

以上が拡張機能の紹介になります。といってもここに載せているのはほんの一部で、

ほんとに最低限?なものになってますので、より便利に!より使いやすく!!って方はたくさん存在する拡張機能、色々試して見てはいかがでしょう?

 

(いいのあったら教えてください、、)

 

ここまでで、VSCodeにおけるRuby開発環境の構築は完了になります。

それではみなさん

いいRubyLifeを!!💎(←これどう見てもダイヤモンドじゃ((