PoliPoliでAngularを採用している理由
こんにちは！株式会社PoliPoliで開発しているKounoです。
株式会社PoliPoliで開発しているサービスでは技術スタックにAngularを採用しています。
Angularとは
Goggleと個人や企業のコミュニティによって開発されているJavaScriptフレームワークです。
フルスタック
開発に最低限必要なパーケージがあらかじめ用意されており、Angularのみでアプリケーションを作ることができます。このことから公式では開発プラットフォームと紹介されています。
具体的には下記のものが用意されています。そのためライブラリ選定が不要です。（もしそれぞれにライブラリが複数あり、一つ一つの違いを調査する必要があるとすれば大きなコストです。）
- Router
- Form
- HttpClient
- Animation
- PWA
- Schematics
- Bundler
- UnitTest
- 状態管理
ng add @angular-eslint/schematicsで簡単にeslintを導入できます。
どのプロジェクトでもこの統一されたスタックで開発するため、一度覚えてしまえば別のプロジェクトに配属されたり応援に行った場合でも即戦力になります。
コンポーネント構成
コンポーネントはHTML、SCSS、TS、Specの４つのファイルに分かれているため、エンジニアとデザイナーの分業が可能になります。
またAngularコーディングスタイルガイドに沿って書くことで、どのエンジニアでもアプリケーションをよりきれいにし、読みやすく、維持しやすくし、テストをしやすい共通のコードを書くことができます。
ガイドのルールを全て取り入れるのは現実的ではないかもしれませんが、一からルールを決め、ドキュメントを作成していくよりも効率的に必要なルールを組み立てることができます。
開発体験
- コンポーネントの作成はAngular Schimaticsを使用しています。任意のディレクトリに必要なファイルセットの作成、routingやmoduleの設定を自動でやってくれるのでかなり楽です。
- ng serveによるsaverの立ち上げが高速で快適です。
- ESLintと同様にJestもschematicsを使って簡単導入することができるので、Jestを使いたい場合でも不満なくユニットテストができます。
キャッチアップコストは高い？
AngularのデメリットとしてRxJSのキャッチアップコストが高いとよく言われています。
僕自身、はじめは苦労しました。。
僕がAngularを使い始めたのは、まだエンジニアの仕事を始める前、当時デスクワークではなく工場で肉体労働の仕事をしていた頃でした。趣味で開発をはじめ、JavaScriptもまだあまり分からない状態でしたが、なんとかTypeScriptでコードを書けるようになり、ようやくRxJSを使って状態管理を書き初めました。ここまでくるのに数ヶ月かかりました。
ですが、そこからRxJSを使って実装ができるようになるまでには一月かかりませんでした。(もちろんとても教えるのが上手な人に教えてもらいました）
結局のところJavaScriptやTypeScriptを完全に理解していなくてもフロントエンド開発ができるように、RxJSも業務に必要な知識というのはあまり多くありません。ストリームという概念を理解するのに苦労するかもしれませんが何日もかからないと思います。
まとめ
株式会社PoliPoliでは、技術スタック選定のコストを大きく削減し、サービスの成熟に伴って発生が予想される属人性による保守のコストを防止するためにAngularを採用しています。
個人的に思うこと
フレームワークの進化は早く、エンジニアが煩わしく感じていた作業はどんどんライブラリ化されて簡単に開発できるようになっています。
今月書いた何十、何百、何千行のコードは来年には新しいライブラリに取って代わり、わずか数行書けばよくなっているかもしれません。その先にフロントエンドエンジニアの居場所はあるのでしょうか。。。ツヨツヨになりたい。。
Angularは優れたフレームワークかもしれません。ですが、フレームワークに多くのことを求めることが将来の自分にどう影響を与えるのかを考えると、フレームワークを使う前にエンジニアとして何を知り何ができるのかの方が重要になってくるのではないかと思います。
その点、PoliPoliでは開発メンバーや会社のサポートのおかげで大きく成長できているなと日々感じています。
PoliPolでは開発メンバーを募集しています
株式会社PoliPoliではモチベーションアップや心理的安全性を考えメンバーがより良い環境で働くためにさまざまな施策やサポートを行なっています！ぜひ一緒に開発しましょう！！
Discussion