第6講: 【画像解説】たったの3クリックで環境構築して、プログラミングを始めるウラ技。

前回お伝えした理由から、初心者さんの大半はまず環境構築が越えられません。
それをたったの3クリックで越える方法を画像付きで解説します。(こりゃ失敗する方が難しい!)
そして実際に軽くプログラミングを始め、一番厄介な「全角スペース」を体感していただきます!

***

こんにちは。
洗濯物を干したら急に曇ってきた、黒田道哉です。

Hello, world! Bye,環境構築

今回は、みんな大嫌い、環境構築をすっ飛ばしてくれる、超絶ありがたツールを紹介します。
安心してください。無料です。

それを使って、カンタンにプログラミングを体験しましょう。
一緒にやるから大丈夫です!

 

DLしてもらったChromeを使っていきます。
Chromeには、スマートフォンで言うアプリみたいなのがあります。

「拡張機能」と呼ぶんですけど。
なんと、その拡張機能を使って、環境構築を SKIP ! することができちゃいます。

 

ただ、デメリットもあります。

(1)簡単に環境構築ができる分、本格プログラミングではないので、
何もかもができるわけではないんです。
でも、脱・初心者にはもってこい!です。

 

(2)使える言語はPythonとJavaScriptだけです。
普通に十分ですが、この他にやりたい言語がある場合は、本格的に環境構築が必要です。

でも、小学1年生に初めて野球を教えるって時に、
いきなり18m離れたところから、オーバースローで投げませんね?

そんなん打てなすぎて絶対いじけるでしょ。笑
野球楽しくなくなっちゃいますよね。

 

下手投げで打ちやすいようにトスしてあげて、打たせてあげて、
打つ楽しさをわかってもらうのが先ですよね?

はじめに追求するべきは、正しさよりも、楽しさですもんね。

 

ということで、本格的な環境ではありませんが、
これから始めるあなたにはピッタリだと思いますのでご紹介します。

 

使うツールは “Python Shell”

では、ありがたツールを手に入れていきましょう。
たったの【3クリック】で済みます。すごいですね。
迷いようがありません。

それがコチラです。

セッティングの方法を、画像とともにご紹介しますね。

全然難しくないので、「できるで!」って方は画像を見ず先にやっちゃっても大丈夫です。

Step1: 青い「Chromeに追加」ボタンを押下

 

 

Step2: 白い「拡張機能を追加」ボタンを押下

白い方をプッシュしてください。

※「押せ!」と言わんばかりに青く光ってるやつがいますが、それはキャンセルボタンです。笑

 

 

Step3: ポップアップを読んで「×」を押下

 

はい、準備完了です!

 

 

マジで3クリックだったでしょ?
(いやぁ、さすがGoogle、素晴らしいインターフェイスです。)

 

いざプログラミング開始!

使い方はカンタンです!

使いたい気分になったら、ブラウザ右上にあるアイコンを押下するだけ!

ブラウザ右上ってのは、URLバーをそのまま右に進んでいったところです。

 

じゃ、いよいよ使ってみましょう!!

青と黄色のPythonマークを押下してください。
右上に白い画面が出てきました。

カーソルがこんな感じで、チカチカしていますね。

 

Pythonくんが、今か今かと待機しています。

これに文字を打ち込んだらどうなるんでしょうね!?
ちょっと試し…

 

 

あ!!!!!

むちゃくちゃ大事な注意点です。

プログラムを打つときは、【半角英数モード】にしてくださいね。

つまり、
キーボードを「k」→「i」の順でうったら、
「ki」と出力されるモードにしてください。
「き」が出力されたら(全角モード)ダメです。

 

全角はダメです!

全角はダメです!!!!!

全角はダメでーす!!!!!!

 

 

全角が1つでもいると、コードが動いてくれなくなります!

特に、全角スペースは忍者です!地雷です!

 

何故地雷なのかと言うと、
半角英数のなかに、ひらがな・カタカナ・漢字が混ざっているのは目視でスグわかりますが、
スペースは全く気づけないからです。 
…ほら。

「スペースは全く気づけないからです。」の後ろに全角スペースがあるなんて誰もわからなかったでしょう?笑

こういうのが

「ソースコードを、ぶっ壊〜す!」

するんです。

 

全角。ダメ。絶対。
(だから本当は、コード内に書くものは、コメントとかも含めて全部英語の方がいいです。)

 

 

おっと、Pythonくんを待たせっぱなしです。

ここからは、「半角英数モード」であることを確認してくださいね。

 

計算してもらおう

足し算編

アホな小学生が出しそうな問題で申し訳ないですが、
「1足す1」をしてもらいましょうか。

1足す1をPython語にすると、こうです。

1+1

そのまま!笑

 

じゃあ、打ってみましょう。

 

打ち込めたら、バシイィッ!っとエンターキーを決めましょう笑

そうすると、Pythonくんが

って返してくれるはずです。

無愛想ですね。

でもまあこっちも

「Python様 いつもお世話になっております。今回は、1+1の計算をしていただきたいと思っております。何卒、よろしくお願い致します。」

