JS嫌いでずっと避けてきたおっさんが最近のJSの環境に震え上がっている話し - 痛風とシステム障害を恐れるエンジニアのブログ

GoogleマップでAjaxが流行ったり、JQueryとかが流行った頃に本を一冊買ったっきり、JSはずっと避けてきました。
一時期JSではなくActionScriptに期待を寄せたこともありましたが、スティー◯・ジョ◯ズがFlashを閉め出したせいで（←八つ当たり）、Flashの勢いはどんどん弱まって行く始末。
そんな私が会社の都合でJSを触ることになりました。
未だによくわかってないけど、やっていくことを少しずつメモっていきます(ﾟдﾟ)

JSっていっても最近（でもないけど）はサーバーサイドのプログラムもできるっていうからぶっ飛んじゃいますな。
とりあえず、今回はNode.jsとTypeScriptを触ることになりました。
JSっていうと、どうしても地獄のようなコールバックの連鎖と曖昧な型の解釈でカオスになりやすいイメージがあるんですけど、
TypeScriptをやるとそのへん少しは楽になるのかな？

で、だらだら書いてますが、本題に。

今回は開発環境はクラウドに持ちました。理由はたんにどっからでも開発できるクラウドを使いたかったから。
（どこで開発するつもりなのか・・・というツッコミはなしの方向で）
Cloud9というところを利用してます。けっこう歴史が長いみたいですね。
日本語メニューがないから辛いけど、日本語情報は割りとあります。c9.io

まずはアカウントの作成。恐ろしいことにストロングゼロの林檎ダブル味を飲みながらやったので、手元にメモが残ってない＠＠
おそろしや。
http://www.suntory.co.jp/rtd/196/strong.html
ストロングゼロは翌日頭が痛くなることが多いのですが、林檎ダブルは大丈夫でした(^o^)v

クラウド9ではnode.jsプロジェクトを作りました。
テンプレートが用意されていて、簡単なnode.jsプログラムであれば、このまま簡単に作り込めます。
ただし、今回はTypeScriptを使いますから、その環境の準備も必要です。

ひとまずnpmコマンドで必要なものを入れます

npm -g install typescript
npm -g install tsd

さらにTypeScriptからJQueryなどを使用できるようにします

tsd query node --action install --resolve --save
tsd query jquery --action install --resolve --save

TypeScriptは型のチェックが厳密なので、たとえばJQueryの$がJQueryだよってことを別ファイルに定義してあげるんですって。
自分でいちから作っても良いけど世の中には親切な人が用意してくれてるようなので、↑のコマンドでそれを落としている感じのようです。

TypeScriptは拡張子がtsになるようです。このファイルをJSにコンパイルするわけですが、コマンドで都度実行するのでも良いですが、
今回はgulpというビルドツール？を導入します。
これでTypeScriptからJSへのコンパイル、さらには依存関係のある複数のJSファイルをひとまとめにします。

gulp関係のインストール。

npm -g install gulp
npm install -D require-dir

npm install -D gulp-if gulp-uglify gulp-webpack
npm install -D gulp-watch

まだ未使用のライブラリ（gulp-watch)もありますがゆくゆくは使っていきたいと思っています。

gulpの設定はまだまだ続きます。もうね・・なんというか、思ってた以上に色々やらなきゃいけなくて大変ですね。
で、最終的にgulpの設定は↓こちらを参考にさせてもらいました（丸投げ）blog.flup.jp

設定などは自分の環境用にボチボチ変えてますが、とりあえうずビルドはできました。
次はnode.jsサーバで動かしてぇ・・・DBの接続をやっていこうと思います。

　
※無知なオッサンがひいこらいいながら、しかも途中で飲みながらやった作業のメモなので、間違いがあるかも。ご容赦ください。その時は教えて下さいませ。