文系学生がWebエンジニア職内定をGETする方法【React】

# はじめに
私は経済学部に所属していますが、HRBrainさんからWebエンジニアの内定を頂き、またその他にも大手ベンチャー2社から内定を頂くことができました。
就活をする中で意識すべきことや面接のコツ、もしもう一度エンジニア就活をするならという目線で記事にまとめましたので、私のように文系からエンジニアを目指す方の参考になれば幸いです。

# この記事の対象
- 就活中、就活をはじめようと思っている方
- 文理問わず、独学でプログラミングを学習している人
- 文系からエンジニアは無理じゃね？って思ってる方

# 就活する前のスペック
- 大阪大学経済学部で統計学と仕掛学（行動経済学的なもの）を専攻
- Python、R（どちらも1年半くらい）

こんな感じでGitHub？聞いたことあるけど難しそう！って思ってたくらいなので草なんて生えてません。砂漠です。

# どうしたらエンジニアになれるんですか？
ざっくりこの2つを満たせば誰だってなれます。
#### 1. 根拠を持ってエンジニアになりたい理由を話せるようになる
文系学生の場合、大学で学ぶ専門知識は、エンジニア選考において直接的に評価されることは少ないかもしれません。
もちろん、サークルなどチーム活動のエピソードは役立ちますが、それは就職活動全般に言えることですので、エンジニアにフォーカスした当記事では割愛させていただきます。
ですから、プログラミングの学習を自分から積極的に学ぶ姿勢が非常に重要です。
しかし、「勉強してます！」だけでは、面接官に「本当に理解しているのか？」と疑問を持たれてしまうかもしれません。
そこで、具体的な「根拠」を示すことが重要になります。
その根拠となりうるのが、
- 自身のポートフォリオサイト、プロダクト
- QiitaやZennなどに投稿した記事
- ハッカソンやインターンに参加した経験

**つまりはアウトプット！**
これら3つが十分にあれば文系就活生として超超ハイレベルでしょう

#### 2. CS(Computer Science)出身でないビハインドを自覚し、キャッチアップする将来設計を語ることができる
CSを選考する情報系学部出身の学生は、専門的な知識を深く学んで就職します。文系学部出身の我々は、彼らと同じレベルの知識を最初から持っているわけではありません。しかし、エンジニアとして活躍するためには、常に学び続け、スキルを向上させていく必要があります。

就職活動では、将来どのようにスキルを磨いていきたいのか、具体的な将来設計を語るようにしましょう。志望企業が自社開発を行っている場合は、開発しているプロダクトについて調べたり、受託開発を行っている場合は、どのような企業からどのような案件を受注しているのかを把握しておきましょう。


# もう一度就活をやり直すならこうする！
ここからは私自身が実際にやったことを踏まえて学習や行動のプランを考えてみました

:::note
私は当初フロントエンドエンジニア志望で活動していたのでフロントエンド(特にReact)の話題がかなり多くなりますが、フロント・バック問わない、共通の話題もあるかと思いますのでご一読いただければ幸いです。
:::

## 1. HTML/CSS, JavaScriptをざっくり学んで自身のポートフォリオサイトを作る

まず、HTML/CSS、JavaScriptといった基本のキにもならないところからやってみましょう
教材はなんでも構いません。UdemyでもYouTubeでもブログ記事でもあらゆるところにこの程度の情報は転がっています。

:::note warn
ここで時間を使いすぎないでください。HTML/CSS,JSの全体像を把握しながらアウトプットを行うという目標を忘れないようにしましょう。
:::

## 2. GitHubを学んでサイトを公開する
GitHubは開発の上でマストといっても過言ではありません。
私はブログなどで断片的に知識を仕入れて使うという工程を繰り返していましたが、最初に体系的に学んでおけばよかったと感じています。
こちらのUdemy講座がおすすめです。これも1週間程度で終わらせることを目指しましょう。

https://www.udemy.com/course/unscared_git/

こちらを終わらせればデプロイ(サイトを公開すること)ができるようになります！
参考程度にデプロイ方法のリンクを貼っておきますが、Youtubeの動画などわかりやすいものもたくさんあるので要領を得なかった場合はご自身で調べてみてください

https://www.newt.so/docs/tutorials/connect-to-netlify

## 3. Reactで最初に作ったポートフォリオサイトをバージョンアップする

HTML/CSS、JavaScriptをある程度理解した後は、フロントエンドフレームワークであるReactを使ってより実践的な知識でプロダクトをブラッシュアップしていくことをおすすめします。
もしあなたがフロントエンドよりもバックエンドに興味があるのならば、その領域でよく使われる言語やフレームワークを使って自身の過去の作品をブラッシュアップしてみてください

Reactは、Webアプリケーション開発に広く利用されているフレームワークであり、動的なWebページを作成することができます。
Reactについてはたくさん教材や記事、動画をあさりまくりましたが、この本が一番だと感じています。

