未分類

Webエンジニア向け|プログラミング学習ロードマップ

プログラミング学習がどれだけ始めやすいとは言っても、その学習範囲は膨大です。

・どこから学習すれば良いか?分からない・・・

・出来るだけ短期間で転職したい・・・

・この技術は今使われているのだろうか・・・

などなど、プログラミング学習を邪魔する悩みは意外と多いです。

この記事では、実際に独学でweb系のスキルを身につけエンジニアとして働く筆者が、現在のweb開発の主流技術や開発事情と、独学時代のwebエンジニアになるために学んだ学習内容を比較した最短距離ロードマップをご紹介します!

webエンジニアとして必要最低限範囲を網羅したプログラミング学習内容となっているので、教材選択などで役立てていただけると幸いです。

現在の開発事情

現在のwebアプリケーションの基本は、SPA(シングルページアプリケーション)とRESTfulAPIです。

フロントエンドはReactやVueといったライブラリーが中心に開発されていますし、バックエンド(Pythonだと)ではDjango RestFrameworkやFastAPIのようなAPI開発に特化したライブラリーが利用されています。

これらを基本に、クラウドを使った運用や、マイクロサービスと言った設計思想に則り開発されています。

IT界隈の変化スピードは早く、技術の流行り廃りが激しいです。

しかし、現在の主流技術を理解するために、古典的技術を理解することも大切です。

なぜ???

筆者の考えでは、現在の主流技術はその一昔前の技術の技術課題を克服した結果であり、全く無関係では無いですし、

基本的な概念を理解するならシンプルな技術(古典的な技術の方がシンプルだと考えます)の方が理解しやすいからです。

最短距離ロードマップ

HTML

・h1~h6タグ(見出しなどで使う)

・pタグ(文章などで使う)

・ul、liタグ(リスト表現などで使う)

・imageタグ(画像を挿入するとき使う)

・aタグ(アンカータグ。リンクを作る時使う)

・ブロック要素とインライン要素(タグの性質。基本一行占領するブロックと、一行で共存するインライン。この違いを覚えておくと後で困る率が下がる。)

CSS

・セレクター(装飾するタグ、クラス、idを指定できる。基本的な指定は出来ると良い。)

・margin、paddingを使ったボックスモデル(基本は四角です。透明な四角パズル。)

・dev、row、col、レスポンシブデザイン、グリッドデザイン(四角パズル。12列区切りを理解するとレスポンシブも理解しやすい。)

・Bootstrap(便利。今のwebデザイン技術の基礎。最新デザイン技術のベースをここで抑える。)

JavaScript

・データ構造

・四則演算

・ループ、条件

・関数

・乱数

・DOM、JQuery

バックエンド(言語はPythonがオススメ。次点でExpress.js JavaScriptをバックエンドでも使えます)

・テンプレート(バックエンド側でページを作成してレスポンスする。今はあまり使われてないけど、大事な技術)

・API(データの受け渡しの約束事。これのおかげでアプリケーション間の通信ができる。)

・JSON(受け渡ししやすいデータ構造。使いやすい共通言語みたいな存在。)

・ルーティング(通信するための地図。これで目的地を指定する。)

・Auth(認証)、セキリュティ(安全のために必須。深めるには難しい。ソルト、ハッシュ)

・データベース(大きく分けるとSQL、NoSQLの2つがあり、一つずつ触れると良い。)

・CRUD(データの作成、読取、更新、削除をする基本概念。)

Git

・push(add、commit、pushでアップロード)

・pull(fetchとmergeを一気にやる。fetchとmerge)

・merge(取り込む。)

・stash(一時的な退避。)

  • この記事を書いた人

kazuki.m

エンジニア

開発言語:Python、Typescript

最近の関心:Vue、Typescript、Rust

-未分類