って丁寧に言ったわけじゃないから、おあいこですね。

 

 

引き算編

今度は引き算です。
ご想像どおり、引き算は

10-7

のようにタイプすればOKです。
そう、算数のときと同じですね。

オッケーですね。

 

掛け算編

でも、
ちょっと変わってるのが、掛け算と割り算です。

掛け算のマークは、×ではなく「*」マーク、アスタリスクマーク

になります。

つまり、7かける9は

7*9

となります。
試しに、お好きな計算をしてもらってください。

ちなみに、
右上「Option」→一番上「Clear Consolre」とすれば、今までのPythonくんとのやり取りを消すことができます。

 

スーパークレイジーな割り算編

掛け算よりももっと変なのが、割り算です。

何が変なのかと言うと、
なんと、割り算のマークは3種類もあるんです。

 

  1. 割り切れるまで計算してくれるマーク「/
  2. 商だけを答えてくれるマーク「//
  3. 余りだけを答えてくれるマーク「%

 

(1)(3)はだいたいどの言語でも用意されていると思います。

どう違うんでしょうか?

ちょっとやってみますので見ててください。

17÷4
で、どうなるかやってみましょう。

順番に

  1. 割り切れるまで計算してくれるマーク「/」
  2. 商だけを答えてくれるマーク「//」
  3. 余りだけを答えてくれるマーク「%」

をやってもらいます。

割り切れるまでやるなら、17÷4=4.25

商・余りを出すなら、17÷4=あまり

なので、Pythonくんの返事は、上から順に

4.25
4
1

となるはずですが…?

 

Pythonくん、よろしく!

 

 

さすがPythonくんです。バッチリ!

 

まあ、逆に違う答えが出てきたらおかしいですよね。
できるに決まってるんで感動も少ないかもしれません。

そこで…

あえて地雷を埋め込んでみよう!

ではありませんか!

今度はこんなふうにわざと地雷を付け加えてみてトライしてもらえますか?

1+1□

(□は全角スペースです)

 

 

そう、破壊神・全角スペースです。
ちょっとやってみましょう。大丈夫です、爆発はしません。

失敗は、助けてくれる人がいる間にしておいた方がいいですからね。

 

では思い切ってエンターキーを押してみてください!

 

 

 

 

 

 

出ましたか?エラー文。

SyntaxError: invalid syntax

 

こんな風に、エラー文は英語で出るので、ある程度はわかるようにしておいたほうが良いですね。

エラー文を読み解く

syntax(シンタックス)は「構文」です。

コードの型、コードの約束のことですね。

 

 

invalid(インバリッド)は、「無効」です。

validが「有効」という意味で、それに否定のinがついてるので「無効」なんです。

※漢字と同じです。さんずいへんがついてたら水のイメージがありますよね?
それと同様に、英単語の世界ではinとかdisとかが頭についてると、否定の意味を持つんです。(接頭語と言います)

 

ついでに、
validの名詞系であるvalidation(バリデーション)は、
「有効化(≒有効性チェック)」
であることも覚えておきましょう。実務ではよく使います。

 

 

 

 

2つ合わせた

SyntaxeError:invalid syntax
=「構文エラー:無効な構文」

です。つまり「構文間違っとるで」ってことですね。
エラーが起きたら、こんな風に文章を解析してくださいね。

 

まぁ、エラー文をそのままコピペしてgoogleにぶっこんでもたいてい解決しますが。笑

 

はい!

…おわかりいただけたでしょうか?
この全角スペースの恐怖。

何が怖いって、

 

「1+1」の構文自体は何も間違ってないんですよ?

 

つまり、

エラー文「構文間違っとるで」を真に受けて、
1+1という構文を何回眺めても、どういじくっても、エラーは治らないんです。

原因は「見えない全角スペース」だからです。
これに気づかず数時間悩む、とか全然あります。笑

予言しましょう。

きっとあなたも一度はやります。笑

 

エラー文で「全角スペースが混ざってます」とか言ってくれたら良いんですけどね。

もちろんエラー文には、
「何行目が間違ってます」とか、
「●●なルール違反があります」とか教えてくれるものもあります。

でも、全角スペースは教えてくれないことが多いですね。

 

ということで、

「どこも間違ってないはずやのにエラー出る!」
→ 全角スペースで検索をかけてみる

を頭の片隅に置いておいてくださいね。
このポイントはあなたを救いますよ!

 

さて!

 

これで、PythonやJavaScriptで試行錯誤できる環境が整いました。
今すぐ本屋さんでPythonかJavaScriptかのコーナーで、
「これだ!」と思う本を買って、遊んでみてください!

近所に本屋がない場合は、kindleもありですね。
kindle unlimited(30日間無料)で読み放題にするのも良いですよ。

 

次回予告

この講座はここから少し方針が変わります。

 

具体的なコードの解説というよりも、
エンジニアとしての「地頭」
をあなたにインストールしていただくことが中心になってきます。

具体的なコードの解説をしない理由については、
ご覧いただいた通り、山ほど書籍が出てるので、黒田がゼロからレクチャーする必要性はないと感じているからです。(講座シリーズ後半で述べますが、それは「車輪の再発明」ですから)

 

