プログラミングエンジニアになる継続的な学習ロードマップ

エンジニアのキャリアパス 資格
エンジニアのキャリアパス

きょうは、プログラミングを学んでエンジニアになるまでを学びます。

どのように学習して、どこまでの範囲を、どこへ就職、こういったことが具体的にわかっていたら迷うことないですよね。

これらを明確に打ち出して全体を見て個別に学習し、その後の就職まで抜群の具体性で再現していきたいですね。

まるで風呂の栓がとれたみたいに周りの雑学が一挙に集約していきます。

きょうはあなたと、そのロードマップについて学習します。

1.プログラミング言語

プログラミング言語
プログラミング言語

よくありがちな間違った学習法があります。

便利な部分だけ、使いたい部分だけ学ぶのは基本をおろそかにしています。たとえば、jQuery を学んでいるけど、JavaScript はそんなに学んでいないとかです。というのは、これだけ技術の進化が速いとその上の部分の技術は使われなくなるんです。

早い話がガラケーが10年でスマホに置き換わったように、ガラケーの技術が使われなくなってしまったのです。

そんなに変化してゆく技術なら何をやればいいの?と思われがちですが実は、基礎の部分はそれほど変わらないのです。ガラケーからスマホに変わってもアプリの動く仕組みはそんなに変わっていないのです。

1.時代が変わっても変わらない部分、「基礎」をしっかり学ぶこと

taka
taka

理論・設計・原則の部分です。ここを学ぶのは「本」です。

私も本はよく借りたり買ったりしますが、なかなかこれといった本に出合うのは少ないです。その本を読んだ人の体験談があれば当たり外れがないではないですか。その体験談が「山鋪清透」さんなら間違いがないと思って列記してみました。

正直これらの本で「これは良い本」というか定評のある本がありますが、まだ読んでないのがほとんどです。実は「体系的に学ぶ~」の徳丸本はいつになったら読めるようになるのか?と思うようなレベルだと思うのです。これらを読破できるようになりたいと思っています。

ここで大事なのは「言語仕様」までわかることです。
Ruby と PHP なら「プロを目指す人のための Ruby 入門」です。

2.コードの書き方

読みやすいコードを書くための教科書です。「リーダブルコード」

コードの品質が悪いと開発環境も悪くなります。それはソフトエンジニアが「悪いコードとは何か? どういうコードが理想的かを知らないことから来ます。プログラミングの文法がわかるだけでは、きれいなソースは中々書けないのです。

正しい知識がないと、こういった場当たり的なコードを書いてしまいがちです。良いコード悪いコードがどういうものか知っていれば、こういう問題に対処できます。最初から読みやすく、より開発しやすいコードを書き、問題点を見直すことができます。

良いコードに書き換える技術が多数紹介され、ソースコードのコメントはどう書けばいいのか、変数名や関数名はどういうものにすると理解しやすいかを例とともに示します。

3.データベース

データベースとは、構造化した情報またはデータの組織的な集合であり、通常はコンピューターに格納されています。データベースは通常、管理システム(DBMS)で制御します。それらに関連するアプリケーションをまとめてデータベース・システムと呼びます。

データベースの設計がが悪いと開発が難しくなったりパフォーマンスが悪くなります。構造、テーブル設計、SQL の書き方を押さえておく必要があります。これは長く使える技術です。

「実践ハイパフォーマンス MySQL」

MySQL Database Serviceは、世界で最も人気のあるオープンソースデータベースを使用してクラウドネイティブアプリケーションを構築するためのフルマネージドデータベースサービスです。

MySQL がどんなふうに動作するかという原理を説明しています。

4.SQL

taka
taka

SQL と MySQL はちがうものだよ。

MySQLはシステム(データベース管理システム)のひとつでデータベース管理システムは他にもありますが、SQLはデータベース管理システムで利用される言語です。アマゾンなどのデータベースからデータを抽出する際に使用するプログラミング言語です。

SQL(Structured Query Language)は、データベース管理システム(DBMS)で使用される標準的なクエリ言語です。SQLはデータベースの操作や管理を行うための言語であり、データの取得、挿入、更新、削除などの操作を行うための文法とコマンドが定義されています。SQLはデータベースシステムに依存せずに使われることができ、多くのデータベースシステムがSQLをサポートしています。

一方、MySQLはリレーショナルデータベース管理システム(RDBMS)の1つであり、データベースシステムの実装の1つです。MySQLはSQLを使用してデータベースの操作や管理を行いますが、MySQL自体がSQLを実行するためのソフトウェアです。MySQLはオープンソースであり、高速かつ信頼性の高いリレーショナルデータベースサーバーとして広く使用されています。

つまり、SQLはデータベースの操作や管理を行うためのクエリ言語であり、MySQLはSQLを実行するためのデータベース管理システムの1つです。他にも、Oracle、Microsoft SQL Server、PostgreSQLなど、さまざまなデータベースシステムがSQLをサポートしています。

データを常に取り扱っているので、例えば EC サイトなら在庫やお客様のデータとか、そのデータを扱う時に取り出して使います。

データベースの中にはテーブルがあります。エクセルのシートのようなものです。

「SQL アンチパターン」

アンチパターン、つまり「こういうのは良くないよ」というパターンがまとまっています。

「達人に学ぶSQL徹底指南書」

入門書ではありません。いかに良いSQL を書くかという本です。

5.Linux

Linuxは無料で利用できます。Linuxはオープンソースのオペレーティングシステムであり、自由に使用、改変、配布することができます。これはGNU General Public License(GPL)や他のオープンソースライセンスの下で提供されているためです。

Linuxはさまざまなディストリビューション(ディストロ)と呼ばれるバリエーションが存在します。これらのディストリビューションは、Linuxカーネルをベースにして独自のパッケージやツールを追加し、利用者に提供します。多くのLinuxディストリビューションは無料で入手でき、個人や企業は無償でLinuxを使用することができます。

ただし、商用のサポートや追加の機能、専門的なトレーニングなどを必要とする場合は、一部のディストリビューションやサービスプロバイダーから有料のサポートやサービスを購入することもできます。しかし、基本的なLinuxの利用には通常、料金はかかりません。

WindowsOS をインストールするのには1台20,000円前後しますが、Linux なら費用がいりません。無料で使えるのがメリットです。Word と Excel には互換用のソフトウェアもあります。

