学習ロードマップ

【徹底診断】あなたはどっち向き!?フロントエンドorバックエンド

スプ兄

どうも!「シャベルエンジニア」のスプ兄です!

スプ兄の簡単なプロフィールはこんな感じです。
  • 高卒・文系・元消防士から9ヶ月で開発エンジニアに転職
  • 実務経験1年でPM(プロジェクトマネージャー)
  • プログラミングスクール代表 兼 講師

今回は「徹底診断!あなたはフロントエンド向き?それともバックエンド向き?」を説明します!

web系のエンジニアを目指す上で大きく分かれ目になるのが「フロントエンド」と「バックエンド」なんです!

どちらになるかで学習方法や、キャリアの戦略などが変わってきます!

この違いがそもそもわからない人も多いと思うので、
今回は診断も交えながら櫂説したいと思います!

この記事を読むと・・

①フロントエンドのことが分かる!

②バックエンドのことが分かる!

③記事を読んでいるそこのあなたのどちらの方が向いているのかが分かる!

まずは、ざっくりイメージ感を掴んでもらうためのお話しをしたいと思います!

スプ兄

Webアプリケーションを作ることを「家づくり」に例えると、

フロントエンドの仕事=家の内装や外装のような目にみえる部分を綺麗にすること

バックエンドの仕事=目に見えない電気配線や水道などの機能を作ること

ざっくりとしたイメージが掴めたところで、具体的な解説をしていきます!

そもそもフロントエンドって?

そもそもフロントエンドが何かを分かりやすく言いますと、「ユーザーの目にみえる画面などを作ること」を言います!

フロントエンドエンジニアの仕事

デザイナーさんが作った「デザインカンプ」をコードで再現することが挙げられます!

ここは勘違いしやすいところで、僕も未経験の時に知らなかったことですが、

フロントエンドエンジニアがデザインを作るわけではない」ということですね!

よくエンジニアを目指してる方に言われるのが、

ドボくん

僕は(私は)、デザインのセンスないから、フロントエンドエンジニアには向いてないのかな…

とよく相談を受けますが、

スプ兄

実はそんなことないんです!!

実際にお見せしたいのですけど、これがデザインカンプと言われるもので、
本当にゼロの状態からお客さんに作りたいイメージをヒアリングしたりして、
目にみえる形に起こしていきます。

デザインを作るのはWebデザイナーなんですね!

そのデザイナーさんが作ったデザインカンプと言われるものを、コードで再現することがフロントエンドの仕事になる!

必要なのはデザインセンスではなく、
「デザイナーが作ったものを、できるだけ詳細に再現すること」これが求められるます!

デザインセンスはもちろん、あるに越したことはないですがなくても大丈夫!!

今伝えたのはフロントエンドの中でも「マークアップ」と呼ばれるような内容になります。

マークアップというのは「データのやり取りとかなく、単純にHTMLとかCSSのコードで画面を表示する」ということです。

さらにハイレベルな内容になると・・
後でお伝えするバックエンドから送られてきたデータを正しく画面に表示するというのもフロントエンドの大事な仕事になります。

そもそもバックエンドって? 

バックエンドエンジニアの仕事

・「Webアプリケーションの裏側の処理をつくる」ことです。

例)ログイン、検索、投稿内容の登録、編集、削除など

・データベースとやり取りをして、必要な情報を取り出したり、取り出したデータをフロントエンドに渡すことをしています。

例)ログイン機能
→ユーザーが入力フォームから送信した内容をまずは受け取る。
→受け取った情報とデータベースに保存されている内容に同じものがあるかをチェックする。
→同じ者があればログイン成功の処理を返す、一致する者がなければログイン失敗の処理を返す。

これをプログラムするのがバックエンドエンジニアの仕事です!

2つの仕事を選ぶ基準とは

このどちらを目指すかがかなり大事で、「何を基準に選べばいいか悩む」と思います。

この選ぶ基準は、個人的には2つあると思っています。

