未経験でも安心!ReactとTypeScriptでエンジニアデビューを目指そう

こんにちは、フロントエンドエンジニアのてりーです。
タイトルにもある通り、2024年に最速でフロントエンドエンジニアを目指すなら、言語はReact + TypeScriptに絞るべき!だと考えています。

この記事では、React、TypeScriptを選ぶべき理由と、それらがフロントエンド界隈でどういった立ち位置なのかを解説していきます。

この記事を書いた人

プログラミング歴6年でずっとフロントエンド開発をしています。
ニートから未経験でプログラミングを始めて、フリーランス→メガベンチャー転職とキャリアを渡り歩いてきました。

最初はWeb制作を中心にやっていたので、Vanilla JSやJQueryからキャリアを始めました。
その後スタートアップ企業でVue.js、Angularを経験して、2018年ごろからReact + TypeScriptでの開発をメインに行なっています。

関連記事

プロフィール はじめまして、Webエンジニアの「てりー」です。 プロフィールを読んでいただいて、ありがとうございます。 現在はメガベンチャー企業でエンジニアとしてフルリモートで働きながら、スキマ時間で副業をしています。 この[…]

大前提:HTML、CSSは学ばなくてOK

初心者向けに書かれた記事では「まずはHTML、CSSを学びましょう!」的な内容をよく目にします。

しかし、これらはWeb制作で主に使う言語なので、Web開発フロントエンドの現場ではいらないケースが多いです!!
Web制作とWeb開発の違いや、なぜWeb開発のフロントエンドを選ぶべきなのかについては、この記事で解決しています。

関連記事

こんにちは、フロントエンドエンジニアのてりーです。 2024年に完全な未経験状態からプログラミングを独学し、稼ぎたいと思っているあなたへ。 読者 ・どの職種が独学に向いているの? ・どの領域が良いの? ・何を勉強すれば[…]

Reactを使うとHTMLは書かない

まずHTMLですが、Reactを使うプロダクトでは生のHTMLでなはく、jsxという形式で書きます。
このjsxは構造はHTML、言語はJavaScriptみたいな感じでちょっと特殊なものとなっています。

jsxに関して詳しくはこちらをご覧下さい!

Kinsta®

この記事ではJSX(JavaScript XML)の基本をご紹介します。JavaScriptの構文拡張で、JavaScr…

要するに、ReactではHTML + JavaScriptの要素を持ったjsxという形式を扱うので、生のHTMLを学習するより、jsxから学習を始めてそれに慣れちゃいましょう!!

CSSは現場によってやらない場合もあるので、最初に学ばなくても良い!

そもそも現場レベルのフロントエンドエンジニアでも、CSSを使わないケースが結構あります!
というのも、フロントエンドエンジニアとデザイナーが役割分担をしながら業務を行うのですが、CSSによる見た目の微調整はデザイナー業務になっている事も結構あります。

また、もしフロントエンドエンジニアがCSSを使って見た目を整える場合でも、Figmaなど最近のデザインツールではCSSを吐き出す機能もあるので、自分で一からゴリゴリ書くケースは減ってきています!

そういった現状も踏まえて、CSSはフロントエンドエンジニアとして仕事を得てから、知識を入れていくでも遅くないと個人的には思っています!

フロント界隈ではJavaScript = ReactぐらいReact1強!!

現在フロントエンドで最も使われているはJavaScriptのフレームワークはreactです。

2016年からReactがずっとダントツ1位の利用率!

State of JSという世界最大規模のエンジニアのアンケートサイトがあります。

The 2023 edition of the annual survey about the latest trend…

そこでJavaScriptのフレームワークごとの利用率を見てみましょう。

1番上の青い線がReactです。
2016年からぶっちぎりで1位ですね!!

よく3大フレームワークとして「React、Vue.js、Angular」が比較されますが利用率はReactの1強なんですね!!

長年の利用率が多い = 案件、仕事が豊富かつ、利用者の満足度も高い
ちゃんとプロのエンジニアになって稼ぎたいと考えているなら、JavaScriptのフレームワークはReactを勉強しましょう!

未経験でもReactから学習すべき!!

個人的には未経験からの1つ目の言語としてReactを学習すべきだと思っています!