サーバーのOS に使われているので Linux を使えないとできることが大幅に制限されてしまいます。コマンドラインでできるようになります。Linux の知識がないと作業ができません。

ディレクトリの構造、基礎的なコマンドですね。この技術も長く使えます。

「新しい Linux の教科書」

taka
taka

ネットワークは、複数のコンピュータやデバイスが相互に接続され、データや情報をやり取りするための仕組みです。

6.ネットワーク

Web アプリを作るとき、パソコンやスマホからアクセスして、サーバーの方にアクセスが来てデータを返して Web ページが表示されます。そのネットワークを通じで通信が行き来しているわけです。

  1. ネットワークトポロジー(Network Topology): ネットワークトポロジーは、ネットワーク内のコンピュータやデバイスの配置方法や接続方法を表します。よく知られたトポロジーには、スター型、バス型、リング型、メッシュ型などがあります。
  2. ネットワークメディア(Network Media): ネットワークメディアは、データがネットワーク上を伝送されるための物理的な媒体です。有線接続では、ツイストペアケーブルやファイバーオプティックケーブルなどが使用されます。無線接続では、電波を利用します。
  3. プロトコル(Protocol): ネットワーク上でコンピュータやデバイスが相互に通信するためには、共通のルールや手順が必要です。これらのルールと手順のセットをプロトコルと呼びます。例えば、インターネットで広く使用されるTCP/IP(Transmission Control Protocol/Internet Protocol)は、ネットワーク通信のための基本的なプロトコルです。
  4. ネットワークデバイス(Network Devices): ネットワークデバイスは、ネットワーク上でデータを送受信するために使用される機器です。一般的なネットワークデバイスには、ルータ、スイッチ、ハブ、ネットワークアダプタ(ネットワークカード)、モデムなどがあります。これらのデバイスは、データの経路の制御や通信の管理を行います。
  5. IPアドレス(IP Address): ネットワーク上のコンピュータやデバイスは、IPアドレスと呼ばれる一意の識別番号を持っています。IPアドレスは、ネットワーク上の特定のデバイスを識別するために使用されます。
  6. ルーティング(Routing): ネットワーク上のデータは、送信元から宛先までの最適な経路を通って伝送されます。この経路の選択とデータの転送を行うのるのがルーティングです。ルータはネットワーク上のデータパケットを受け取り、宛先のIPアドレスに基づいて最適な経路を選択し、次のノードに転送します。
  7. ネットワークセキュリティ(Network Security): ネットワークセキュリティは、ネットワーク上のデータや通信を保護するための対策です。セキュリティの実現には、ファイアウォール、暗号化、アクセス制御、脅威検知システムなどが使用されます。
  8. プロトコルスタック(Protocol Stack): ネットワーク通信では、さまざまな階層のプロトコルが使用されます。TCP/IPプロトコルスタックは、ネットワーク通信の基本的なプロトコル群であり、物理層、データリンク層、ネットワーク層、トランスポート層、アプリケーション層などの階層から構成されます。

以上がネットワークの基本的な仕組みの概要です。ネットワークは、コンピュータやデバイスの相互接続を可能にし、データや情報の共有や通信を実現します。

この仕組みを知っておくことがすごく重要です。自分がどこで作業してどういう仕組みになっているのかわからないからです。障害が起こったときにどこが原因かがわかりません。

マスタリング TCP/IP
マスタリング TCP/IP

インターネットにおける機器同士の通信方法の基本を定めた規格を「インターネット・プロトコル」といいますがその頭文字をとって IP といっています。

IP アドレス

ネット通信の機器に割り当てられる番号で、通常は0~255の数字を4つ組み合わせて表現されます。ネット通信の「送信者」や「受信者」を指定するために使われる「電話番号のようなもの」です

IP アドレスはインターネット全体で管理されています。各国や地域、企業や大学に小分けされ、最終的にパソコンやスマホなど、1個ずつアドレスが割り当てられます。

ネット接続する場合は、契約しているプロバイダーなどが通信開始時に割り当てます。ルーター経由で通信する家庭内 LAN 型では、外線(WAN)側に接続しているルーターに IP アドレスが割り当てられ、内線(LAN)側では内部のみ有効なアドレスをルーターが割り当てるのが一般的です。

サービス提供者が通信記録やプロバイダの割り当て記録などをたどれば、利用者側の IP アドレスを特定できます。

「ネットワークはなぜつながるのか」

taka
taka

ウィルスの感染を防ぐためには、以下の対策を取ることが重要です

7.セキュリティ

  1. セキュリティソフトウェアの使用: コンピュータやデバイスに信頼性の高いセキュリティソフトウェア(アンチウイルスソフトウェア)をインストールし、定期的にアップデートを行いましょう。セキュリティソフトウェアは、ウイルスやマルウェアを検出し、削除する役割を果たします。
  2. ソフトウェアのアップデート: オペレーティングシステム、アプリケーション、ブラウザなどのソフトウェアを最新のバージョンにアップデートしましょう。アップデートにはセキュリティパッチや修正が含まれることがあり、これにより既知の脆弱性やセキュリティ上の問題が解消されます。
  3. メールの添付ファイルやリンクの注意: メールの添付ファイルやリンクは、不審な場合や送信元が信頼できない場合には開かないようにしましょう。特に、不明なファイルや怪しいリンクをクリックしないようにすることが重要です。
  4. 安全なウェブサイトの利用: ウェブサイトの訪問時には、信頼できるサイトを利用しましょう。不審なウェブサイトや怪しい広告からのクリックを避け、セキュリティの確保されたHTTPS接続を使用するようにしましょう。
  5. ファイアウォールの利用: ファイアウォールは、ネットワークやインターネット上の不正なアクセスを監視し、制御する役割を果たします。コンピュータやネットワークにファイアウォールを導入して、不正アクセスの防止に役立てましょう。
  6. バックアップの作成: データやファイルの定期的なバックアップを作成し、別の場所に保存することで、ウイルス感染やデータの喪失に備えることができます。
  7. ユーザー教育と意識の向上: ウイルスやマルウェアの感染を防ぐためには、ユーザー自身のセキリティ意識を高めることも重要です。定期的なセキュリティ教育やトレーニングを受け、不審なファイルやリンクに注意し、安全なインターネットの利用方法を学ぶことが大切です。

