本連載FE入門 - 未経験からコーダーではなくフロントエンドエンジニアになるために - では
未経験からフロントエンドエンジニアになるための最短ルートを提示し
そこに到達するまでの内容を記事として紹介していきます。

連載トピックス

• フロントエンドの用語集
• 連載についての紹介
• 第1章 マインドや道筋の理解
• 第2章 必要スキルの学習
• 第3章 アプリケーション構築
• 第4章 チーム開発やプロダクト開発の理解
• 第5章 これからのキャリア

想定読者

• フロントエンドエンジニアを目指す方
• 未経験からエンジニアへ転職を考えている方
• 未経験からプログラミングを学ぼうと考えている方
• エンジニアを目指す学生の方

連載についての紹介

今回から
FE入門 - コーダーではなくフロントエンドエンジニアになるために -
という内容で連載を開始いたします。

今回は連載内容について

• 連載の背景
• 目的
• 連載内容
• 学んでいく上で大切なこと

について紹介をいたします。

フロントエンドエンジニアの定義

この連載で利用するフロントエンドエンジニアという言葉の定義ですが
コーダーやマークアップエンジニアではありません。
Webアプリケーションを開発するフロントエンドエンジニアを指します。

連載の背景

フロントエンドエンジニアを目指しにくい状況

フロントエンドエンジニアが圧倒的に足りません。
その理由の一つに フロントエンドエンジニアになるための情報が散漫していて
目指したい人が目指しにくい状況があるのではないかと考えました。

フロントエンドエンジニアになるための情報がまとまっていない

Googleで検索をかけるとフロントエンドエンジニアに関わる情報はたくさんヒットします。

• 技術の入門記事
• 転職の支援サイト
• 現役エンジニアのエピソード
• コーダーを目指すための情報

しかしこれらの情報の中に
フロントエンドエンジニアを目指すための内容がまとまっているものはありませんでした。

フロントエンドエンジニアへ目指しにくい状況の解決

情報がまとまっていないため

どこから始めたらいいのか
何をどこまでやったらいいか

これらがわからないことで苦労をしている方が
たくさんいらっしゃるのではないかと考えています。

このように目指したい人が目指しにくいといった状況を
解決していくことが必要であると考えています。

連載の目的

フロントエンドエンジニアを目指したい人が
目指しやすい状況を作ることです。

連載の概要

目的を達成させるために
フロントエンドエンジニアになるための道筋と
そこに至るまでにどう進めたらいいかを
現役エンジニアである私の経験をもとに具体的に示した記事を作成していきます。

連載内容の選定

連載内容はroadmap.shというコミュニティが公開している
フロントエンドのロードマップの情報から抜粋し
現役のエンジニアである私の経験や考えを具体的な捕捉として加えながら紹介していきます。

学習時間目安

おおよそ180時間

未経験からフロントエンドエンジニアを目指す内容となっています。

やり切るまでに必要な時間としては180時間を想定していて
毎日8時間フルで取り組んでも1ヶ月くらい
働きながら1時間くらいずつ取り組むと半年くらいかかる内容になります。

連載の内容

5つのトピックに分けて連載していきます。

• 第1章 マインドや道筋の理解
• 第2章 必要スキルの学習
• 第3章 アプリケーション構築
• 第4章 チーム開発やプロダクト開発の理解
• 第5章 これからのキャリア

第1章 マインドや道筋の理解

フロントエンドエンジニアを目指すためのマインドと
道筋を理解し全体感を掴んでいただく内容になります。

• フロントエンドエンジニアとは？
• フロントエンドエンジニアを目指すべき理由
• フロントエンドエンジニアへのロードマップ
• フロントエンドエンジニアを目指すために必要な考え

第2章 必要スキルの学習

ロードマップの中から最低限必要なスキルをピックアップし
そのスキルについて学習していただく内容になります。

加えて自身で問題解決していく考え方や効率的な学習手順についても学んでいきます。

• HTMLの学習
• CSSの学習
• JavaScriptの学習
• Gitの学習
• React.jsの学習
• TypeScriptの学習

第3章 アプリケーション構築

自身のスキルを伝えるポートフォリオサイトを構築していきます。 この過程を通して構築に必要な知識や公開に必要な手順を学んでいきます。

• ポートフォリオとは？
• 機能要件の定義
• 管理画面を作成
• SPA（シングルページアプリケーション）で画面を実装
• アプリケーションのデプロイ

第4章 チーム開発やプロダクト開発の理解

さまざまな開発体系についてからスタートし
チーム開発に必要な考え方やプロダクト開発における役割などを紹介していく内容となっています。

• さまざまな開発体系
• チーム開発のコミュニケーション
• コードを保守していく必要性
• コードレビューについて
• プロダクト開発における役割

第5章 これからのキャリア

フロントエンドエンジニアで歩むキャリアについて紹介していく内容となっています。

• 自らのチューニング
• さまざまな働き方
• 今後の方向性

連載の活用について

この連載は未経験からフロントエンドエンジニアを目指す道筋として
必要な情報をピックアップしていきます。

活用についてはさまざまな形で活用いただければと考えています。

• フロントエンドエンジニアを目指す指南書としての活用
• 現役エンジニアが内容を再インプットするためのツールとしての活用
• 気になるスキル分野に絞った学習への活用

学んでいく上で大事なこと

エンジニアの意義

学んでいく上で大事な考え方として
エンジニアの意義があります。

エンジニアの意義は技術を通した問題解決を行うことであると考えています。

エンジニアに求められること

エンジニアに求められることは
自身で考えて問題解決していく力です。

何か行き詰まったことがあったら
まず考えて欲しいと思います。

別の手段を検討したり、さまざまな角度から試行錯誤したりと
どうしたら解決できるのかを深く考えることが大事です。

プログラミングスクール・書籍・学習サイトは補助ツール

学習を進める上で
この連載やプログラミングスクールや書籍そして学習サイトは
あくまで自分自身の学習の補助ツールと考えます。

実際に問題を解決していくのは自分自身であるということを
しっかりと理解いただきたいと思います。

メンターに教えてもらうことは考え方

学習をサポートしてくれるメンターという存在についても捕捉させていただくと
メンターに教えてもらうことはあくまで考え方です。

人から得た答えをそのまま利用しても自分自身の成長にはなりません。

優秀なメンターは
メンティーが自ら答えを導き出せるように
考えのヒントを与えてくれるはずです。

答えのない問題の答え作りへ

これら考えを軸にしてこれから学んでいって
いただければと考えております。

この連載をきっかけに
答えのない問題に対して
自分自身で答えを作り出していきましょう。