①自分に向いている、自分にあっているものを選ぶ

②キャリアアップ的な戦略、市場価値的な観点から選ぶ

徹底診断!あなたはフロントエンド向き?それともバックエンド向き?

エンジニアとしてのキャリアを考えているけれど、フロントエンドとバックエンドのどちらが向いているのか迷っている方に!この簡単な診断で、自分の適性を見つけてみましょう。


質問1

あなたは間違い探しが得意、または好きでしょうか?

  • A: 得意、好き
  • B: 得意ではない、あんまり好きじゃない

Aを選んだあなたは「フロントエンドエンジニア」に向いてます!

  • 理由: フロントエンドの仕事は「デザイナーが作ったデザインをキレイに再現すること」が大事!細かいところまで目を配れる人はフロントエンドエンジニアへの適性があると思います。

質問2

文化祭などで演劇をやるならどっちがいい?

  • A: 舞台にたつ役者
  • B: 舞台裏から支える裏方

Aの役者を選んだあなたは「フロントエンドエンジニア」向き!

  • 理由: サイトを作る時にユーザーの目に映るのは「画面」。目立つ部分をきっちり作りたい人はフロントエンドに向いています。

Bの裏方を選んだあなたは「バックエンドエンジニア」向き!

  • 理由: バックエンドは「縁の下の力持ち」。裏方に魅力を感じるあなたはバックエンドエンジニアにおすすめです。

質問3

「要するに〜」が口癖

  • A: はい
  • B: いいえ

Aを選んだあなたは「バックエンドエンジニア」向き!

  • 理由: 大量の情報から要点を整理する力がある人はエンジニアに向いています。論理的思考が強い人は特にバックエンドに向いていると思います。

結論

フロントエンドエンジニア、バックエンドエンジニア、どちらに向いているかを知ることで、自分のキャリアの方向性が見えてきます。
ぜひ診断結果を参考にして、エンジニアとしての一歩を踏み出してみてください!

フロントエンド、バックエンドはこう言う人がむいてるんじゃない?
みたいなのがあれば是非コメントに書いてみてください!

最後に

「フロントエンド、バックエンドのどちらかを選ぶか」の2つの基準ですが、

「キャリアアップ戦略、市場価値的な観点が大事だ」と言いました!

スプ兄

個人的にですが、完全未経験からエンジニアになる場合は
「バックエンドから始めること」をオススメしています!

理由としてはいくつかあり、ここは個人的な思想を多く含むところではあるのですが、

未経験からWeb業界に入って市場価値をあげたり、活躍したいと思った時に

技術力をあげるものもちろん大事なんですが、

前職であったり、いろんなWeb以外の知識を生かして、
マネージャー職、PMができるようになることをおすすめしてます!

その時にお客さんとかシステムとか予算とかいろんなものを俯瞰して見れることが大事になります。

その中でもシステムに関して、バックエンドを知っている、裏側を知っていることはとても有効に働くことが多いので、

そういった観点でもバックエンドエンジニアからキャリアを始めることはとてもおすすめです!

まとめ

まとめ

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

  • 仕事内容:
    • デザイナーさんが作ったデザインをコードで再現
    • バックエンドから送られてきたデータを正しく画面に表示
  • 向いている人:
    • 画面の細かい部分まで気を遣える人

②バックエンドエンジニア

  • 仕事内容:
    • サイトの裏側の仕組みを作成
    • データベースとのやりとり
  • 向いている人:
    • 効率を重視する人
    • 論理的思考が強い人
    • 裏方にかっこよさを感じる人

そして、これを踏まえてエンジニアになるための具体的な学習方法については、
以前の記事の「9ヶ月でエンジニアになるための完全ロードマップ」を参考にしてみてください!

また私が運営している、未経験からエンジニアになるまでの学習サポート、
転職サポートを受けながら、今回紹介したPMを見据えた実務経験も積むことができる
「シャベルエンジニア」についても概要欄に詳細を掲載していますので、
ぜひ興味のある方はご覧ください!