作ったもの解説 #1 プログラミング未経験者でも13時間で作れる? JavaScriptで動くメモ帳アプリ
こんにちは、プログラマーVTuberの衣亥栖ティオです。
今回は "プログラミング未経験者でも13時間で作れるJavaScriptで動くメモ帳アプリ" の解説をします。
メモ帳アプリの動作については以下のツイートに載せています。
メモ帳アプリの動画を撮ってみました。ただ、画質が悪くて何をしているのかがいまいち分かりづらいですね・・・。 #新人Vtuber #プログラミング学習 pic.twitter.com/WLlyUl6kHx
— 💻 衣亥栖ティオ/プログラミング VTuber (@TioIis) October 23, 2021
動画でも取り上げています。
- 衣亥栖ティオについて
- プログラミング学習動画 "プログラマーへの道" のコンセプト
- プログラミング未経験者でも13時間の動画を見るだけでメモ帳アプリを作ることができる
- メモ帳アプリを作るまでのざっくりとした工程
- 学べること
- 学べないこと
- 今後について
衣亥栖ティオについて
都内でサーバサイドエンジニアとして働いています。 普段利用しているプログラミング言語はGoなので、JavaScriptはほとんど書いたことがありません。
プログラミング学習動画 "プログラマーへの道" のコンセプト
"プログラマーへの道" のコンセプトは "必要最低限の学習でアプリケーションを作る" というものですが、 これは "学習する" -> "アプリを作る" -> "学習する" -> "アプリを作る" というサイクルを回していくためです。
プログラミングには多くの知識が必要となります。 今回作成したメモ帳アプリもこだわろうと思えばいくらでもこだわることができますが、こだわればこだわるほど必要となる知識は多くなってしまいます。 プログラミングを学習するために書籍を購入した結果、プログラミングを始める前の環境構築に挫折した人も多いのではないでしょうか? 私が最初のアプリケーション作成としてブラウザベースのもの（JavaScript）を選択したのはブラウザとメモ帳があれば開発可能だからです。 そして、実はメモ帳アプリを開発することも最初から決めていたので、 メモ帳アプリの開発まではそこで必要となる知識のみを動画にしていました。
プログラミングはアプリケーションを作ってみないと楽しさが分からないと思うので、私の動画を見て少しでもプログラミングに興味を持ってもらえるといいなと思っています。 今後も "必要最低限の学習でアプリケーションを作る" というコンセプトで動画を作成する予定です。
プログラミング未経験者でも13時間の動画を見るだけでメモ帳アプリを作ることができる
今回のメモ帳アプリはプログラミング未経験者の方を対象にしているので、HTML, JavaScript, CSS の基礎から動画で説明しています。 それにも関わらず合計13時間程度の動画でメモ帳アプリを作れるのは "必要最低限の学習でアプリケーションを作る" というコンセプトに振り切っているからです。 ただ、私の説明だと分かりづらい部分もあると思うので、視聴者自身が自分で不明点を調べる必要はあると思っています。
メモ帳アプリを作るまでのざっくりとした工程
メモ帳アプリを作るまでの工程ですが、以下のような流れになっています。
- JavaScriptでプログラミングの基礎を学習する
- メモ帳アプリ（プロトタイプ）を作る
- JavaScriptを本格的に学習する
- CSSの学習をする
- メモ帳アプリを作る
プロトタイプになってしまいますが、最初のメモ帳アプリは動画の第8回目で作っています。 これも "必要最低限の学習でアプリケーションを作る" というコンセプトを意識したものです。 一番挫折しやすいのは3番目の "JavaScriptを本格的に学習する" だと思います。 これでも必要最低限の知識に限定したつもりなのですが、他の工程に比べると理解するのが難しいかもしれません。 各動画の時間も長めです。 5番目の "メモ帳アプリを作る" は私のJavaScriptスキルが低いこともあって、実装に時間がかかってしまいました。 動画の数も多めです。
学べること
13時間分の動画でWebFrontend開発の基礎は学ぶことができるのではないかなと思っています。 少なくともメモ帳アプリ程度のものであれば、自分で調べながら作ることができるようになっているはずです。
学べないこと
現在のWebFrontendでは React などのフレームワークを利用するのが主流であり、プログラミング言語も TypeScript を利用します。 チーム開発だと Git & GitHub は必須ですし、ローカル環境も WebPack などで構築することになります。 動画ではこれらを扱っていません（ライブラリすら扱っていません）。 そのため、あくまで "作れるだけのスキルを身につけられる" だけであって、とても業務レベルでやっていけるスキルを身につけられるわけではないです。
今後について
今後は今回開発したメモ帳アプリを利用しつつプログラミングに必要な知識を紹介する動画を作っていこうと思います。
