非情報学専攻の大学生の僕が未経験からエンジニアになるために勉強したこと・してること

非情報学専攻の大学生の僕が未経験からエンジニアになるために勉強したこと・してること

大学で化学工学を専攻しつつwebエンジニアをしている僕がwebエンジニアになるために勉強した内容をまとめてみたいと思います。

エンジニア入門(2017/5〜2018/7)

2017年3月頭ごろにwebエンジニアとしてのキャリアをスタートさせました。この記事を書いている時点ではちょうど2年ぐらいです。

実務に入るまで

最初は、railsとreact(主にreactメイン)を勉強しました。最近だとよくあるパターンだと思います。当時はprogateがそこまで有名ではなかったのでprogateはほとんどやったことがないです。

HTMLやcss・jsの基礎をちゃんとやってから、railsを軽く勉強してreactの公式のチュートリアルをやりました。どちらかというとコーダーに近い勉強が多かったように思います。(cssを結構ちゃんとやったのでコーディングは得意ですが嫌いです。w)

 

実務に入ってから

その後、5月ごろからactivoにフロントエンジニアとしてジョインしました。

フロントで入りましたが、サーバーからフロントまで実装することが多かったです。また、チュートリアルレベルからいきなり実務に入ることになったのでわからないことだらけで大変でした。9割ぐらいググって残りの1割でコードを書くみたいな感じになっていました。

とくにrailsは本当に軽くしか勉強しなかったので、ほとんどgoogleだけで勉強しました。効率が悪かったのでおすすめしませんが問題解決能力はとても強くなりました。

また、gitとかgithubも最低限は使えるようにはなりました。(この時はまだデスクトップアプリからコミットしましたw)

 

こんな勢いでだいたい1年ちょっとやった結果、だいたい実現したいと思った機能は設計の綺麗さなどはさておき作れるようにはなっていました。

レベル感としては、

  • react/railsの基本的なAPIを理解し使いこなせる
  • 自分のタスクをこなす上で9割5分ぐらいはサクッと作れる(残りの5%を考慮できておらず拡張性が低く詰むこともあった)
  • OOPについてなんとなくしか理解できていない(protectedってなんやっけとか)
  • reduxをまともに設計できない(connectとかちゃんと理解していなかった)
  • パフォーマンス・セマンティクスを意識したコーディングはできない
  • webpackはギリ自分で書いて環境を作れた
  • Promiseなにそれ美味しいの?jQueryのajax使う!

ぐらいでした。これで俺最強と思っていたのがとても恥ずかしいですw

 

サマーインターン後(2018/10〜2019/2)

サマーインターンに参加して感じた自分の課題

正直今までは情報学を専攻していなくても全然なんとかなるっしょ、ぐらいに思っていました。でも、実際にインターンに参加する中でやっぱり重要だし、基礎があるだけで全然違うなと気づきました。(特に低レイヤー)

そこで、サマーインターンを終えてから本格的に情報学(の特に重要そうなところ)を勉強することに。

 

もちろん学校でちゃんと勉強している人からしたらなんだその程度か、と思うぐらいの内容だと思いますが、、まあそこはご愛嬌ということで、僕と同じような非情報学専攻の人の役に立てばいいなと思って書いていきます。

それに加えて保守性・可読性の高いコード・設計をできていなかったなという反省もあったのでそのあたりも勉強することにしました。

ネットワーク・プロトコル

アプリを作るだけならそこまで必要になることはないないのですが、デプロイしたり運用したりってフェーズになるとやっぱり必要です。

もちろんアプリを作る上でもHTTPぐらいは知っていないと話になりません。

お恥ずかしながらたぶん1年前の僕(プログラミングを初めて1年)はHTTPが何かもあまりわからず、とにかくGETとPOSTでデータのやりとりをするものぐらいにしかわかってませんでした。

そこで、夏休みが終わったぐらいからTCP/IPとHTTPの勉強をはじめました。VGのエンジニアの方におすすめされた以下の2冊の本を読んでみました。

大好評のマスタリングTCP/IPを時代に合わせて大幅に刷新。TCP/IP解説書の決定版! インターネット接続のための標準プロトコルであるTCP/IP。本書は、大ベストセラーの『マスタリングTCP/IP入門編』を時代に合わせて大幅に再構成し、新しいトピックを追加した改訂第5版です。

本書はHTTPに関する技術的な内容を一冊にまとめることを目的とした書籍です。HTTP/1.0、HTTP/1.1、HTTP/2.0と、HTTPが進化する道筋をたどりながら、ブラウザが内部で行っていること、サーバーとのやりとりの内容などについて、プロトコルの実例や実際の使用例などを交えながら紹介しています。

かなり有名な本なこともあってかなり勉強になりました。というか分量も多いのでまだまだ勉強が足りないところが多いです。あと何周か読んでさらにインプットを頑張ろうと思います。

Real World HTTPに関しては、書評を書いているのでぜひ読んでみてください。

【書評】Real World HTTPを読んでみた

 

プログラムはなぜ動くのか

もはや見出しが本の題名になってしまったのですが、なぜ二進数でなぜプログラムが動いて、、みたいな根幹の部分の勉強も勉強しました。golangとかでポインタをつかったり、パフォーマンスを考える上では重要になってくる部分です。

プログラムがコンピュータの中でどのように動作するのかを、誰にでもわかるように説明しました。プログラムは、メモリーにロードされ、CPUによって解釈・実行されます。その仕組みを、多数の図を使って、順序だてて解説していきます。

サクッと読める内容なので、自信のない人はとりあえず読んでみることをおすすめします。ただ、詳細なメモリのヒープ・スタック領域やGC(ガベレージコレクション)とかまでは書かれていなかったのでこれ一冊はあくまで最低限という位置付けかなと思います。

 

