intellij ideaで node.js素敵開発life!...2013/11/16 · microsoft powerpoint -...

1

IntelliJ IDEAでNode.js素敵開発Life!•ワンフットシーバス田中正吾

2

はじめに

•IntelliJ IDEAに興味あるひと

•Node.jsに興味あるひと

•人がツールに出会う過程を知りたい人

•よりよいツールを探してる人

3

自己紹介

4

自己紹介

田中正吾（たなかせいご）屋号：ワンフットシーバス

2004年よりフリーランス。

以後、FLASH制作を中心にインタラクティブコンテンツを主に行い現在に至る。

最近はソーシャルゲーム制作界隈で

JavaScriptやHTML5アニメーション、

スマートフォン演出制作の

ワークフロー改善に関わったりしています。

5

自己紹介

細々と技術ブログ書いてます。http://ｗｗｗ.1ft-seabass.jp/memo/

Flash/CreateJS/Swiffy/EdgeAnimate/

JavaScript/自動処理などなど…

6

はじめに

7

きいてみたい

IntelliJ IDEA または JetBrain社のほかの統合開発を知ってる or 使ったことある方

8

きいてみたい

node.jsを知ってる or 使ったことある方

9

私がNode.jsを使うとき

10


11


サーバーサイドJavaScriptとして有名ですが、他にもgruntのようなWEB制作での面倒な作業を自動化するツールとしても使われます。便利。

12


私がよく使うのは、ファイル監視のAPI(watch/watchFile)を使って独自の自動処理を作ったりするのに利用中。

13


ファイルを更新した時に自動でやってくれるので、実行のし忘れの手間が省けて、作業が止まらなくていい！

14


例えば、Edge Animateのソースコードをリアルタイムに使いやすく加工したり。

15

私のNode.js制作環境（当初）

16


作業環境はWindows7。開発するエディタはいろいろ。JavaScriptのカラーリングがされればいいくらい。

17


実行はコマンドプロンプト。

18


こんなかんじ。

19

やりにくかった点

20

私のNode.js制作環境（当初）やりにくかった点

これで開発・自動処理実行はできる。しかし、やりにくかった点も。

21


やりにくかった点

•うっかりコマンドプロンプト実行し忘れる。

•JavaScriptのカラーリングはされるが、Node.js用コードヒントなんてない。エラーが起きるとデバッグは自力。大変。

•node.jsができても複数の制作をしている際に、どれ実行するか迷う。

22


とりあえず、起動するツールが多い。作業始めるときに、いろいろ準備しないといけない。

23

新たな開発環境 IntelliJ IDEA

24


IntelliJ IDEA

25


http://www.jetbrains.com/idea/

26


•現在、バージョン12。もうじき、13来る。

•インストールしてすぐに直感的に使える多言語統一開発環境。

•強力なコーディング、デバッグ、リファクタリング機能でで助けてくれる。

•Mac/Windows両対応

•Node.jsもプラグインを入れると、コードヒントやアプリケーション内で実行できる。

27


•Node.jsもプラグインを入れるとコードヒントやアプリケーション内でNode.js実行できる。

28


•Node.js用のコード支援加わる。

29


•アプリケーション内でNode.js実行できる。デバックもできる。

30

すごい。インストールしよう。

31

すごい。インストールしよう。

•インストール手順はブログに別途まとめました。フォローアップページで見れるようにします。

http://www.1ft-seabass.jp/memo/

2013/11/16/intellij-idea-node-js-plugin-install/

32

IntelliJ IDEA を導入したらどうなったか。

33


さっきのやりにくかった点、おさらい。




34


•プロジェクトごとに1画面で作業が完結できるようになった。

実行

開発ファイル一覧

35


•プロジェクトごとに1画面で作業が完結できるようになった。

解決！

解決！




36


•コードを書く時、いろいろな場所で支援してくれる。

そんなのないよ？

こんな候補があります

37



バグってます

38






解決！

解決！

解決！

39

まとめ

40

まとめ

やりづらい点が解決し作業がスムーズに。たとえば...

•凡ミスが減って、丁寧に設計ができるようになった。

•ツールがひとつになったので作業の意識が途切れにくくなった。

•出来上がったnode.jsの処理をプロジェクト単位に適用出来るように。

41

まとめ

ざっくりいうと、ぽちっと1ツール起動するだけで始められる！

その後の作業も快適！コードを書くのが楽しくなった。

42

まとめ

ツール選び大事！

43

今回のネタについてはアップします。

44

今回紹介した内容について

•インストール手順はブログに別途まとめました。フォローアップページで見れるようにします。


2013/11/16/intellij-idea-node-js-plugin-install/

45

今回紹介した内容について

• 今回紹介した内容は自分のブログに上げて、CreatorMeetUpフォローアップページにも乗せてもらいます。


46

ありがとうございました！

intellij ideaで node.js素敵開発life!...2013/11/16 · microsoft powerpoint -...

Documents