これらの対策を組み合わせることで、ウイルスやマルウェアの感染リスクを最小限に抑えることができます。ただし、完全なセキュリティは存在せず、常に新たな脅威が出現する可能性があるため、最新のセキュリティ情報にアクセスし、セキュリティ対策を継続的に更新することが重要です。

「安全なWeb アプリケーションの作り方」。原理と対策について学べます。現場に出れば初心者とかベテランとかじゃなくていったん個人情報なんかが漏れてしまったら会社に大損害を与えるわけです。

サービス提供者側の通信記録では、通信相手が遠隔操作されているかどうかまでは区別できません。現在のパソコンは、設定が適切なら、外部から遠隔操作を指示されても受け付けません。

ところがウィルスに感染すると、パソコン側から「遠隔操作してください」と発信してしまいます。ウィルスを見つけない限り、電話でいえば「意図せずに自分の電話をかけさせられてしまう」状態になってしまいます。

防御方法は、ウィルスの感染を防ぐのが大原則です。統合セキュリティ対策ソフトを導入し、更新をかかさないことです。また出所がはっきりしないオンラインソフトのインストールや、接続先がわからないウェブサイトへのリンクのクリックは安易に行わないといった自衛が必要です。

mika
mika

ウィルス感染を防ぐには、更新、インストール、リンクには十分注意することね。

8.サーバーサイド

高性能なコンピュータのことです。どういう学習教材を用いて行うか。目標としてはレベルの高いポートフォリオを作ります。「こういったものが作れます!」というメッセージになります。

顧客側のコンピュータをクライアントサイド、サービス側のコンピュータをサーバーサイドと呼んでいます。RDBMS が今主流です。

サーバーサイドにはWeb アプリとデータベースの2種類があります。アプリは Word Excel Web アプリには Chrom とかのことです。DB には MySQL とかがあります。

HTML/CSS を何はともあれやっておきます。HTML は文字情報です。CSS はその文字をデザインします(JavaScript は動きをつけます)。これらの情報をブラウザが受け取ります。

リクエストを送り返すときのプロトコルは HTTPS SSL があります。HTTPS はインターネットの通信の取り決めをしたものです。その情報を第三者が見れることができるので暗号化したものが
SSL です。

HTML,CSS,JavaScript,画像をフロントエンド、サーバーの方をバックエンドといいます。フロントエンドにはライブラリとフレームワークがあります。ライブラリは、例えば椅子・家具・食卓とうのことで、フレームワークは家全体のことでしょうか。

サーバーサイドは、まず OS を選択します。次にプログラミング言語を選んでいきます。JAVA とか PHP,Python などです。これもフレームワークで書かれることが多くなりました。

Ruby なら Rels,PHPなら Lalabel,Python ならJunbo あたりが多いです。

2.学習ロードマップでサイトを1つ模写

サイトを模写
サイトを模写
taka
taka

プログラマーになるためには模写は非常に有益な学習方法の一つです。

他の人の作成したウェブサイトやアプリケーションのコードを読み、理解し、自分で再現することで、実際の開発に関わる経験を積むことができます。

1.模写を通じてのメリット

  1. コーディングスキルの向上: 他の人のコードを読みながら、そのロジックやデザインの考え方、実装方法を学ぶことができます。より実践的な経験を積むことで、自分のスキルを向上させることができます。
  2. ベストプラクティスの学習: 優れたウェブサイトやアプリケーションは、ベストプラクティスに基づいて作られています。他の人のコードを模写することで、良い設計やコーディングのベストプラクティスを学ぶことができます。
  3. 新しい技術やフレームワークの習得: 他の人が作成したウェブサイトやアプリケーションは、さまざまな技術やフレームワークを使用している場合があります。それらを模写することで、新しい技術やフレームワークを習得する機会を得ることができます。

ただし、模写を行う際にはいくつかの注意点もあります:

  1. 著作権に配慮する: 他の人の作成物を模写する際には、著作権に注意してください。公開されているオープンソースのプロジェクトや教育目的で公開されているサンプルコードを使用することが望ましいです。
  2. 理解を重視する: 単にコードをコピー&ペーストするのではなく、コードの意味や背後にある理論を理解することが重要です。コードを読み解きながら進めることで、より深い理解を得ることができます。
  3. 自己のアイデアや改善点を追加する: 模写するだけでなく、自分なりのアイデアや改善点を追加することで、よりオリジナルな成果物を作り出すことができます。

模写はプログラミングスキルの向上に役立つ手法ですが完全に依存してしまわず、他の学習方法と組み合わせることが重要です。例えば、模写を通じて学んだ知識やスキルを活かして、自分自身のプロジェクトを作成するなど、実践的な経験を積むことも重要です。

また、模写を通じて学ぶだけでなく、関連するドキュメントやチュートリアルを読み、理論的な知識を深めることもおすすめです。

模写は自分自身の学習とスキル向上のための手段であるため、他の人の作品を模倣することに留まらず、独自のアイデアやプロジェクトに取り組むことも大切です。

mika
mika

自分自身のスキルやアイデアを発展させるために、模写をツールとして上手に活用してください。

Ruby/PHP の内どれか1つ

  • Ruby:Progate/プロを目指す人のための Ruby 入門
  • PHP:Progate/PHP本格入門

ボーリングゲーム作成

Linux

  • Udemy「もう怖くない Linux コマンド」

2.Git/GitHub

ソースコードのバージョンを管理するものです。変更の履歴を記録して GitHub とかにアップしてプルリクしてレビューしてもらってからその変更を取り入れるフローに開発はなっています。

GitとGitHubは、プログラミングやソフトウェア開発におけるバージョン管理システムです。以下でそれぞれの概要と役割について説明します。

Git: Gitは分散型のバージョン管理システムです。開発者がソースコードやファイルの変更履歴を追跡し、複数の人々が同じプロジェクトに協力して作業する際に便利です。

Gitの主な機能

  • ローカルリポジトリ: プロジェクトの変更履歴を保存するためのローカルなデータベースです。
  • コミット: ファイルの変更履歴を記録する操作です。コミットにはメッセージやタイムスタンプが含まれ、変更の意図や目的を記述することができます。
  • ブランチ: プロジェクトの変更履歴を分岐させるための機能です。複数のブランチを作成し、それぞれで独立に作業を進めることができます。
  • プッシュとプル: リモートリポジトリとのデータのやりとりを行うための操作です。変更をリモートリポジトリにプッシュしたり、他の人の変更をプルしたりすることができます。

