LoginSignup
1
1

More than 1 year has passed since last update.

初心者エンジニアによる備忘録 環境構築編

Posted at

 今日は環境構築について書いていこうと思います。環境構築とは、コーディングを行う際に必要な環境を整えることです。
 いろいろな方法があるかと思いますが、私はVSCodeを使用しています。VSCodeはマイクロソフトが開発した大変便利なテキストエディタです。このテキストエディタに必要な情報を書いていきます。
https://code.visualstudio.com/
 このページからダウンロードできます。私はMacを使用していますが、Windowsでも問題なく使用できると思います。
 ダウンロードが終わったら、VSCodeを使用するにあたって便利なツールをとりこんでいきます。この便利なツールのことを拡張機能といいます。
 拡張機能はVSCode上で取得することができます。私が取得したものは、
・Japanese Language Pack For Visual Studio Code
 日本語表記にしてくれます。
・HTML Snippets
 HTMLタグ、CSSの入力を補完してくれます(めっちゃ便利)。
・Ruby
 Rubyの構文をチェックして間違ったところがあれば修正してくれます。
 今のところ私はRubyの学習中なので必須です。他の方はご自身の学習されている言語でどうぞ。
・zenkaku
 全角スペースを知らせてくれます。意外と全角でコードミスになることが多いので、これもあると便利です。
・Code Spell Checker
 コード全般のスペルチェックをしてくれます。
 また、VSCodeの設定ですが、
VSCodeのサイドバーから歯車のマーク→設定のところにいき、オートセーブの設定で「onFocusChange」にしておくことをおすすめします。文字通りオートセーブです。

 次にターミナルの設定です。
 ターミナルとは、PCに命令をすることができるアプリケーションです。Macではデフォルトでついています。
 Windowsでもある・・・と思う。このターミナルに様々なコマンドを入力することでPCを動かすわけですね!
 さて、ここでこんなことを思った人もいるはず。「え?PCの操作ならすぐできるじゃん。マウスでポチッとな」ってね。
 ぼくもそう思っていました。でも、違うんです!
 僕たちが普段何気なく操作している画面は、GUI(グラフィカルユーザーインターフェース)といって直感的に操作できる上に使い慣れていますよね。でも、直感的に操作できるだけに、コンピュータの製作者としては間違って消してしまうと大変なデータや、あまりにもデータの量を可視化してしまうと逆に見にくくなってしまうということから、表示するデータを制限しているんです!そこでPCのもっている力をフル活用しちゃうぞって出てくるのがCLIです。
 CLI(コマンドラインインターフェース)では一見とっつきにくい印象を受けるのですが、慣れてしまえばコマンド一つでほとんどの操作ができるので、コンピュータを扱う上では大変重宝します。
 で、ターミナルの話に戻るのですが、ターミナルの設定はPCごとに違うので、さらっといかせてもらいます。ぼくはMacで環境構築したので、Windowsでは勝手が違うかもしれません。適宜ググってください。

1 Command Line Tools (アプリケーション開発に必要なソフトウェアをダウンロードするのに必要)をインストール
2 Homebrew (ソフトウェア管理ツールの導入)をインストール
3 Rubyのインストール(ここは言語に合わせてください)
4 MySQLの導入(データを管理するツール)
5 Railsのインストール(これはRuby関係のツールなのでRuby以外を扱う人はなしで大丈夫です)
6 Node.jsをインストール(これもRuby関連)
7 yarnをインストール(プログラム同士の関係性を管理するツール)
それぞれバージョンの更新やターミナル上ですぐ開けるようにする設定がありますが、お使いのPCに合わせてググりましょう。
 こんな感じですかね。
 書いてて思ったのですが、かなりフワッとした内容で、その割には長々と書いてしまいました・・・
 次回からいよいよHTMLとCSSに入っていきます。では、今日はこのへんで!

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1