Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
311
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

@hirotakasasaki

Web Developer Roadmap 2020版が出ていたので2019版と比較

はじめに

WEBエンジニアのためのロードマップ(https://roadmap.sh)が2020版に更新されていたので2019版と合わせてざっとですがまとめます。

1つ1つの説明はしないので画像の図を読んでいただくか、2019版を詳しくまとめてくださっている記事を拝読するとよいかもです。

Introduction

2019

introdcution 2019

2020

introduction 2020

Choose your path は昨年と変わらずですが、SOLID, KISS, YAGNIが消えています。
個人的には大事なことだよなーと思ったのですがなくなってしまったようです。
あとは色の説明がなくなっていますが色分けはされているので意味は去年のままという認識です。

  • 黄色→ 作者のおすすめ
  • オレンジ → その他の選択肢など
  • グレー → 非推奨

Frontend Roadmap

2019
Frontend 2019

2020
Frontend 2020

Internet

2020版から追加されました。たしかに今までなぜなかったんだという感じ。
インターネットの挙動、HTTPとは、ブラウザの挙動、DNSなど基本的なことを学びましょうということです。
ただ学ぶ順番は自由でいいよーとのことです。知っていると絶対にいいのですが、必要に迫られてやる機会はあまりない気もするので早めに時間取ってやるのがいいと思います。

HTML

HTMLには「フォームとバリデーション」と「慣例とベストプラクティス」が加わりました。

CSS

CSSでは「メディアクエリ」が「レスポンシブデザインとメディアクエリ」になりました。
また当たり前だろうということなのか、CSS3が消えました。

Version Control System

JSの次にバージョン管理システムが追加されました。
GitとGithubの使い方をこの時点で学べよということみたいです。

Web Security Knowledge

上のバージョン管理システム同様、新しく追加された項目です。
HTTPS、CSP、CORS、OWASPの上げているリスク項目が上げられています。

CSS in JS

中の項目は変わらずですが、CSS in JS が黄色に。

Web Components

新しく加わった項目です。
中には「HTMLテンプレート」、「カスタム要素」、「Shadow DOM」があります。
ただこちらは黄色ではないようです。

CSS Framework

CSS FrameworkはJSベースのものも加わりました。
加わったフレームワークは下記でどれも黄色です

  • Reactstrap
  • Material UI
  • Tailwind CSS
  • Chakra

Type Checkers

Type Checkers では「TypeScript」は変わらずですが「Flow」が非推奨になりました。
また細かいですが次のPWAと順番が入れ替わっています。

PWA

ここ最近話題のPWAが黄色に変わりました。中の項目はそのままです。

Server Side Rendering

こちらも黄色になりました。中身に大きな変化はありませんが、After.jsがグレーになりました。

GraphQL

こちらも新規追加。
Apollo と Relay Modern が項目としてあります。
2つの比較はこちら

Back-end Roadmap

2019

Back-end 2019

2020

Back-end 2020

大きな変化なし
と思ったら1/17に更新されたようです。また追って書きます。
一旦画像だけ新しいものに貼り直します。

DevOps

2019

DevOps 2019

2020

DevOps 2020

大きな変化なし

さいごに

バックエンド、DevOpsには大きな変化なく、フロント側に変更がありました。
とはいえ大きな主流とそこまで変わらないイメージなので、すでにエンジニアで2019版を見ていた方はざっと見程度でいい気がします。
これからエンジニアになろうとしている人や初心者の方はこの全体像を参考にして勉強進めるのがよいかなと思います。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
311
Help us understand the problem. What are the problem?