GitHub: GitHubは、Gitをベースにしたリモートのバージョン管理プラットフォームです。GitHubを使用することで、プロジェクトをオンライン上でホストし、複数の開発者が共同で作業することができます。

GitHubの主な機能

  • リポジトリのホスティング: プロジェクトのコードやファイルをオンライン上で保存・管理することができます。他の開発者との共同作業も容易になります。
  • コードレビュー: コードの変更をチームメンバーや他の開発者によってレビューすることができます。コメントや修正要求を通じてコードの品質向上やバグ修正を行うことができます。
  • 問題追跡: バグや機能のリクエストなどの問題を追跡するための機能があります。開発者やユーザーからのフィードバックを整理し、タスクを管理することができます。
  • プルリクエスト: コードの変更をマージする前に、変更内容を他の開発者に通知し、レビューを受けるための機能です。プルリクエストを通じて、コードの品質向上やチームメンバーのフィードバックを取り入れることができます。

GitとGitHubを組み合わせることで、個々の開発者やチームは効果的なバージョン管理と共同作業を行うことができます。Gitを使ってローカルで作業し、変更履歴を管理し、必要に応じてGitHubを使用してリモートリポジトリとの同期や共同作業を行うことが一般的です。

注意点としては、GitやGitHubの操作やワークフローに慣れるために、関連するドキュメントやチュートリアルを学習することが重要です。また、GitやGitHubのコマンドラインインターフェースやGUIツールの使い方を理解し、効果的に活用することも推奨されます。

GitやGitHubの使い方や概念については、公式ドキュメントやオンラインのチュートリアルなどを参考にすると良いでしょう。

  • Udemy「もう怖くない Git!」
mika
mika

さらに実際にプロジェクトで使ってみることで、より深い理解と経験を積むことができます。

3.MySQL/SQL

「おうちで学べるデータベースのきほん」

Rails/Laravel

  • Ruby on Rails チュートリアル
  • Laravel 公式ドキュメント

Web の仕組み

「プロになるための Web 技術入門」

4.ポートフォリオ作成

いわゆる「作品集」であり、自分の職種における実績や力量を評価してもらうために作成する資料です。ですからまずアピールする内容を決めなくてはいけません。

次にそのサービスを証明する方法を決めます。人に使ってもらえる内容にしないといけません。さらにサービス内容を決めることです。そして仕様を作成します。ワイヤフレームです。

さらに非機能要件を決めます。スピードを上げたい、セキュリティをしっかりしたい、ディフロイを簡単にしたいとかです。そして使用技術を選定します。

プログラミング言語を何にするか、データベースは、インフラは何にするかの3つぐらいはここで決めて行きます。

そして設計です。つぎにページを作成します。それからインフラを構築します。最後に機能追加して、使ってもらいます。

5.AWS

「ゼロから実践する Amazon Web Services」

転職活動スタート

3.プログラミングエンジニアへのステップアップ

ステップアップ
ステップアップ

1.Docker

taka
taka

「ドッカー」って何だ?

Dockerは、コンテナ仮想化を利用してアプリケーションやサービスを独立した環境で実行するためのオープンソースプラットフォームです。Dockerを使用すると、アプリケーションやその依存関係、設定などをコンテナと呼ばれる軽量な仮想環境にパッケージ化することができます。

以下にDockerの主な特徴をいくつか挙げます。

  1. コンテナ化: Dockerは、コンテナと呼ばれる軽量な仮想環境を提供します。コンテナは、アプリケーションとその依存関係、ライブラリ、設定などを含むパッケージであり、異なる環境でも一貫した動作をすることが特徴です。
  2. ポータビリティ: Dockerコンテナは環境に依存しないため、ほぼどんな環境でも動作させることができます。開発者や運用チームは、開発環境から本番環境まで、同じコンテナイメージを使ってアプリケーションをデプロイし、再現性と一貫性を確保できます。
  3. 効率的なリソース利用: DockerはホストOSのカーネルを共有するため、仮想マシンに比べて軽量で高速に動作します。また、Dockerイメージはレイヤー化されており、再利用や共有が容易です。これにより、開発者やチームはコンテナイメージを素早く作成し、デプロイすることができます。
  4. スケーラビリティと分散処理: Dockerはコンテナ単位でアプリケーションをスケーリングすることができます。複数のコンテナを使ってアプリケーションを分散処理することで、負荷分散や高可用性を実現することができます。
  5. インフラストラクチャのコード化: Dockerはインフラストラクチャをコードとして管理するためのツールや仕組みとも統合されています。Dockerコンテナを使ってアプリケーションをデプロイするための設定や手順をコードとして管理し、インフラストラクチャの自動化やスケーラビリティの向上を実現することができます。

Dockerの利点は、アプリケーションの開発、テスト、デプロイの効率化や一貫性の向上、環境の柔軟性とポータビリティなどです。また、Docker Hubという公式のイメージレジストリや、Docker Composeを使った複数のコンテナの管理など、さまざまなツールやエコシステムが提供されています。

プログラマーにとっては、Dockerを使って開発環境をコンテナ化したり、アプリケーションのデプロイやテストを容易にしたりすることができます。さらに、Dockerを使った開発手法や環境の構築は、チーム間のコラボレーションや継続的インテグレーション/デリバリー (CI/CD) パイプラインの構築にも役立ちます。

Dockerの学習には公式ドキュメントやチュートリアルがありますので、興味があればそれらを活用してみてください。

mika
mika

また、実際にDockerを使ってプロジェクトを進めることで、より実践的な知識と経験を得ることができます。

「Docker/Kubernetes 実践コンテナ開発入門」

「体系的に学ぶ安全な Web アプリケーションの作り方」

学習計画を立てる

基礎学習は2カ月で完了。3カ月目からはポートフォリオを作り始めましょう。5カ月目からは
AWS で公開できるようにします。

4.フロントエンドエンジニアになるには

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