理由は以下です。

  • ここ10年のフロントエンド界隈はReactが決めたルールに則っている!だから、まず原点に近いReactを学ぶと応用が効く!
  • 使用率も開発コミュニティも活発で、今後もReactがフロントエンドを引っ張っていきそう
  • 公式ドキュメントが日本語でも充実していて、初心者から見た敷居が低い!

詳細な説明はこちらの記事に書いてます!

関連記事

読者 ・エンジニアになりたいけど、どの言語を学ぶか迷っている ・React、Vue.jsのどちらを学ぶか迷ってる ・将来性や年収も知りたい てりー そんな疑問に対して、解説します。 […]

TypeScriptは学習コスパの良い言語

今現在からフロントエンドエンジニアを目指すなら、JavaScriptではなく、TypeScriptを学んで下さい!!

TypeScriptはJavaScriptの上位互換

TypeScriptはJavaScriptに型付けの機能が付いたものです。

稼ぎたいならTypeScripまで勉強すべき!

2024年現在、TypeScriptは高単価の案件が多いです!
というのも、TypeScriptは2021年ごろから流行り出したので、現役のフロントエンドエンジニアでも、常に知識をアップデートしている人じゃないと書けないんです。

こちらは「paiza転職」に掲載してあった言語別の平均年収です。

photo

TypeScriptは全体の言語の中で堂々の2位ですね!(フロントエンドの中では1位です!)
JavaScriptが9位ですね!

この調査結果からも分かる通り、JavaScriptだけでなく、TypeScriptまでマスターすれば一気に稼げるようなります!

TypeScriptは他の高単価の言語に比べると難易度が低め

他の高単価の言語は未経験から、いきなり学習するにはハードルが高いです!

1位の「Scala」と3位の「Go」。この2つはどちらもバックエンドの言語です。
今まで「Java」を使って開発していた人達が主に使っている言語なので、ハードルが極めて高いと言えます。

4位の「Python3」は人気ではありますが、データサイエンス分野を得意とする言語です。
プログラミング以前に、データサイエンスに関する座学が必要になります。

その点、TypeScriptの学習難易度は高くないです!
従来のJavaScriptに加えて、「型付け」という概念をプラスで学習すれば良いだけなので、未経験から学習する際はそこまでの障壁にならないと言えます!

JavaScriptが出来る状態で、半日かけてTypeScriptの基礎をインプットすれば、あとは仕事をしながらでも、自分のモノに出来るぐらいのボリューム感と難易度です。
その上で今後の需要はさらに高まっていくので、TypeScriptをマスターすれば一気に稼げるエンジニアの仲間入りです!

・現役のエンジニアを含めても、TypeScriptを書ける人が少ない為、希少性が高く高単価の案件が豊富
・TypeScriptの学習難易度は他の高単価の言語と比べるととても低い

結論:最速でフロントエンドエンジニアを目指すなら、ReactとTypeScriptが良い!

2024年に最速でフロントエンドエンジニアを目指すなら、ReactとTypeScriptを学ぶことが最適です!

  • HTMLやCSSは必須ではなく、Reactのjsxに直接触れながら学習することで効率的にスキルを身につけることができます。
  • Reactはフロントエンド界で圧倒的なシェアを持ち、長年にわたり利用され続けているフレームワークであり、豊富な案件や仕事に繋がる!
  • TypeScriptはJavaScriptの上位互換で、学習コストが低いにもかかわらず高単価の案件が多い言語でで、学習する事で他のエンジニアとの差別化が図れ良い条件が狙える

以上の理由から、2024年にフロントエンドエンジニアを目指す際には、
「React + TypeScript」を集中して学び、効率よくスキルを習得することをお勧めします。

完全未経験からの学習手順

関連記事

プログラミング 完全初心者 何から勉強すれば良いか分からない。 具体的にやることを教えて欲しい。   こういった疑問に答えて、フロントエンドエンジニアになる為の具体的な勉強プランについて解説しています[…]

React + TypeScriptの学習方法

関連記事

こんにちは、フロントエンドエンジニアのてりーです。 僕がReact + TypeScriptを使い始めて5年ぐらい経過しました。 大学中退してニートの時期にプログラミングを始めて、ReactとTypeScriptの分野に集中する事で[…]

未経験→メガベンチャー

関連記事

こんにちは、フロントエンドエンジニアのてりーです。 僕の詳しいプロフィールはこちら 今回は大学中退してニートだった自分が完全未経験からメガベンチャーに入社した方法について解説していきます。 ・完全未経験から将来的なメガベンチャー転[…]