逆に、「地頭」を解説する理由は、誰も解説してるように見えないからです。
しかも、重要だからです。

この講座はそこを解説するために、と作ってますから。

講座の冒頭でお話したことをあらためて引用しますね。

– – – 引用ここから – – –


より

堀江貴文氏が「プログラミングなんて英語より簡単」って言ってるの聞いても、
どうしてそんな事が言えるかわかってないでしょ?笑

「またそんな…目立ちたいからってそんな大ゲサなこと言って」

とか思ってません?笑

本当に簡単ですよ。
説明しますね。

英語は細かい知識まで暗記しないといけないですが、
プログラミングは、頭に入れるべきものはかなり少ないんです。
天才の頭も借りれますからね。

文法に加えて、単語をたくさん覚えてようやく使えるのが英語。

でもプログラミングは、単語に当たるものはほとんどなく、
文法を覚えたらおしまいです。しかもその文法の量も英語より少ない。
(しかも複雑なことはどこかの天才がやってくれる。笑)

だから、堀江貴文氏は「プログラミングは英語より簡単」って言ってるんです。

英語と違って、一生懸命勉強するものではないんです。

身につけるべきものはごくわずか。

「その中でも特に重要」ということを、本講座ではお伝えしています。

しかも「その “わずか” をどのように使うか?」という地頭的部分までレクチャーしています。

まぁ、“本職”にとってはジョーシキですし、
これから“本職”を目指されるあなたにもジョーシキであって欲しいので

「ジョーシキ講座」と銘打っています。

– – – 引用ここまで – – –

こう言うところにこそ価値があると思ってます。

挫折してしまう人が多いのは、その辺がズレちゃってるからだと思うんです。

ということで、
次回はプログラミング学習が一気にラクになる考え方をご紹介します。

どうするかっていうと、学ぶものを4つに分類するんです。

あ、これは●●やな。これは▲▲やな。などなど…。

それだけで、頭が整理されますよ!

第7講: 義務教育の真逆の世界(プログラミングはiPhoneと同じ。誰でも使える)
「”分”かるとは、”分”けること」なんて言います。プログラミングがスッとわかるようになりたければ...プログラミングの学習で、「何を勉強するのか?」を分けて頭に入れましょう。でも安心してください。その分類は4つだけです。

 

 

おまけ1:今日のエンジニアジョーク

 

 

おまけ2:お前誰やねん?シリーズ

(つづき)

「渋谷に近くって、時間の自由が効く会社・・・。」

 

リ●ナビで検索です。

 

画像8

 

 

ありました。

なんだかIT関係がたくさん!

 

画像4

 

【うわぁ、プログラミングの授業めっちゃキツかったけど、ちゃんとやっててマジでよかった!】

と思いました。

きちんと勉強していたお陰で選択肢が増えました。

 

 

そして、無事、超絶ホワイト企業に内定。

フレックスタイム制度を悪よ…活用して、

仕事の途中でレッスン受けに行ったりしてました。笑

 

その後は、応援してくださった方々のおかげさまで、

そこから1年ほどで、ダンサーとしての半年がかりの大きなお仕事をいただきました。

めっちゃ悩みましたが、会社を辞めました

 

その日から、ダンスしながらお金をもらうという毎日です。

 

それはもう….

 

 

 

 

 

死ぬほど幸せでした。

画像5

というか、「もうすぐ死ぬんかな?」と思いました。

 

人が人生で受け取る幸せの量が決まってて、

神様?に「お前の人生は残り短いから、残りの幸せ全部一気にやるわなw」って言われてるんかなと思いました。笑

そのくらい幸せでした。
大学時代から、毎日夢のために頑張ってくれた自分に感謝です。

翻って、あなたの夢はなんですか?

 

もしかすると、「エンジニアになったら叶いやすくなること」かもしれませんし、

今はないけど「エンジニアになったら見えてくる」のかもしれません。

いずれにせよ、

私がそうだったように、プログラミングスキルは今なら「踏み台」にできます。

私は、プログラミングのスキルがあるからこそ、

思い切って会社を辞めることができたんですから。

「このスキルがありゃ、どこにでも雇ってもらえるやろ」って。

今でもそう思ってます。

(まぁ、それでもやっぱりホームレスになる覚悟をしながら会社を辞めましたけどね。笑)

 

私と同じように、

あなたのライフスタイルも、大きく変わる可能性を秘めています。

エンジニア的スキルを持つことによって、あなたの人生をガラっと変えることが出来ます。

だって、「IT革命」という地球規模の革命の真っ最中なんですから。

そりゃ、あなた1人の人生を変えることだってできます。

で、コレを言うとめっちゃ胡散臭くなるんで嫌なんですけど…。

(続く)

 

 

 

次の講座へ

第7講: 義務教育の真逆の世界(プログラミングはiPhoneと同じ。誰でも使える)
「”分”かるとは、”分”けること」なんて言います。プログラミングがスッとわかるようになりたければ...プログラミングの学習で、「何を勉強するのか?」を分けて頭に入れましょう。でも安心してください。その分類は4つだけです。