フロントエンドエンジニアになるためには、以下の手順を参考にすることができます。

  1. 基礎知識の学習: HTML、CSS、JavaScriptなど、フロントエンド開発に必要な基本的な技術を学びましょう。オンラインのチュートリアル、コース、書籍などを利用して、自己学習を進めることができます。
  2. 実践的なプロジェクト: 学んだ知識を実際のプロジェクトに適用してみましょう。自分でウェブサイトやウェブアプリケーションを作成することで、実践的な経験を積むことができます。
  3. フレームワークやツールの学習: フロントエンド開発には多くのフレームワークやツールが利用されています。代表的なものにはReact、Angular、Vue.jsなどがあります。これらのフレームワークやツールを学ぶことで、効率的な開発が可能になります。
  4. ポートフォリオの構築: 自分の作品やプロジェクトをまとめたポートフォリオを作成しましょう。これにより、将来の雇用主やクライアントに自分のスキルや能力をアピールすることができます。
  5. コミュニティ参加: フロントエンド開発のコミュニティに参加し、他の開発者との交流や情報共有を行いましょう。イベントやカンファレンスに参加することで、業界の最新動向を把握することができます。
  6. 雇用主やクライアントとの面接: フロントエンドエンジニアとしての職務を担うために、雇用主やクライアントとの面接を受けることがあります。面接では、自分のスキルや経験を適切に伝えることが重要です。
  7. スキルの継続的な学習: フロントエンド開発は急速に進化している分野です。新しい技術やトレンドに対して敏感であり、継続的な学習が求められます。定期的に最新の情報を追いかけ、スキルを向上させるよう心がけましょう。

以上の手順を進めるこてフロントエンドエンジニアになるための一般的なガイドラインです。ただし、個人の学習スタイルや背景によって最適な方法は異なる場合もあります。自分に合った学習方法やプロジェクトを見つけることが重要です。

また、フロントエンドエンジニアとしての実務経験を積むためには、インターンシップや実務プロジェクトへの参加も検討してみてください。


「改定新版 JavaScript 本格入門」

「Web 制作者のための Sass の教科書」

1.Git/GitHub

  • Udemy「もう怖くない Git!」

ポートフォリオ(Web サイト)作成

ホスティング

  • Netlify:公式ドキュメント
  • Firebase:公式ドキュメント

転職活動スタート

React/Vue

  • 公式ドキュメント

Node.js/Firebase

  • dotinstall「Node.js入門」「Express 入門」
  • Firebase:公式ドキュメント

TypeScript

「プログラミング TypeScript」

2.Web の仕組み

taka
taka

Webの仕組みにはいくつかの主要な要素が含まれます。基本的なWebの仕組みを説明します。

  1. クライアントとサーバー: Webの仕組みでは、クライアント(ブラウザ)とサーバーの間で情報のやり取りが行われます。クライアントはユーザーが使用するデバイス(パソコン、スマートフォンなど)であり、サーバーはWebページやデータを提供するコンピューターです。
  2. プロトコル: Webの通信は、通常、Hypertext Transfer Protocol(HTTP)を使用して行われます。クライアントはHTTPリクエストをサーバーに送信し、サーバーはHTTPレスポンスをクライアントに返します。HTTPは、Webページの要求と応答のための規約です。
  3. クライアントサイドとサーバーサイド: Web開発では、クライアントサイドとサーバーサイドの2つの側面があります。クライアントサイドは、ユーザーのブラウザで実行されるコード(HTML、CSS、JavaScript)を指します。一方、サーバーサイドは、サーバー上で実行されるコード(一般的にはサーバーサイドスクリプトやデータベースの操作)を指します。
  4. HTML、CSS、JavaScript: Webページの構造とコンテンツはHTML(Hypertext Markup Language)で記述されます。HTMLは、タグを使用して要素を定義し、階層的な構造を作ります。CSS(Cascading Style Sheets)は、Webページのスタイルやレイアウトを指定するために使用されます。JavaScriptは、Webページの動的な動作やインタラクティブな機能を実装するためのプログラミング言語です。
  5. レスポンシブデザイン: レスポンシブデザインは、異なるデバイスや画面サイズに適応するための設計手法です。HTMLとCSSを使用して、要素のサイズや位置、表示方法を適切に制御し、ユーザーがさまざまなデバイスで最適な表示を得られるようにします。
  6. クライアントサイドスクリプティング: JavaScriptを使用して、クライアントサイドでの動的な操作やユーザーとのインタラクションを実現できます。例えば、ユーザーの入力に応じてコンテンントを変更したり、フォームの検証を行ったり、アニメーションを追加したりすることができます。
  7. サーバーサイドプログラミング: サーバーサイドでは、サーバーサイドスクリプト(例: PHP、Python、Ruby)やフレームワーク(例: Node.js、Django、Ruby on Rails)を使用して、データベースの操作やビジネスロジックの処理を行います。ユーザーからのリクエストに応じてデータを取得・保存したり、処理を実行したりすることができます。
  8. データベース: Webアプリケーションでは、データの永続性を確保するためにデータベースが使用されます。データベースは、サーバー上でデータを格納し、必要な時にデータの検索や変更を行うための仕組みです。一般的なデータベースの種類には、MySQL、PostgreSQL、MongoDBなどがあります。
mika
mika

これがWebの仕組みの概要です。これをもとに、より詳細な学習や特定の技術やフレームワークの習得に進むことができます。

「プロになるための Web 技術入門」

3.ポートフォリオ(SPA)作成

taka
taka

ポートフォリオって何だ?

ポートフォリオ(SPA)は、Web開発のコンセプトであり、SPAはSingle-Page Application(単一ページアプリケーション)の略称です。

従来のWebアプリケーションでは、ページ間の遷移ごとにサーバからの新しいHTMLを取得し、ページ全体がリロードされることが一般的でした。しかし、SPAでは、最初に必要なリソース(HTML、CSS、JavaScriptなど)を一度だけ読み込んでおき、その後はサーバとの通信を行いながら、動的にページの一部分だけを更新することができます。

SPAの特徴

  1. ユーザ体験の向上:SPAはリッチなユーザ体験を提供します。ページ遷移がスムーズで、ユーザが待ち時間を感じることが少ないため、応答性が高くなります。
  2. リソースの最適化:SPAは初回のリソースの読み込みが必要ですが、その後はサーバとの通信を介してデータをやり取りするため、ネットワークトラフィックを削減できます。
  3. クライアント・サーバの分離:SPAはフロントエンドとバックエンドを分離するため、開発の柔軟性を高めます。フロントエンドはJavaScriptフレームワーク(例:React、Angular、Vue.js)を使用して構築し、バックエンドはAPIを提供するだけに特化させることができます。
  4. モバイルアプリの開発:SPAは、ネイティブモバイルアプリと同様のユーザ体験を提供することができます。フレームワークやツールを使用して、SPAをモバイルアプリにパッケージ化することができます。

