Webアプリケーションを作れるようになるための学習手順を書いておきます。
何をどのくらい学習すればいいかという基準にしてもらえるといいでしょう。
1. 基本的なプログラミングスキルの習得
HTML、CSS、JavaScriptの基礎を学ぶ事が基本です。
W3Schoolsや
MDN Web Docsなどのチュートリアルやリファレンスリソースを利用するといいでしょう。
HTML,CSSは、基本構造と、表示クリエイティブとしてのデザインを理解して、簡単な素材や、色相についての知識を身につけましょう。
Javascriptは、簡易学習ではなく、深い領域まで知っておく事が重要です。
Webアプリケーションの仕様などが決まっているのであれば、それに基づいたJavascript知識を学習するだけでもいいですが、幅広いアプリケーション構築がしたいと考えると、フロントエンドのスキル全般の知識を学習することをオススメします。
2. 開発環境の構築
コードエディタ（VS Code、Sublime Textなど）をインストールして、バージョン管理システム（Git）の基本を学ぶ。
IDE（コードエディタ）は、基本的には何を使ってもできますが、VScodeが比較的、ネットの情報が多く、プラグインなどで効率のいい開発を行う事ができます。
Gitは、CUIとGUIがありますが、全ての機能が使えるCUIを覚えておくことが重要です。
あと、ケーススタディでの学習で、基本はわかりますが、実際に本番で使っていると、とまどうケースも多いので、多くの経験を積んでいく事がスキルアップにつながります。
3. フロントエンドフレームワークの学習
React、Vue.js、Angularなどのフレームワークを選び、学習して、小さなプロジェクトで実際にコーディングしてみる。
Node。jsというサーバーサイドJavascriptを理解すると、Javascriptの幅の広さを知る事ができます。
フレームワークは、非常に簡易にWebアプリを構築できてしまうので、深くまで知らなくてもフレームワークの使い方だけ身につければ、大体のアプリ構築ができるでしょう。
その後のアプリの負荷軽減や、スケーラビリティ対応、独自機能の構築など、フレームワークではできない領域になった時に、Vanilla.jsという、素のJavascriptでなんでも構築できるようになれば無敵になれます。
4. バックエンドの基礎を学ぶ
Node.js、Express、Django、Flaskなどのバックエンドフレームワークを選び、REST APIやGraphQLの基本を学ぶ。
バックエンドはデータの扱いをするための技術と、ネットワーク、サーバーについての知識が求められます。
ここでも、バックエンド用のフレームワークを１つでも触っておくと、基礎的な要素を学習する事ができるので、学習効率がいいでしょう。
5. データベースの理解
SQL（MySQL、PostgreSQL）やNoSQL（MongoDB）の基本を学び、データの保存とクエリの方法を学ぶ。
バックエンドと連結して使う、データベースは、SQLやNoSQLの他にも、JSONテキストで簡易な構築をすることもできます。
SQLの学習は、それら全ての基礎としての知識が詰まっているので、SQLを学習する事はデータの扱いを効率的にできる基礎学習と考えてもいいかもしれません。
きっと、データの扱いが単純にデータの保存と削除だけでない、リレーションやインデックスなどで効率的になることを知っていくことで、データサイエンスの面白みが理解できるようになるでしょう。
6. 完全なWebアプリの開発
フロントエンドとバックエンドを組み合わせたプロジェクトを作成。
フロントとバックが理解できたら、実際にWebアプリを構築できるスキルは身についているはずです。
是非自分で構築をしてみて作りたいWebアプリを作れる面白さを体感してみましょう。
おそらく最初にユーザー認証やデータ操作の機能を実装するところで、どうすればいいか悩むと思うので、OAuthなどの技術を学習して、ユーザーデータが扱えるWebアプリを構築してみましょう。
※ユーザー認証を構築しなくても、Webアプリは構築できます。
7. デプロイと運用
アプリをHeroku、Vercel、AWSなどのプラットフォームにデプロイして、基本的なDevOpsの概念を学ぶ（CI/CDパイプラインなど）。
Webアプリは公開をしなければ、誰も使う事ができません。
クローズドな環境として、ローカル環境のDockerなどで動作するWebアプリという方式もありますが、公開してこそWebアプリの本領が発揮されます。
メジャーなクラウドサーバー以外でも、オンプレミスとしてのサーバーでも問題なく構築して公開する事は可能なので、コストの見合う環境で公開してみましょう。
ちなみに、
シンフリーサーバー（旧:Xfree）サービスを使うと、無料で公開サーバーを公開する事ができるので、学習サーバーとして使うことをお勧めします。
8. セキュリティの基本
Webアプリのセキュリティに関する基本知識を学ぶ（XSS、CSRF、SQLインジェクションなど）。
Webアプリのデメリットとも言ってもいい、インターネットブラウザの厳しいセキュリティ基準で、思った通りの事ができないと行き詰まる事があるでしょう。
気をつける点としては、マルチドメインと、入力フォームの扱いを理解しておく事で基本的な情報学習ができるでしょう。
JavascriptやCSSなど、外部リソースを読み込む場合の別ドメイン（サブドメイン）のできる範囲についての理解は、実際に自分で複数のドメインのコードを書いてそれらをどうすれば連結させる事ができるようになるのかという事を調べてみると、ブラウザセキュリティの厳しさを知る事ができるでしょう。
9. 継続的な学習と改善
新しい技術やフレームワークの動向を追う事は自己のスキルアップに役立ちます。
コードレビューやオープンソースプロジェクトへの参加でスキルを向上させる事も非常に有効なので、率先して他人の書いたコードを読む事を癖つけるといいでしょう。
また、メンターとしてスキルホルダーの人に自分のコードをレビューしてもらう事もコードスキルを加速的にアップさせる事ができるようになります。
プログラミング学習は終わりがない学習なのですが、基礎ができていないと面白みを感じる前に諦めてしまう人が多いので、時間に余裕がある人は是非アルゴリズムの学習などをしてみるのがいいでしょう。
あとがき
Webアプリの基礎トレーニングとして、次のような課題でアプリケーションを構築してみるといいでしょう。
・計算機
・保存可能なテキストエディタ（マークダウンエディタ）
・マルバツゲーム
Webアプリを作ると言う事は、Webサイトのフロントからバックまで全ての作業をひぼ1人でこなすという事になります。
今回紹介した学習手順は、あくまで参考値です。
実際にこれらを全て学習しなくても、簡単なWebアプリは作る事ができます。
ただ、仕事でWebアプリを作るとなると、最低限の学習といってもいいかもしれません。
また、下手なWebアプリを作ると、それを踏み台にされて色々な犯罪に巻き込まれるなんて怖い事例もあるので、セキュリティは学習しておく事は自己防衛にもなります。
怖がらずに独自で学習を続けるも良し、他人にコードレビューをしてもらうも良し、とにかく作り続ける事が何よりの学習になる事はまちがいないでしょう。
0 件のコメント:
コメントを投稿