前回からの続きで、フロントエンドエンジニアになるために学習すべきこと、順序を解説していきます。

WEB DEVELOPER ROADMAP 2020とは

GitHubで公開されているWeb系エンジニアなるために学習すべき知識、順番などを示してくれているものとなります。

kamranahmedse/developer-roadmap
Roadmap to becoming a web developer in 2020. Contribute to kamranahmedse/developer-roadmap development by creating an account on GitHub.

フロントエンドエンジニア

ロードマップ

アイコンの説明

各ブロックの左上についているアイコンの意味を説明します。

パープルのチェック

個人的にオススメ。
優先度は一番高い。

グリーンのチェック

紫のチェック以外の選択肢、これか紫のチェックについて学ぼう。
2番めに優先度は高い。

グレーのチェック

いつ学んでもよい。
優先度は最も低い。

グレー

オススメしない。
個人的にはやらなくていいと思う。


Web Security Knowledge

セキュリティについてです。
インフラよりの知識となる部分もあるため基本的なことは知識として持っておきましょう。

  • HTTPS
  • CORS
  • Content Security Policy
  • OWASP Security Risks
情報セキュリティ - Wikipedia

HTTPS

SSLとかの知識ですね。
インフラ寄りではありますが概念の理解は必要です。

HTTPS - Wikipedia
httpとhttpsの違いとは? 知っておきたいウェブセキュリティの常識と今後
ホームページのURLで見かける「https」の意味と「http」との違い、「https」だけでは安全とは言えない理由、ネット詐欺から身を守るコツなどを分かりやすく説明。

CORS

Ajaxとかの際にいろいろ問題が起きるのがCORSです。
通信ができないときは大抵これです。

オリジン間リソース共有 (CORS)
オリジン間リソース共有(Cross-Origin Resource Sharing)(CORS) は、追加の HTTP ヘッダーを使用して、あるオリジンで動作しているウェブアプリケーションに、異なるオリジンにある選択されたリソースへのアクセス権を与えるようブラウザーに指示するための仕組みです。

Content Security Policy

XSSとかが発生した際に検知、報告を行うためのものです。
こちらもインフラよりの知識になります。

コンテンツセキュリティポリシー (CSP)
コンテンツセキュリティポリシー (CSP) は、クロスサイトスクリプティング (XSS) やデータインジェクション攻撃などのような、特定の種類の攻撃を検知し、影響を軽減するために追加できるセキュリティレイヤーです。これらの攻撃はデータの窃取からサイトの改ざん、マルウェアの拡散に至るまで、様々な目的に用いられます。

OWASP Security Risks

OWASPというWebセキュリティを専門に行っている組織です。
よくある脆弱性について書いてあるので見ておきましょう。

OWASP Top Ten Web Application Security Risks | OWASP
The OWASP Top 10 is the reference standard for the most critical web application security risks. Adopting the OWASP Top 10 is perhaps the most effective first step towards changing your software development culture focused on producing secure code.
OWASP Top 10 Webアプリケーション・セキュリティ・リスク | Synopsys
OWASP Top 10 2017は、最も重大なWebアプリケーション・セキュリティ・リスクのリストです。Webアプリケーションに関するこれらの10大脆弱性にどのように対応したらよいでしょうか?

記事が長くなるので今回はここまで。