こんにちは！ 今回初めて、ダート？ をいじる涼羽です！ 何もわかりませんが、何をするのかワクワクします！
今回は記念すべき最初のプログラムを作りましょう。
DartPadにアクセス
まずはDartPadにアクセスします。DartPadでは、Dartをブラウザ上で動作させ、コードの確認を簡単に行うことができます。
「DartPad」と検索し、DartPadのサイトに移動します。
黒くてカッコいい画面ですね！ 初めから何か英語と数字が書いてあります！
一番左にある数値は行番号で、１行目にある「void main()」 はエントリーポイントです。これはプログラムの開始地点のことで、エントリーポイントの後ろにある中括弧 {} の中にプログラムを書いていきます。
なるほど！ そうすると、２行目から４行目に何か書いてあるやつはどうしますか？
今回取り扱う内容とは異なるので、削除します。
わかりました！
これで準備が整いましたね。
最初のプログラム「Hello, world!」
いよいよ最初のプログラムを書く時が……。いやー、緊張しちゃうな～！！
そんなに身構えなくても大丈夫ですよ。２行目の先頭でTabキーを押してタブを挿入してから、「print("Hello, world!");」と入力します。
入れました！ こんな感じでいいですか？？
void main() {
print("Hello, world!");
}完璧ですね！
タブって何で入れなきゃいけないんですか？
いい質問です。タブは入れなくてもプログラムは動きますが、見にくくなるんですね。以下の例を見てください。
void main() {
print("Hello, world!");
}
あー……何か見づらい感じですね……。
このくらいの分量であれば読めなくもないのですが、これが何十行ものプログラムとなると、大変読みにくくなりますね。
タブを入れるコツってありますか？
とっても簡単です！ 「{」の次の行からはタブを一個増やす、逆に「}」の次の行からはタブを一個減らす、ただそれだけです！
XXXXX{
YYYYY{
ZZZZZ{
～～～;
}
}
}ちなみにタブじゃなくてスペース連打じゃダメなんですか？
そんなことすると怖い人たちに袋叩きにされます……。
えっ！？ 何それ怖い！！
タブの他にも、中括弧を書き忘れたり、セミコロンを全角で記述してしまったりしないように注意しましょう。
わかりました……！ ところで先生、そろそろプログラム、動かしてみませんか？
そうですね！ 青色の「Run」をクリックしてみてください。
「Console」ってところに「Hello, world!」って表示されました！！ ちゃんと動いたってことですね！
おめでとうございます。初めてのプログラム、ちゃんと動きましたね。
もしかしてわたし天才！？
えっと……てんさい、だと思います……。
やったー！ もう何でもかかってきなさいって感じ！
エラーが発生した場合の解決法
プログラミングで避けて通れないのが、バグ（エラー）です。バグが発生した際に、対処してエラーが発生しないようにする作業を、「デバッグ」といいます。
バグって言葉は聞いたことあります！ でも、エラーを直すのって大変そうです……。
DartPadは大変便利で、入力ミス（文法ミス）をリアルタイムで画面右下に表示してくれます。試しに先ほどのプログラムのセミコロンを全角にしてみてください。
はい。……うわあ、何かエラーが４つも出ました！ 全部英語です！ 苦手なやつです！
慌てず丁寧に読み解いてみましょう。１つ目のエラーは「line2・Expected to find ';'.」です。「２行目で半角セミコロンを見付けることを予期されている」くらいの意味合いですね。
なるほど！ その他のエラーも、とりあえずセミコロンが怒られてることはわかります。
その通りです。セミコロンを半角に戻してやると、エラーの表示は全て消えます。
ほんとだ。何かすっきりしました。
全角と半角を間違える方は意外と多くいらっしゃいます。姫野さんも注意するようにしてくださいね。
気を付けます！
プログラミングを始めたばかりの方が陥りがちなエラーをもう１つ試してみましょうか。姫野さん、３行目にある「}」を削除してみてください。
はい。……あ、今度はエラーが１つ出ました。さっきのExpected to findのやつです。多分、「中括弧の閉じるがありませんよ」みたいなエラーですね？
仰る通りです。中括弧の対応がわかりやすいようにタブを挿入しておくと、中括弧を書き忘れた場合や誤って消してしまった場合に、すぐに気付くことができます。
やっぱりタブって大事なんですね！
【付録】DartPadの各部の説明
以下、DartPadにおける画面各部についてご説明します。
左にあるのは「エディター」で、プログラムを記述するエリアです。自動的に行番号が表示されます。中括弧ごとに▼が表示され、表示を隠すこともできます。
右上にあるのは「コンソール」で、実行結果が表示されるエリアです。printするとコンソールに表示されます。
右下にあるのは「ドキュメンテーション」で、プログラムの説明文が表示されるエリアです。printにカーソルを当てると、printの説明文が表示されます。ドキュメンテーションは「///」を用いて自分で作ることも可能です。例えばmainの説明文を作りたい場合は、mainの開始前に「///」に続けて説明文を記載します。
///Hello, world!を表示するプログラムです
void main() {
print("Hello, world!");
}Dartでは、「//」の後ろ、あるいは「/」から「/」の間に、コメントを書くことができます。ドキュメンテーションの「///」と混同しないよう注意しましょう。
