炎の型工房 火の型 17日目 : Dartを始めよう!! IntelliJのインストールとHelloWorld

[<ruby>炎<rt>ほのお</rt></ruby>の<ruby>型<rt>かた</rt></ruby><ruby>工房 <rt>こうぼう</rt></ruby>ScratchとDartでゲームプログラム<ruby>入門<rt>にゅうもん</rt></ruby> Advent Calendar 2016](http://qiita.com/advent-calendar/2016/firefirestyle-studio)
の<ruby>記事<rt>きじ</rt></ruby>です

<img width="500" alt="magic.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/48617c7a-d923-a25f-fe38-c55e48d60a5f.png">



<ruby>今<rt>いま</rt></ruby>、あなたは、<ruby>世界一<rt>せかいいち</rt>のプログラマーになりました。

ソフトウェアが<ruby>動作<rt>どうさ</rt></ruby>する<ruby>環境<rt>かんきょう</rt></ruby>なら
あなたに<ruby>不可能<rt>ふかのう</rt></ruby>な<ruby>事<rt>こと</rt></ruby>はありません。


もうすぐ、あらゆるもので、ソフトウェアが<ruby>動作<rt>どうさ</rt></ruby>するようになります。

つまり、あなたは　あらゆることができます。
もう、なんでもありです。

この世の中に、大切な人に
<ruby>何<rt>なに</rt></ruby>を<ruby>提供<rt>ていきょう</rt></ruby>してみたいですか?










## <ruby>実際<rt>じっさい</rt></ruby>に<ruby>利用<rt>りよう</rt></ruby>されているプログラム<ruby>言語<rt>げんご</rt></ruby>を<ruby>利用<rt>りよう</rt></ruby>してみよう!!

<ruby>学習用<rt>がくしゅうよう</rt></ruby>ではなくて、<ruby>実際<rt>じっさい</rt></ruby>に<ruby>利用<rt>りよう</rt></ruby>されているプログラム<ruby>言語<rt>げんご</rt></ruby>を<ruby>利用<rt>りよう</rt></ruby>してみよう!!


<ruby>身<rt>み</rt></ruby>の<ruby>回<rt>まわ</rt></ruby>りには、プログラムが<ruby>動作<rt>どうさ</rt></ruby>している<ruby>端末<rt>たんまつ</rt></ruby>が沢山あります。

* TV
* PC
* インターネット
* Googleのサービス
* レジ
* 電子レンジ
* 洗濯機
* 携帯電話

そういった<ruby>物<rt>もの<rt></ruby>を<ruby>動<rt>うご</rt></ruby>かすプログラムを<ruby>書<rt>か</rt></ruby>く<ruby>事<rt>こと</rt></ruby>ができるようになります。

つまり、プログラムを<ruby>覚<rt>おぼ</rt></ruby>えたあなたも
<ruby>同<rt>おな</rt></ruby>じ<ruby>事<rt>こと</rt></ruby>ができるようになります。

<ruby>身<rt>み</rt></ruby>の<ruby>回<rt>まわ</rt></ruby>りの<ruby>物<rt>もの</rt></ruby>を<ruby>電子化<rt>でんしか</rt></ruby>したりするのはどうですか?

お<ruby>人形<rt>にんぎょう</rt></ruby>やプラモデルを、ゲームのコントローラーで<ruby>操作<rt>そうさ</rt></ruby>できるようにしたりとか。

もちろん、Googleのようなサービスを<ruby>作<rt>つく</rt></ruby>ることも<ruby>可能<rt>かのう</rt></ruby>ですよ!!


　　




## Dartはいかがですか
　Kyorohiroが<ruby>好<rt>す</rt></ruby>きな<ruby>言語<rt>げんご</rt></ruby>です。 ブラウザーアプリ、Androidアプリ、iOSアプリ、サーバーサイド から <ruby>一部<rt>いちぶ</rt></ruby><ruby>組<rt>く</rt></ruby>み<ruby>込<rt>こ</rt></ruby>みまで、<ruby>利用可能<rt>りようかのう</rt></ruby>な<ruby>言語<rt>げんご</rt></ruby>です。



　オブジェクト<ruby>指向<rt>しこう</rt></ruby>をサポートしつつ、<ruby>単一<rt>たんいつ</rt></ruby>スレッド<ruby>上<rt>じょう</rt></ruby>で<ruby>動作<rt>どうさ</rt></ruby>するプログラムを<ruby>書<rt>か</rt></ruby>くことができる、<ruby>凄<rt>すご</rt></ruby>い<ruby>子<rt>こ</rt></ruby>です。





　
## <ruby>開発環境<rt>かいはつかんきょう</rt></ruby>をインストールしてみよう

<ruby>開発環境<rt>かいはつかんきょう</rt></ruby>として IntelliJ を <ruby>利用<rt>りよう</rt></ruby>してみましょう。
https://www.dartlang.org/tools/jetbrains-plugin

### IntelliJをダウンロード
1. IntelliJをダウンロードするサイトに<ruby>行<rt>い</rt></ruby>く
https://www.jetbrains.com/idea/download/

2. <ruby>自分<rt>じふん</rt></ruby>が<ruby>利用<rt>りよう</rt></ruby>しているOSを<ruby>選<rt>えら</rt></ruby>んでCommunity のダウンロードをクリック
<img width="334" alt="v001.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/b27dfd06-60ad-9f79-bc8b-e8b10e32b908.png">


3. ダウンロードを<ruby>開始<rt>かいし</rt></ruby>します。
<img width="334" alt="v002.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/83f6b47c-eb8c-96ea-35c7-32e14dcc701c.png">
  
  もしも、ダウンロードが<ruby>開始<rt>かいし</rt></ruby>され<ruby>無<rt>な</rt></ruby>い<ruby>場合<rt>ばあい</rt></ruby>は、「direct link」をクリックしてください  

### インストール
ダウンロードしたファイルをクリックしてみましょう。
ここからの<ruby>操作<rt>そうさ</rt></ruby>は<ruby>環境<rt>かんきょう</rt></ruby>によって<ruby>変<rt>か</rt></ruby>わります。

<ruby>参考程度<rt>さんこうていど</rt></ruby>に

1. Nextをクリック  
  <img width="336" alt="v101.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/03c9aa76-283c-6c12-2239-e66c48964ce5.png">

2. Nextをクリック  
  <img width="338" alt="v102.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/e457b8a3-c6ef-c57a-50c0-32fb57a2f580.png">

3. shortcut<ruby>作成<rt>さくせい</rt></ruby>にチェックを入れて、Nextをクリック  
  <img width="338" alt="v103.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/dac4ffcd-2364-0ce2-e0f2-97d8deef74e5.png">

4. Installをクリック
  <img width="338" alt="v104.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/d9695082-57f2-9d47-03b2-5752876daa19.png">

5. <ruby>少<rt>すこ</rt></ruby>し<ruby>待<rt>ま</rt></ruby>つ  
<img width="338" alt="v105.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/6fcc3747-717b-4aaf-9d6c-dd473f0cf024.png">

6. Finishボタンを<ruby>押<rt>お</rt></ruby>して<ruby>完了<rt>かんりょう</rt></ruby>です  
<img width="338" alt="v106.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/68ca66d9-eecd-edb6-cca2-4c9eb6ae6f3a.png">








## Dartをダウンロート
https://www.dartlang.org/install に<ruby>従<rt>した</rt></ruby>ってインストールしてください。

### <ruby>私<rt>わたし</rt></ruby>は<ruby>以下<rt>いか</rt></ruby>の<ruby>手順<rt>てじゅん</rt></ruby>でやりました
1. https://www.dartlang.org/install/archive を開く
2. Dart SDK と Dartium をダウンロード  
<img width="334" alt="v201.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/d59a1940-970d-352f-922d-2dc10b63962e.png">

※ OSのバージョンの<ruby>調<rt>方しら</rt></ruby>べた<ruby>方<rt>かた</rt></ruby>とかは、Googleで<ruby>検索<rt>けんさく</rt></ruby>してみよう
3. ダウンロードしたZIPファイルを<ruby>解凍<rt>かいとう</rt></rubyして、<ruby>以下<rt>いか</rt></ruby>におく
  * c:\tools\dart-sdk
  * c:\tools\dartium1.21  
  ※ <ruby>置<rt>お</rt></ruby>き<ruby>場所<rt>ばしょ</rt></ruby>はどこでも<ruby>良<rt>よ</rt></ruby>いです。お<ruby>好<rt>す</rt></ruby>きなところで  
  ※ <ruby>解凍方法<rt>かいとうほうほう</rt></ruby>は、Googleで<ruby>検索<rt>けんさく</rt></ruby>してみよう







## IntelliJを<ruby>起動<rt>きどう</rt></ruby>して<ruby>設定<rt>せってい</rt></ruby>する

1. Skip All abd Defaults をクリック  
<img width="582" alt="v302.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/2305b704-e04b-ae1f-5597-6d6f5557eecb.png">
  
2. Configure->Plugins を選択
<img width="499" alt="v303.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/35aa2d52-355d-a577-5640-b89ce721b81e.png">

3. Install JetBrains Plugin をクリック  
<img width="361" alt="v304.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/38e21b25-75fa-edd0-ce91-89df1e46eb69.png">

4. Dartを選択して、Installをクリック  
<img width="373" alt="v305.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/909ef899-c828-d127-c613-26f0f35bd0d3.png">

5. Restart IntelliJ IDEA をクリック    
<img width="373" alt="v306.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/40c28f08-dd0c-e08f-d196-54a723891321.png">


## Dart SDK と Dartium の<ruby>設定<rt>せってい</rt></ruby>をする
1. Create New Project をクリック  
<img width="447" alt="v401.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/09d6200d-212f-f096-bb56-51bb95699a84.png">

2. Dartを<ruby>クリック</ruby>して、pathを<ruby>設定<rt>せってい</rt></ruby>する  
<img width="426" alt="v402.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/84104db1-de54-22d2-4d91-737c8d0dbac7.png">
  
<ruby>私<rt>わたし</rt></ruby>の<ruby>場合<rt>ばしょ</rt></ruby>は、Dart Sdk には「c:/tools/dart-sdk/」を<ruby>指定<rt>してい</rt></ruby>しました。 Dartiumは、「c:/tools/dartium/chrome.exe」を<ruby>指定<rt>してい</rt></ruby>しました。  
※ Dartを<ruby>解凍<rt>かいとう</rt></ruby>した<ruby>場所<rt>ばしょ</rt></ruby>によって<ruby>変<rt>か</rt></ruby>わります!!  
3. Nextボタンを<ruby>押<rt>お</rt</ruby>す


　　
　
## HelloWorldを<ruby>実行<rt>じっこう</rt></ruby>してみる
1. Dartを選択して、 Simple Console...を選択する。  
<img width="424" alt="v405.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/d1cb8fed-e075-cabe-2d60-14d2a459c27e.png">
  
2. Nextボタンをクリック  
3. Project name　を　helloworld にする  
<img width="474" alt="v505.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/3a023a05-5c3c-2206-5f5b-6de30fc8aae0.png">

4.  Finbish ボタンをクリック  
<img width="336" alt="v506.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/c27d265a-3372-571b-5c56-b7e6c343ace6.png">

5. Closeボタンをクリック
<img width="336" alt="v506.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/530d022e-ad32-2f71-9f5d-89fe6ad0c98e.png">

6. Runボタンをクリック  
<img width="600" alt="v507.png" src="https://qiita-image-store.s3.amazonaws.com/0/54192/39e2d505-1afa-64c6-1004-d9d9de6d4986.png">
  
7. hello world!! と表示されます。




## Thanks
<div>
ここまで、<ruby>読<rt>よ</rt></ruby>んでくれてありがとう!!
</div>

<div>
では、<ruby>次回<rt>じかい</rt><ruby>、また
<ruby>会<rt>あ</rt></ruby>えることを、
<ruby>楽<rt>たの</rt></ruby>しみにしています。
</div>
　　
<div>
ではでは
</div>