ポートフォリオ(SPA)は、このSPAのコンセプトを用いて、個人や企業の作品や成果物を効果的に表示するためのウェブアプリケーションです。ポートフォリオのSPAでは、リッチなユーザインターフェースやスムーズなページ遷移を実現し、ユーザが作品や成果物を簡単に閲覧できるようにします。

コードをきれいに書く

  • リーダブルコード

これでかなりの差別化になります。

4.プログラミングスクールに通うべきか?

taka
taka

お金に余裕がありますか? 80万前後します。

お金に余裕がない場合、プログラミングスクールに通うべきかどうかは、いくつかの要素を考慮する必要があります。以下の点に留意して判断することが重要です。

  1. 目標とニーズ: プログラミングスクールに通う主な目的やニーズは何ですか?自己学習だけでは達成できない特定のスキルや知識を得たいのか、就職やキャリアの転換を目指しているのか、それとも趣味としてプログラミングを学びたいのかを考えましょう。
  2. 自己学習の能力とモチベーション: プログラミングは自己学習できる分野でもあります。オンラインのリソースやチュートリアルを利用して基礎から学び、プロジェクトを通じて実践的な経験を積むことも可能です。自己学習に取り組む意欲や継続性を持っているかを考えてください。
  3. 予算と財務状況: プログラミングスクールには一定の費用がかかります。自分の予算や現在の財務状況を考慮し、プログラミングスクールに通うための費用を捻出できるかどうかを検討しましょう。また、スクールによっては奨学金や割引制度なども提供している場合がありますので、情報を集めてみると良いでしょう。
  4. 代替手段: プログラミングスクールに通うことができない場合、代替手段はありますか?オンラインの無料リソースやコミュニティ、ハッカソンなどのイベントへの参加など、予算をかけずにプログラミングスキルを向上させる方法も存在します。

これらの要素を総合的に考慮し、自分の状況に最も合った選択肢を見つけることが重要です。プログラミングスクールは有用な学習環境であり、指導者や仲間との交流を通じて学習の効果を高めることができますが、予算や他の学習方法も考慮に入れて判断してください。

なるべく早く転職したいか?

自分で学習できそうか?

プログラミングスクールを卒業しても就職できません。

卒業後、自分で学習しながらポートフォリオを作る必要があるのよね~。

5.IT 企業への就職活動編

就職活動
就職活動
taka
taka

IT企業に就職するための必勝法を以下に示します。

  1. スキルの習得と向上: IT企業では技術スキルが重要です。求人情報や市場の需要を調査し、求められるスキルを把握しましょう。プログラミング言語やフレームワーク、データベースなど、必要なスキルを習得し、実践的なプロジェクトを通じて経験を積むことが重要です。
  2. ポートフォリオの作成: IT企業への就職では、自身のスキルや実績を示すポートフォリオが有効です。GitHubや個人のウェブサイトなどで、自身が取り組んだプロジェクトやコードサンプルを公開しましょう。これにより、自分の能力をアピールすることができます。
  3. インターンシップやオープンソースプロジェクトへの参加: IT企業への就職を目指す場合、インターンシップやオープンソースプロジェクトへの参加は有益です。実務経験を積むことで、業界の実情やプロジェクトの進め方を学ぶことができます。また、そこでの成果やネットワークは就職活動において有利になる可能性があります。
  4. プロフェッショナルなネットワークの構築: ITコミュニティや業界のイベントに積極的に参加し、業界の専門家や他の開発者とのつながりを築きましょう。LinkedInやGitHubなどのプロフェッショナルなネットワーキングサイトを活用し、自身のプロフィールを充実させましょう。ネットワークは情報や機会の共有、内部推薦などで就職活動において役立ちます。
  5. 履歴書と面接の準備: IT企業の求人に応募する際は、適切な履歴書とカバーレターを作成しましょう。自身のスキルや経験を的確にアピールし、企業に貢献できるポイントを強調しましょう。また、面接の際には企業や業界についての知識を持ち、自身の経験やスキルを具体的に例示しながら説明できるように準備しましょう。また、一般的な面接の質問に対する回答も事前に準備しておくことが重要です。
  6. コミュニケーション能力の向上: IT企業では、チームでの協力やコミュニケーション能力が重要です。自身のアイデアや意見を適切に伝える能力や、他のメンバーと円滑にコミュニケーションを取る能力を磨きましょう。プレゼンテーションやディスカッションのスキルも重要です。
  7. 持続的な学習と成長: IT業界は急速に変化していますので、持続的な学習と自己成長が求められます。新しい技術やトレンドについて常に学び、自分のスキルセットをアップデートし続けることで、市場価値を高めることができます。

以上がIT企業に就職するための必勝法です。しかし、就職活動は個人の状況や適性によって異なるため、自身の目標や条件に合わせて戦略を立てることが重要です。

また、挫折や失敗があっても諦めずに継続して取り組むことが成功への道です。

taka
taka

就活には必勝法があるんだ。

就活必勝の逆算戦略

内定獲得者の共通点

志望企業が求めているものを調べる

求めているものを示せるように準備する

求めているものを持っていることを示す

1.具体的な方法

・志望企業の求人要項を10から20くらい調べる。
・共通事項を抜き出す
・証明する方法を考え実践する

・継続できるか?
→Twitter で毎日学習ログを残す

・自分から行動できるか?
→もくもく会を主催した

実績をポートフォリオ(PF)や PDF でまとめ、目にとまるようにする。

未経験 OK の求人の探し方

  • 「未経験可」が明記されていない求人を探せ!
  • Web
    系自社開発企業は未経験可で求人を出さないが、優秀なら未経験でもとるケースは多い。
  • 興味ある自社開発企業に応募していく
  • 探し方は、Wantedly と Green
  • 転職ドラフト
  • 技術カンファレンス登壇企業
  • TechCrunch
  • 興味ある企業を見つけて直接応募
  • 評価されるポートフォリオ
  • 頑張ったのに書類で落とされがち

マイナス評価されるポートフォリオ

1.スクールの題材そのまま
2.エラーで落ちる、操作できない
3.デザインが崩れている
4. スマホに対応してない
5.コードが汚すぎる

加点評価されるポートフォリオ

1,サービス好きをアピール:実際の課題解決をするサービスを作る。UI/UX
にこだわる。
2,技術好きをアピール:本番運用も見据えた構成にする。

