開発環境をそろえよう

開発環境は人それぞれ

 実際に何かを開発するとなると、その開発のための環境を整えることも非常に重要な要素の一つとなってきます。しかし、これは様々な言語や、様々なプラットフォームがあることから、基本的に人それぞれで、固まっているスタイルというものはあまりありません。もしも、自分の環境で、作りたいものや使う言語などが定まっているのであれば、それをキーワードとして検索してみるというのも一つの手ではありますが、まずは、汎用的な環境を導入しておくというのがもっともいい方法なのではないでしょうか?

 そんな比較的汎用的に導入することの多い開発環境について、このページでは詳しく紹介していきます。

エディタソフトを入れてみよう

 実際に何かプログラムを書くとなると、エディタソフトが必要になります。これは勿論Windowsにデフォルトで入っているメモ帳でも行うこと自体は可能ですが、しかし、決して効率がいいものではありませんし、視認性などの面から言っても、あまりオススメ出来ません。ですので、まずは、テキストエディタソフトを新しく導入して作業効率をあげるところから始めましょう。今回はそんな中からなるべくフリーの物を紹介していきます。

SublimeText3

 恋に落ちるエディタの異名を持つ凄まじく使いやすいテキストエディタです。勿論筆者も使い始めて数日ですが既にメロメロです。特に愛着が湧くのが、様々なプラグインをコマンド入力でインストールすることが出来ることで、これによって自分に必要なプラグインやスキンなどを導入し、自分色に染めあげられるという事が特に素晴らしいです。どのプラグインを導入すべきか、どのスキンがオシャレなのかといった情報を書き始めると本当にキリが無くなりますので、今回は省きますが、それでも特に絶対に導入しておきたいものを上げるとしたらやはり、Emmetと呼ばれるプラグインだと思います。これに関しては後述しますが、本当にコーディングが楽になります。元々はZencodingと呼ばれていたものの後続版となるものなのですが、是非こちらも最初から導入してみて、徐々に慣れていけばと思います。

サクラエディタ

 日本人と言えば秀丸派とサクラエディタ派の二派閥の戦いが繰り広げられておりますが、勿論このサクラエディタも非常に良いエディタです。ただ、ソースコードの色分けなどは設定しなければいけないため、そこだけはしっかりと調べて、導入する必要があるでしょう。

Codepen

 これはエディタというよりはブラウザ上でエディタや様々な機能を使えるサイトなのですが、先程紹介したEmmetが使えるだけでなく、様々なソースをフォークしていじるというGitホスティングの役割も果たしているという面白いサイトになっています特にWEBアプリケーションソフトを作ってみたい人などは、こちらで遊んでみるといいかもしれません。

Emmetで爆速開発を!

 エディタソフトを導入できたら是非Emmetというものも導入しておくと良いかと思います。これはHTMLやCSSといったコードを、物凄く縮めて書けるというもので、デフォルトでCTRLキーとEキーを押すとその短く書いたコードが正規のコードに展開されるというものになっています。例えば、HTMLのひな形を作りたいのであれば「!」を入力した後にCTRLキーとEキーを押すと、

<!DOCTYPE html>

<html lang="ja">

<head>

<meta charset="UTF-8">

<title>Document</title>

</head>

<body>

</body>

</html>

という風に自動でひな形を入力してくれます。またナビゲーションメニューなどもわざわざ長ったらしく書かなくても、

nav>ul>li*5>a[href=#]

という風に書き込んで、Emmetを発動させると、

<nav>

<ul>

<li><a href="#"></a></li>

<li><a href="#"></a></li>

<li><a href="#"></a></li>

<li><a href="#"></a></li>

<li><a href="#"></a></li>

</ul>

</nav>

 このように自動でソースを展開してくれます。これは開いているファイルの拡張子によって様々なショートカット入力が可能なので、CSSはCSS用のコマンドがあったりするわけですが、ちょっと覚えておくだけで超高速でソースが書けるようになってきます。是非使ってみると良いかと思います。Emmetの公式サイトに様々なコマンドの方法などが載っておりますのでそちらを参考に、よく使うものから実践していくといいかと思います。また、ちょっと邪道な使い方にはなりますが、よく使うコードスニペットをEmmet形式でコピペして、エディタで展開するという使い方も出来ます。特に先程書いたメニューなどは「li*5」と書かれている部分の数を書き換えるだけでメニューの数を変えられますので、非常に汎用性がある使い方ができるかと思います。また、メニューに自動で連番を入れるという事もできますので、是非そちらも調べてみてください。

他にも色々あるけれど

 他にもローカルでPHPを動かしたいのであればXAMPPといった物を導入したり、Android端末のゲームをパソコンで動かしてみたいのであればBluestackといった仮想Android端末を導入するといった、それぞれの環境ごとに導入した方がいいというものがあるかと思います。是非、自分の環境と用途別になにが必要なのかを考えその都度導入してみると良いかと思います。