[はじめてつくるReactアプリ with TypeScript: たった2.5時間で「わかる！ できる！」　最初に読みたかった本 （React & TypeScript入門](https://www.amazon.co.jp/%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6%E3%81%A4%E3%81%8F%E3%82%8BReact%E3%82%A2%E3%83%97%E3%83%AA-TypeScript-mod728-ebook/dp/B094Z1R281/ref=sr_1_10?adgrpid=70089958478&dib=eyJ2IjoiMSJ9.m7wiu930yjNzErGApAUQJOhhMIvdOrSkRzaZCS2L1RLhyGnHIVqEC2kjPuoNUItDCtbzVTaj59a0atsmau3manSIctwhzO-BR80MWWVYX9u50-BukZyP6aY61823quJBGPY76kHhOEhn5qCmfUbAQ766f0S_HYsHn9adu_MWo0aH1JxFx0oaH5G0ASEjjf9Wzc3AhH5slbRh8-RpLZw3PcyyPeFAwdVkLIYIa4uzNXjeNouB0sIEEYndi6Vm5vZtCFmkkkuD5kQaX7NwDbF-VeIuROoqLLgF7YIVedmKGTI.8Pkb1CIx1EfNr3lVSmLNsQwEKHBlI3wldy-PNXE4_tE&dib_tag=se&hvadid=665617091215&hvdev=c&hvlocphy=1009300&hvnetw=g&hvqmt=e&hvrand=6682714043116480691&hvtargid=kwd-358686647269&hydadcr=27487_14701027&jp-ad-ap=0&keywords=amazon+react&qid=1719994689&sr=8-10)

読み終わったら、Reactとその他のUIライブラリなど使ってポートフォリオをブラッシュアップしてみましょう！
参考までに拙作ポートフォリオサイトと参考に拝見した動画を載せておきます。

https://www.ahoxa.tech/

https://www.youtube.com/watch?v=bSMZgXzC9AA

## 4. Reactの知識を更に深め、自身のプロダクトを持つ
ポートフォリオサイトをReactでリプレイスできましたか？
GitHubはうまく使えていますか？

ここまでくればあともう一歩です。これは私が作りました！と言えるものを持ってみましょう

お題は **「役に立ちそうなもの」** で、 **「あなたでもギリギリ作れそうなもの」** です。

というのも役に立ち、ユニークなものであればあるほどプログラミングの知識だけではないことがアピールできるのでかなり効果的ですし、なにより誰かに使ってもらえる可能性があります。

特に **ギリギリ作れそうなもの** というのが重要で、あまりにも現状のスタックからかけ離れ過ぎた技術が要求されるものは途中で頓挫することが多いです。
（実際に私は京都のバスの最も効率的な乗り換え順がわかるサイトを作ろうとして断念しました）

なので「Todoリスト」や「掲示板」など巷に溢れているものを改良する形で取り組むのが良いでしょう。
学生であれば、履修状況を把握しやすくなるWebサイトなんてのもいいんじゃないでしょうか？成功事例もたくさんありますね

え？お前はなにを作ったのかって？
一応あるのですが本当に出来が悪いので作り直したらまた...ということで...
なのでここまで達成したあなたは私より優秀です！

## 5. +αでやっておきたいこと
4までやり遂げたあなたは大変優秀です。半分内定したといっても過言ではありません。
ここでは3つのことを紹介しますが、マストではありませんし、負担もそこまで大きくないのでこれまでのことと並行してやってみてください

- **AtCoderなど競技プログラミングに参加する**
コードテスト対策として、競プロに挑戦してみるのも良いでしょう。コードテストは、企業によって実施の有無や難易度が異なりますが、最低限A問題くらいはスムーズに解けるようにしておくことをおすすめします。

https://atcoder.jp/?lang=ja

https://kenkoooo.com/atcoder/#/table/

- **Paizaやサポーターズ、TrackJobなどエンジニア逆求人サイトに登録する**
逆求人サイトというのをご存知ですか？
プロフィールに自身の情報を書いておけばカジュアル面談や選考、インターンのお誘いを受けることができるサービスです。どのサイトも無料で利用できます。
私はPaiza経由でHRBrainを知り、なんとありがたく内定まで頂くことができました！やったね！

https://paiza.jp/

https://job.tracks.run/

https://talent.supporterz.jp/


- **ハッカソンやセミナーに参加する**
コミュニティに参加してみましょう。一緒に行けそうな友達がいないなら1人で飛び込んでみようぜ！モチベーションに繋がります。関西ならHackBarやKobe.tsというコミュニティがあります。

https://hackbar.jp/

https://kobets.connpass.com/

# あんたは面接でなにを話したのさ
なにを話したのかを聞かれることが多かったので参考程度に、
「ものづくりが好きで、デザインもプログラミングも、そのための手段です」
という言葉を軸に話していました。
恥ずかしいけれど、当時書いていた面接対策のメモを置いておきます。参考にしてください

https://lush-cacao-588.notion.site/2bc463891e9044808fe17fa6162c877e?pvs=4

もしあなたがメモを書いたとして、その通りに話す必要はないと思います。
メモを書いておくことで話す内容を整理しておくことが重要です。
笑顔でしっかりと面接官と対話してください。笑顔と声、大事。

# 最後に
いや〜長々と書いてしまった...ご参考になれば幸いです！
就活辛いっすよね..受験頑張ったら人生順風満帆と言われていましたし、私もそう思っていたのでなかなか大変な期間だったなと今でも思い返します。
就活という無為にしか見えない慣習ではありますが、頑張ってみると意外にも成長の機会がたくさんあります！

もちろん、簡単ではありませんでしたが、諦めずに努力を続けたことが成功につながったと思います。もし、エンジニアになりたいけど道に迷っている方はぜひ今回紹介した方法を参考に、学習を始めてみてください。

文系から未経験でエンジニアになるというのはかなり高いハードルに見えますが、コツコツやっていけば案外なんとかなります。
あなたなら大丈夫です。
応援しています！！