2024年版 モダンなモバイル、Webアプリ開発環境の紹介(当社の選択理由とは?)

公開 : 2021.03.18  最終更新 : 2024.03.17

こんにちは、CTOの十川です。
NCDCのエンジニアチームは「新しい技術や、モダンな開発手法で、新しい事業やサービスのコンセプトを実現すること」をミッションとしています。

今回はNCDCが2024年3月時点でよく使用しているプログラミング言語や、フレームワークなどについて、なぜそれを選択したのかという理由と合わせて以下の4つの領域を紹介したいと思います。

  • Webフロントエンド
  • モバイルアプリ
  • バックエンド
  • インフラとIaC(Infrastructure as Code)

NCDCでは上記以外にも機械学習や、IoTなども扱っているのですが、それはまた別記事で紹介したいと思います。

はじめに

タイトルに「モダンな」と書いてありますが、これから紹介するものは割と2024年時点で王道な組み合わせかなと思っています。
前提として、NCDCでは多くのメンバーがJavaScript(TypeScript)を書けるので、Webフロントエンド、モバイルアプリ、バックエンドともJavaScriptのエコシステムを積極的に採用しています。

Webフロントエンドの開発環境

Webフロントエンドの開発では、React(https://reactjs.org/)やNext.js(https://nextjs.org/)をほとんどのアプリケーションで採用しています。状態管理にはReduxまたはContextをアプリケーションの特性に応じて使い分けています。
比較的複雑なアプリケーションを構築することがあるため、アプリケーション全体をサポートしてくれるフレームワークが必要になるというのがこの選択をした理由です。

一般的にReact以外の選択肢としては、Vue.js(https://jp.vuejs.org/)だと思います。
Vue.jsは自社での開発で採用することはほぼ無いのですが、NCDCが支援しているお客様が自社でシステムの内製化に取り組まれるようなケースで、「React系だと重厚すぎて学習コストが大きい」と判断された場合はVue.jsをお勧めすることがあります。

この領域については非常に多くの経験を積めているかなと思います。
今後もしばらくはこの構成が続きそうな見込みです。

フロントエンドのCI/CD

フロントエンドのCI/CDにも取り組んでいて、AWSを使用する場合、AWS AmplifyとGitHub Actionsの組み合わせをよく使用しています。

モバイルアプリの開発環境

Flutter,ReactNativeによるクロスプラットフォーム開発

モバイルアプリの開発では、Flutter(https://flutter.dev/)またはReactNative(https://reactnative.dev/)を使ったクロスプラットフォームなアプリ開発をよく使用しています。
JavaScript(TypeScript)が書けるエンジニアが多いため、以前からApache Cordovaを使用したクロスプラットフォーム開発を行っており、その後、ReactNativeに移行したことからクロスプラットフォーム周辺に習熟していたという背景があり、Flutterもスムーズに採用できました。

カメラやローカルファイルシステムへのアクセスなどハードウェア側の機能を使用する場合は、提供されているプラグインを使ったり、iOSであればSwift、AndroidであればKotlinを使って自分たちでプラグインを作ったりしています。

Flutterや、ReactNativeなどのクロスプラットフォームアプリ開発技術については、別の記事「クロスプラットフォームアプリ開発技術の比較(React Native、Flutter…etc.)」もご覧ください。

Swift,Kotlin

ハードウェア側の機能の機能を使用する割合が高い(SwiftやKotlinなどのネイティブで開発する割合が高い)場合、全体をSwiftやKotlinで開発しています。例えばカメラが主体のアプリケーションをつくる場合などです。

上にも書きましたが、以前はApache Cordova (https://cordova.apache.org/) をよく使用していました。
CordovaはWebViewベースのハイブリッドなアプリ開発ができるツールで、ハードウェア側の機能を利用する場合は、同じくプラグインを使用してネイティブで提供される機能を利用できます。
WebViewベースのアプリはブラウザエンジン自体が高速化されていることもあって、Cordovaでもすごく遅いということはないのですが、ReactNativeやFlutterの方が動作速度は早いことと、現時点ではコミュニティが活発で新しい機能がどんどん追加されることを評価し、NCDCでは2019年から2020年にかけて、新規開発するアプリはCordovaからReactNativeに移行しました。その後、Flutterも併用しています。

バックエンドの開発環境

NCDCではフロントエンドとバックエンドを分離しているため、ここでいうバックエンドはほとんどのケースでAPIです。

JavaScript (TypeScript) + Node.js + Express / NestJS

JavaScript (TypeScript)+Node.jsで書くのが第一の選択肢になりますが、フレームワークとしては採用する実行基盤によって異なります。

プラットフォームとして、AWS ECSのようなコンテナ基盤を使用する場合、Node.jsとExpress(https://expressjs.com/)やNestJS(https://nestjs.com/)を使用してAPIの開発を行います。
ExpressはAPIやWebアプリケーションを開発するためのフレームワークですが、比較的機能が少なく、自由度が高いため、NCDCの中でもプロジェクトによって作りが違うということがよくあります。

NestJSはExpressと比較してさまざまな機能を持っているため、自分でPluginを探してくる必要がなく、とりあえずNestJSの標準のやり方でやるということが可能です(逆に言うとここはこの書き方したくないんだけどな、というケースもある)。
AWS Lambdaのようなサーバレス環境で開発する場合は、ExpressやNestJSを使わないケースもあります。

また、NCDCではIoTで収集したデータを活用するアプリケーションを開発することも多く、そのような場合ではデータを扱うライブラリが豊富なPythonを使いたいため、FastAPI(https://fastapi.tiangolo.com/ja/)をバックエンドのフレームワークとして採用します。

バックエンドのCI/CD

バックエンドのCI/CDはAWS LambdaであればServerless Framework(https://www.serverless.com/)をGitHub Actions上で実行しています。API GatewayなどAWS Lambdaを使用するのに必要なものの環境構築からデプロイまでできるので非常に便利です。

インフラとIaC(Infrastructure as Code)

NCDCには社内サーバーというものはなく、自分たちの検証環境や本番環境はすべてクラウドになっています。
AWSが最も多いですが、AzureやGCPも使用しています。

サーバーのメンテナンスは極力やりたくないので、サーバレスや、コンテナ、マネージドサービスを積極的に採用しています。
具体的なAWSのサービスでいうとAWS Lambda、Amazon ECSなどのアプリケーション実行環境や、認証サービスのAmazon Cognitoなどです。

インフラの構築をコードで定義するInfrastructure as Code(IaC)の領域は、現在ではAWS CDKを採用するケースが増えてきています。従来はAWS CloudFormationでしたが、CDKの良いところはTypeScriptやPythonなどのプログラミング言語を使って、インフラの構築を定義できることです。プログラミング言語が使用できることで、VS Codeのようなエディタがサポートしてくれますし、言語によってはコンパイルでエラーを事前に確認することができます。また、共通化したい処理を関数として定義するなど慣れ親しんだ書き方も可能です。

  • AWS CDK: プログラミング言語でインフラの定義ができる。AWS以外で使用できない
  • AWS CloudFormation: YAMLまたはJSONで記述。AWS以外で使用できない
  • Serverless Framework: AWS Lambdaを採用する場合に、環境構築とアプリのCI/CDも一緒にできるのでよく使用されています
  • Terraform: AzureなどのAWS以外を使用する時に採用することが多い

NCDCは、AWS Lambda サービスデリバリープログラム認定を取得しています。
AWSサービスデリバリープログラムとは、特定のAWSのサービスをお客様に提供する上で深い技術的知識、経験、および実際の成功事例があるAWSパートナーをAWSが認定するプログラムです。AWS Lambdaパートナーとして認定を受けている企業は日本国内では比較的少なく、当社を含め12社ほどです(2024年3月現在)。

開発環境選びで大切なのは将来性と自社能力との相性

WebフロントエンドではVue.js、バックエンドではJavaやPHPのような従来から使われていた言語や最近ではGoなども世の中で良く使われていますし、とても良い言語やフレームワークだと思います。NCDCがReactやTypeScriptなどを選択したのはNCDCのエンジニアのスキルや、組織の特徴にあっていると判断したためです。NCDCでは5人〜10人くらいの小さなチームが複数あり、それぞれでプロダクトを開発することが多いため、フロントエンドもバックエンドも同じTypeScriptでチームの中でそれぞれがコードを読んだり、レビューできるということを重要視しました。

技術の選択では、このように該当の技術の将来性(すぐ廃れない)と、組織のCapabilityとのフィット感が重要かなと考えています。

また、ここ数年で追加された技術要素としてFlutter、NestJSなどがあります。10年間、同じ言語、フレームワークだけをやってきたエンジニアが突然明日から新しい言語をやれと言われても、大変ですよね。毎年変わっていては技術の蓄積もできませんが、定期的に新しい技術を取り入れて、組織全体の技術を更新していく必要はあると考えています。その中にはトライはしてみたが、標準として採用にはならないものもあって良いと思います。

NCDCではフロントエンド、バックエンド、モバイル、機械学習、クラウドなどの領域でエンジニアを募集しています。
新しい技術や、モダンな開発手法での取り組みに興味を持った方は、まず話を聞いてみるだけでもかまいませんので、ぜひこちらの採用情報ページから応募するか、十川(sogo@ncdc.co.jp)までご連絡ください。

ページトップへ

お問い合わせ

NCDCのサービスやセミナー依頼などのお問い合わせは
下記のお電話 また、お問い合わせフォームよりお気軽にご連絡ください。

050-3852-6483