ポートフォリオでのアピールポイントを決めておく。

面接で見られるポイント・対策

面接官がみているのはたった2つ

エンジニアとして伸びそうか?

  • コツコツ努力できるか?
  • 熱意があるか?
  • 技術への知的好奇心があるか?
  • 地頭がよいか?
  • 会社に貢献しそうか?
  • 自分から行動できるか?
  • 良好なコミュニケーションが取れるか?
  • 人柄がよいか?
  • 素直か?
  • キャリアの方向性が会社の方向性と合っているか?

面接では今の技術力より、今後伸びて会社に貢献しそうかというポテンシャルが見られる。

□面接で見られるポイントに対して相手が納得する証拠を準備

面接でよく聞かれる質問

なぜエンジニアになりたいのか?

「チェック」情熱が高いか?
「NG」リモートで働きたいから。
「回答」過去こういう体験があって、だからエンジニアとストーリーをもって語る。

今後のキャリアプランは?

「チェック」一定期間続けそうか?
「NG」1年後には独立したい
「回答」社会課題を自分で見つけ解決できるエンジニアになりたくてそのために○○したい。

プログラミング学んでどうだった?

「チェック」技術への興味が高いか?
「NG」辛かった。でも動くのは楽しい
「回答」きれいに実装できた時が快感、仕組みに感動

あなたの強みと弱みは?

「チェック」業務内容と相性が良いか?
「NG」特に短所・弱みはありません。
「回答」企業が求める人物像に関連付ける

弊社を志望した理由は?

「チェック」カルチャーマッチしているか?
「NG」スキルを付けたくて。
「回答」御社のビジョンに共感した。

弊社でやってみたいことは?

「チェック」自分から課題を見つけ、動くか?
「NG」まずは勉強して、それから。
「回答」こうすると会社やサービスはよくなると思っていて、僕はこうしたくて、だからこうしたい。

なぜその技術を選んだ?

「チェック」目的意識をもって自分で取り組めているか?
「NG」スクールで習ったから
「回答」○○を実現したくて、そのために△△を選んだ。

面接で守ってほしいこと

  • 「結論」から話す
  • 端的に話す
  • 相手の目を見て話す
  • 質問に正しく答える
  • 相手の立場で話す
  • 愚痴や悪口は言わない

技術力より面接対策の方が内定取れるかに影響するのよね。

6.6カ月でフロントエンドエンジニアになるには

ジョブチェンジ
ジョブチェンジ
taka
taka

半年でフロントエンジニアになれるか?

6カ月でフロントエンドエンジニアになることは可能ですが、個人の学習の進捗や経験によります。フロントエンドエンジニアになるには、HTML、CSS、JavaScriptなどの基礎的なウェブ開発のスキルが必要です。

以下に、6カ月でフロントエンドエンジニアになるための一般的なステップを示します。

  1. 基礎知識の習得(1〜2カ月): HTML、CSS、JavaScriptの基本構文や概念を学びます。オンラインのチュートリアルやコース、書籍などを利用すると良いでしょう。
  2. プロジェクトの作成(1〜2カ月): 習得した知識を実践するために、個人のプロジェクトを始めましょう。シンプルなウェブページや小規模なアプリケーションを作成することで、実践的なスキルを身につけることができます。
  3. フレームワークやライブラリの学習(1〜2カ月): 人気のあるフロントエンドフレームワーク(例: React、Angular、Vue.js)やライブラリ(例: jQuery)を学びましょう。これらのツールを使用することで、効率的なウェブ開発が可能になります。
  4. ポートフォリオの作成(途中から開始): プロジェクトを実践的に作成しながら、ポートフォリオを構築しましょう。ポートフォリオは、将来の雇用主に自身のスキルや成果をアピールするための重要な要素です。

以上のステップは一般的な目安ですが、個人の学習スケジュールや学習方法によって異なる場合があります。また、実際の仕事で必要なスキルや経験は多岐にわたるため、6カ月で完全に熟練したフロントエンドエンジニアになることは難しいかもしれません。

しかし、基礎的なスキルを身につけ、ポートフォリオを充実させることで、エントリーレベルのフロントエンド開発の仕事を見つけることは可能です。継続的な学習と実践を重ねながら、スキルを向上させていくことが重要です。

1.業界・職種選択をしておく

  • 通える範囲にある求人を調べる
  • 希望業界を決める
  • 希望職種を決める
  • 希望職種で学ぶスキルを一覧化する

自己分析をする

  • 転職でどうなりたいか?
  • なぜエンジニアか?
  • どういう企業に行きたいか?

学習計画

□志望企業の求人事項を10から20調べる
□求人要項の共通事項を抜き出す
□共通事項に対して証明する方法を考える
□PFでのアピールポイントを決める
□学習計画を立てる
□スクールに通うか独学化を決める
□独学ならメンターを付けるか決める

学習

□2か月以内に基礎学習は完了する
□3カ月目からはポートフォリオを作成する
□5ヵ月目からは転職活動をスタート

転職活動

□「未経験可」の記載のない自社開発企業を探して応募する
□実績を PF や PDF
にまとめる
□頻出質問に回答を用意する

企業研究

□企業が求めている人材を把握する
□コーポレートサイトの情報をすべて見る
□IR
情報を見る
□社長や社員のインタビュー記事を見る
□テックブログがあれば読む
□WantedliやGreenの掲載情報を読む

内定を取るための習慣

□GitHubに毎日アップする
□Twitter に毎日学習ログを残す
□Giitaにつきに技術記事を2回投稿する
□週30~40時間の学習

mika
mika

真剣に勉強すれば半年でなれるのよ。

7.フロントエンドエンジニアのキャリアパス

エンジニアのキャリアパス
エンジニアのキャリアパス
taka
taka

キャリアパスとは、キャリア」は「職歴」を意味し、「パス」は「道」を意味しています。

