✨ フロントエンド開発を怠惰な方法で勉強する方法

5 年前、私はフロントエンド プロジェクトを 1 つも構築できませんでした。

独立して何かを構築してみるまでは、チュートリアルを見て自信を持っていました。

すべてが難しく感じました。不可能。圧倒的です。

今日の話に移ります。私は Palantir のシニア フロントエンド エンジニアです。

フロントエンド開発を学ぶのはそれほど面倒に感じる必要はないと言ったらどうでしょうか?

自分が世界で一番愚かな人間であると感じる必要はありません。

今日のニュースレターでは、怠惰な方法でフロントエンド開発を勉強する方法を紹介します。

準備はできましたか?それでは、詳しく見ていきましょう。

フロントエンド開発を学ぶための 2 つの怠惰な方法

有料リソースに余裕があるかどうかに関係なく、これら 2 つのアプローチが成功へ導きます。

オプション 1: FrontendMasters を使用する (7 ステップ)

FrontendMasters がフロントエンド開発を私に代わって クリック してくれました。彼らの教師は素晴らしく、コースは簡潔で要点をまっすぐに教えてくれます。

GitHub Student Developer Pack を使用している学生の場合は、6 か月間無料で利用できます。それ以外の場合は、月額 39 ドルです。

効果的な使用方法は次のとおりです:

1. 無料の フロントエンド開発ブートキャンプから始めましょう。 このコースでは基本を紹介します。プロジェクトを構築します。これは学習にとって非常に重要です。

2. FrontendMentor で 1 ～ 2 つのジュニアレベルのプロジェクトに取り組みます。行き詰まった場合は、Google で検索するか、ChatGPT に質問するか、Reddit で助けを求めてください (またはメールで私にメールしてください!)。遅くて苦痛に感じても大丈夫です。そうやって学ぶのです。

3. 上級 JavaScript コースを受講してください (JavaScript: The Hard Parts, v2)。これは、高度な概念を理解し、コードをデバッグするのに役立ちます。

4. FrontendMentor で 1 ～ 3 つの中間プロジェクト をビルドします (中間プロジェクト リスト)。 API と非同期操作を必要とするプロジェクトに焦点を当てます。

5. React を学習します。 FrontendMasters の「完全な React 入門」コースから始めてください。執筆時点での最新のものは、Complete Intro to React、v8.

6. FrontendMentor で React を使用して 1 ～ 3 つのプロジェクトをビルドします。 React を使用して以前のプロジェクトを再構築して、その利点を確認してください。

7. React の知識を深めましょう:

* Read the [React documentation](https://react.dev).

* Check out [Intermediate React, v5](https://frontendmasters.com/courses/intermediate-react-v5/).

* Grab my free e-book with **101 React Tips & Tricks** [here](https://www.frontendjoy.com/p/download-my-free-101-react-tips-tricks-book).

* (Bonus): I highly recommend the [Advanced React](https://www.advanced-react.com/) book.

オプション 2: 無料ツールを使用する (7 ステップ)

有料リソースを購入する余裕がない場合でも、心配する必要はありません。フロントエンド開発を効率的に学ぶことができます。

私がお勧めするものは次のとおりです:

1. FrontendMasters の無料の フロントエンド開発ブートキャンプに従ってください。アカウントを作成する必要があります。プロジェクトを進めながら構築します。これが学習の鍵です。

2. FrontendMentor で 1 ～ 2 つのジュニアレベルのプロジェクトを構築します。苦労することもプロセスの一部です。Google、ChatGPT を使用するか、助けを求めてください。

3. JavaScript をマスターするには、 JavaScript.info を使用してください。これは包括的な無料リソースです。

4. FrontendMentor で 1 ～ 3 つの中間プロジェクト をビルドします (中間プロジェクト リスト)。 API と非同期操作を含むプロジェクトに焦点を当てます。

5. React を学習します。 React のクイック スタートに進み、チュートリアルに従います。

6. FrontendMentor で 1 ～ 3 の React プロジェクトをビルドします。 React を使用して以前のプロジェクトを再構築して、学んだことを強化します。

7. React の知識をレベルアップします:

* Read the [React documentation](https://react.dev).

* Check out [Intermediate React, v5](https://frontendmasters.com/courses/intermediate-react-v5/).

* Grab my free e-book with **101 React Tips & Tricks** [here](https://www.frontendjoy.com/p/download-my-free-101-react-tips-tricks-book).

* (Bonus): I highly recommend the [Advanced React](https://www.advanced-react.com/) book.

概要

これらの手順に従えば、フロントエンド開発に慣れただけでなく、次のことができるほど自信が持てるようになります。

• 分からないことは Google で調べてください。

• AI ツールを使用してコーディングを支援します。

• Next.js などの高度なフレームワークに取り組みます。

学習のほとんどは実践から得られるので、構築を続け、実験を続け、そして最も重要なことに、継続し続けてください。

?思考の糧

それはラップですか?.

コメントを残しますか?あなたが犯した間違い (そしてそれをどのように克服したか) を共有します。

「???」を忘れずに入力してください。

React を学習している場合は、私の 101 React ヒントとコツの本を 無料

でダウンロードしてください。

このような記事が気に入ったら、私の無料ニュースレター、FrontendJoy

にご参加ください。

毎日のヒントが必要な場合は、X/Twitter で私を見つけてください。 <script> // Detect dark theme var iframe = document.getElementById('tweet-1859869939533816068-530'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1859869939533816068&theme=dark" } </script>

以上が✨ フロントエンド開発を怠惰な方法で勉強する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。