アーキテクチャ

独学で勉強しているとオレオレ設計のプログラムやアプリを書くことはできますが、保守性が高く読みやすいコードはなかなか書けません。そこで、何となくでやるのではなくてちゃんと勉強してやってみようということで、最近はアーキテクチャ周りを勉強しています。

アーキテクチャのルールはどれも同じである!書いているコードが変わらないのだから、どんな種類のシステムでもソフトウェアアーキテクチャのルールは同じ。ソフトウェアアーキテクチャのルールとは、プログラムの構成要素をどのように組み立てるかのルールである。構成要素は普遍的で変わらないのだから、それらを組み立てるルールもまた、普遍的で変わらないのである。(本書「序文」より)

正直、この本にアーキテクチャの重要なところはほとんど書いていると思います。(その分読むのは大変。。)クリーンアーキテクチャという言葉が初めて出てくるのは50%以上読んだあとという仕様です。w

バイナリから現代のアーキテクチャに到るまでの歴史やアーキテクチャとはといった根本的なところが描かれています。

 

本書では、UI設計のこれまでの問題をあぶり出し、設計の本質から、具体的な手順、UIテスト、現場でひっかかりやすいポイントまでを、インターネットテレビ「Abema TV」のUI設計で実践導入した著者が解説。

一方、こちらの本はフロントの設計に重点を置いた本です。今は一番フロントが得意ですが、設計はいつもどうしていいかわからなくなるので読んでみることにしました。AbemaTVで実際に導入されているAtomic Designについて概要と具体例をまとめてくれています。

今まで適当に設計していたコンポーネントを結構綺麗にまとめられるようになった気がするので読んでよかったです。2019年2月〜3月で参加させていただいたCyberAgentのREQUでもAtomic Designが採用されていたので勉強しておいたおかげで一定コードは読みやすかったです。

 

インフラ周り

今までなんとなく苦手意識が強かったのですが、低レイヤーの勉強をしてからなんとなく苦手意識がなくなったのと、たまたまインフラ系のインターンに参加する機会が連続してあったのでインフラ周りの勉強をしてみました。

awsをちゃんと意味を理解しながら触ったりdockerで思い通りの環境を作れるように勉強したりということをやりました。特に本とかは読まずにドキュメントやハンズオン記事などを参考に手を動かして勉強を進めました。
dockerでやりたい任意の構成はだいたい作れるようになりました。まだdockerでのデプロイはやったことがないのでGKEにコンテナをデプロイをする勉強をこれからやっていこうと思います。

コンテナオーケストレーションの業界標準クラウドネイティブ開発の第一歩を踏み出そう! Kubernetes認定資格(Certified Kubernetes Administrator/Certified Kubernetes Application Developer)保有者直伝! プロダクション環境で培われた、Kubernetesを使い倒すための実践ノウハウが満載の一冊です。

k8sに関してはこちらの本を入手したのでこれをやっていきです。

 

静的型付き言語

これは基礎とは少し異なりますが、いままで動的型付き言語をそんなにやったことなかったのでやってみました。しっかりやってみることでアーキテクチャ周りやオブジェクト志向の深いところまで理解できた気がします。特に本は読んでいませんが、golangとtypescriptで勉強しいます。

今まではrailsやjsが多かったので最初はなれませんでしたが、今となっては型がないと不安になるようになりました。

特に大規模なコードを読む必要があるときに型の情報があるかないかではかなり開発の効率が変わってきます。無駄なテストも減らすことができるのでよっぽどの理由でもない限り型付きの言語で開発したいのお気持ちです。

これはjsに関してだけなのですが、ドキュメントは生jsにしか対応していないことが多いので実際に自分からコードを読みに行く機会が増えます。これにともなって標準のAPIやライブラリのAPIについて詳しいところまで理解できるようになりました。(たとえばfetchで受け取るjsonの型を指定するにはどうしたらいいのか、とか)

 

フロントのインターンを通して(2019/2〜)

CyberAgentのREQUでのインターンを通してフロントの中で足りていない部分がはっきりしてきたので、インターン在籍中からセマンティックな実装方法をなどを勉強しています。具体的には、a11yやパフォーマンスに関してです。

アクセシビリティ(a11y)

アクセシビリティは今まで勉強したことがなかったのですが、インターン中の輪読会や勉強会に参加させていただいて基礎は習得することができました。

「誰でもどんなデバイスからでも情報や機能を利用できること=アクセシビリティが重要」ーーーーこの書籍は、ともすれば「規格や達成基準をどう理解し、サイトやサービスを準拠させるか」という実装面に目が向きがちだったアクセシビリティ関連の従来の書籍と一線を画します。...

こちらの本の輪読会とアメブロのアクセシビリティガイドラインの輪読会に参加させていただきました。勉強するまではアクセシビリティは障がいのある方向けの対応だと思っていたのですが、意外とボリュームゾーンのユーザーにとっての対応もあったりとなかなかやりがいのあるものだなぁと思いました。

 

「WAI-ARIAとは、HTMLドキュメントに詳細な情報を付加する仕様で、W3Cが2014年に1.0を勧告しています。今後アメリカでの急速な普及が進むにつれ、日本でも「HTML、CSS、JavaScriptなどフロントエンド技術を実装するエンジニアやデザイナーにとって学ぶべきこと」となっていくことが予想されますが、日本語による情報が乏しいのが現状です。...

こちらの本はインターンの最終日にプレゼントしていただいたので現在読んでいる最中です。実装がメインになっているのでa11yを実際に実装できるようにこれらか勉強していこうと思います。