つまりキャリアパスとは、企業内での仕事における最終的な目標を定め、そこに向かって進んでいくための道筋を表しています。エンジニアのキャリアパスは個人の目標や適性によって異なる場合がありますが、一般的なキャリアパスについていくつかのステップをご紹介します。

  1. 学習と基礎スキルの獲得: エンジニアリングの基礎スキルを学ぶために、関連する学位や証明書プログラムを修了するか、自己学習を行います。プログラミング言語やアルゴリズム、データ構造などの基礎的な知識を獲得しましょう。
  2. ジュニアエンジニアとしての就職: エンジニアのキャリアは多くの場合、ジュニアエンジニアとしての経験からスタートします。企業や組織に雇用され、実際のプロジェクトに参加しながら実践的な経験を積んでいきます。
  3. スペシャリストへの成長: ジュニアエンジニアとしての経験を積み重ね、特定の技術領域においてスペシャリストとしての能力を磨いていきます。例えば、フロントエンド開発、バックエンド開発、データベース管理、ネットワーキングなど、自分の関心や得意な分野に特化して専門知識を深めます。
  4. チームリーダーやマネージャーへの昇進: 技術的な専門性に加えて、チームやプロジェクトのリーダーシップやマネジメントのスキルを磨くことで、マネージャーやチームリーダーとしての役割に進むことができます。プロジェクトの計画、予算管理、チームの指導など、組織内での責任が増えていきます。
  5. アーキテクトやコンサルタントとしてのキャリアパス: エンジニアリングの経験を生かし、システムやアプリケーションのアーキテクチャを設計したり、コンサルティング業務を行うことも可能です。高度な技術スキルとビジネス的な視点を持ち合わせており、組織やクライアントに対してソリューションを提供します。
  6. 経営戦略や起業: エンジニアリングの経験とリーダーシップの能力を活かし、経営戦略やビジネスの立ち上げに関わることもあります。技術企業の経営者や起業家として自身のビジネスを立ち上げるなど、新たな挑戦をすることも可能です。

上記は一般的なキャリアパスの例ですが、実際のキャリアは個人の志向や経験によって異なります。エンジニアリングの分野にはさまざまな専門領域があり、データサイエンティスト、セキュリティエンジニア、クラウドアーキテクトなど、さまざまなキャリアオプションがあります。

自分自身の興味や情熱に基づいて、継続的な学習と成長を追求することが重要です。また、実際の経験や実績もキャリアパスにおいて重要な要素となるため、積極的にプロジェクトに参加したり、オープンソースのコミュニティに参加したりすることもおすすめです。

mika
mika

コミュニティにも参加したいわね。

  • キャリアパス
  • それぞれのフェーズでの壁
  • 壁ののり越え方
  • フェースごとの基準年収

ジュニアフェーズ(年収300万円台)

1.指示を仰ぎながら仕事ができる
2.指示がなくても仕事ができる
3.数人規模のPJ(プロジェクト)の中核を果たせる/チームリーダー

  • 目の前の技術をひとつずつ丁寧に学ぶ
  • 開発しているシステムの全体像をつかむ
  • 基礎スキルの習得

指示がなくても仕事ができるフェーズ(年収400万円台)

・技術への興味が続くか?
・目標に対して能動的に動けるか?

・技術に興味を持って学び続けること
・目標に対して自分から「こうした方がいい」と考え行動する

数人規模のPJの中核を果たせるフェーズ(年収500万円台)

・何らかの分野でリードを任されるか?
・「この人にこれを任せたい」という明確なポジションをもつこと
・何を強みにリードしていくかを戦略たて

シニアフェーズ

・テックリード(技術面をリードする役割)
・スペシャリスト(特定技術分野)
・プロダクトマネージャー(進む方向を決めるポジション)
・エンジニアリングマネージャー

良い習慣を身につける

エラーメッセージ・エラーログを丁寧に読む。
問題を小さく分割して個別に対処する。
自分が理解したコードだけ書く。
読みやすく、変更しやすいコードを意識する。
公式ドキュメントを読む。

発信する

キャリアアップを考えるならお勧め。ブログを書く。勉強会やイベントで登壇する。人脈も形成される。Twitter で発信する。

複数の言語を学ぶ

プログラミング自体の理解が深まる。

基礎を学習する

技術は変わりやすい。だから基礎の部分だけはしっかりやる。
「オブジェクト指向でなぜつくるのか」

DB
「達人に学ぶSQL徹底指南書」

コードの書き方

「リファクタリング」

考え方

「達人プログラマー」

「Web を支える技術」

ネットワーク

「マスタリングTCP/IP入門」

HTML/CSS

「web制作者のためのCSS設計の教科書」

テスト

「知識ゼロから学ぶソフトウェアテスト」

アジャイル

「アジャイルサムライ」

セキュリティ

「体系的に学ぶ安全なWebアプリケーションの作り方」

あとがき

プログラミングエンジニアになるための学習ロードマップは、幅広いトピックとスキルを網羅することが重要です。

一般的なプログラミングエンジニアの学習ロードマップとして、プログラミングの基礎プログラミング言語の選択があります。人気のある言語としては、Python、JavaScript、Java、C++などがあります。

最初の言語としてはPythonがオススメです。データ型、変数、制御構造、関数、オブジェクト指向プログラミングなどの基本概念の理解と、プログラミングの基礎的な問題や演習を解いて、コーディングの基本的なスキルを身につけます。

次にソフトウェア開発の基礎として、バージョン管理システムの使い方(例: Git)、コマンドラインインターフェース(CLI)の操作方法、デバッグ技術とエラーハンドリングの基礎、アルゴリズムとデータ構造の基礎があります。

さらにウェブ開発としてHTMLとCSSの基礎、フロントエンド開発として JavaScript、フレームワーク(例: React、Angular、Vue.js)の学習、バックエンド開発として サーバーサイドのプログラミング言語(例: Python、Node.js、Java、Ruby)とフレームワーク(例: Flask、Express、Spring)の学習、データベースの基礎(例: SQL)があります。

さらにソフトウェア工学としては、ソフトウェア開発ライフサイクル(SDLC)の理解、テストとデバッグの実践、ソフトウェアアーキテクチャの基礎、プロジェクト管理とチームコラボレーションのスキルがあります。

あと応用開発としてウェブアプリケーションのセキュリティ対策、クラウドプラットフォーム(例: AWS、Azure、Google Cloud)の学習、モバイルアプリ開発(例: iOS、Android)、データサイエンスや機械学習の基礎へと続きます。

学習ロードマップは個人の目標や興味によっても異なります。

プログラミングエンジニアについて、悩みや疑問がありましたらご自由にコメント欄に投稿してください。(コメント欄はこの記事の最下部です)。いただいたコメントはすべて拝見し、真剣に回答させていただきます。

コメント

何なりとお申し付けください。