Note初級・中級のエンジニアやデザイナー向けに技術情報と英語学習情報を提供中。Yogaを使って実現する方法を紹介します。はじめに平成後半はAPIの全盛期でした。APIを指すことがほとんどになりました。APIはフォーマットがJSONでシンプルになった一方で、インターフェースに明確な仕様がなく、開発者によって微妙に使い方が異なるという独自仕様の乱立に繋がりました。これはなんとかしなければいけません。エンジニアはいつももっと分かりやすくシンプルにならないかを考えています。そんな平成最後にFacebookが示した一つの解がGraphQLです。GraphQLはエンドポイントを一つにし、インターフェースを統一することで、新しいAPIを誕生させました。発展途上の技術ではありますが、令和の新しい時代に相応しいクールな技術であることは間違いありません。今回は、GraphQLとPrismaを用いて、バックエンドのAPIを作ってみましょう。GraphQLとは?GraphQLとは、APIのために作られたクエリー言語であり、型システムを使ってスキーマを定義することで、統一的なインターフェースを提供する仕組みです。APIの時のように複数のエンドポイントを必要とせず、シンプルに設計されています。スキーマの情報からドキュメントも自動的に作られるため、APIドキュメントを作る作業からも開放されます。良いところばかりですね。Prismaとは?Prismaとは、データベースのための新しいORマッパーです。Prismaサーバーとして、バックエンドAPIとデータベースの間に配置することで、MySQL、PostgreSQL、MongoDBといった具体的なデータベースを完全に隠蔽し、バックエンドAPIからはPrismaが自動生成したGraphQLのクエリーでアクセスできるようになります。データベースアクセスをGraphQLのインターフェースにしてしまうということです。GraphQLとPrismaのバックエンドを開発しようそれでは、GraphQLとPrismaのバックエンドアプリケーションをつくってみましょう。以下の準備が完了している必要があります。NodeJSがインストールされていることDockerがインストールされていること詳しい環境は「環境」を参照してください。ベースを作るまずは、必要はファイルとフォルダを作り、パッケージをインストールします。CLIを使えば一瞬で類似した構成を構築できます。Prismaでデータベース部分を開発する次に、Prismaでデータベースのスキーマを作りましょう。今回は、よくあるフリーマケットアプリを意識して、User、Product、Reviewのスキーマを作ってみることにしましょう。Prismaの後ろで動くデータベースはMySQLとし、Docker上で可動させることにします。mysqlなお、現時点では「rawAccess」と「migrations」はfalseにしないとPrismaのAdminページが動かないので注意が必要です。SET_NULL)}PrismaとMySQLを起動しましょう。deploy」により、スキーマがデータベースに反映されます。deploy」だけでこれらが実行さえるようにしてあります。「http://localhost:4466/」を開くとPrismaのGraphQL用のページが表示されるので、そこからGraphQLを用いてデータベースへアクセスすることができます。「http://localhost:4466/_admin」を開くとPrismaのAdminページが表示され、GUIでデータベースを操作することが可能です。admin」で自動的にページを開くこともできます。Prismaの詳しい使い方は公式ドキュメントを参照して下さい。Yogaを使ってGraphQLサーバーを構築しましょう。};これで実装は完了です。完成したバックエンドAPIの動作確認をしてみましょう。サーバーを起動します。4000...「http://localhost:4000/」を開き、以下のGraphQLのクエリーで確認してみましょう。"cjy74uvu700py0704a2c0hyub")}なお、もちろんIDは適切に設定する必要があります。このように期待通りに動作しました。試してみましょう!おまけSubscriptionの実装GraphQLの他の機能としてSubscriptionがあります。Subscriptionを簡単に説明すると、WebSocketを使ってイベント発生時にクライントに通知するGraphQLの仕組みです。今回はおまけとして、Reviewが追加された時に通知する実装を追加しましょう。=>pubsub.asyncIterator('REVIEW_CREATED'),},};実装完了です。それでは、動作確認しましょう。「http://localhost:4000/」を開き、以下を実行しましょう。{idnamepriceonSale}}}Reviewの作成時に、作成されたReviewを取得できました。APIに取って代わっていくと思いますので、機会があれば積極的に使っていきましょう。CommentTypeScriptのためのバックエンド用フレームワークNestJSにさくさく入門しようTypeScriptのためにAngularからインスパイアされて作られたバックエンド用のフレームワークNestJSについて紹介します。はじめに最近勢いがあるTypeScriptですが、皆さんはバックエンドのAPIを構築する場合はどんなフレームワークを使っていますか?TypeScriptを使わない時と同じようにExpressやHapiなどを使っている人が多いと思いますが、もう一つ新しい選択肢があります。それはNestJSです。特徴は、Angularのようにバックエンドを書ける点と、結果としてフォルダやファイルの構成が明確化されているので、構成に悩むことなく本来のAPI開発に専念できる点です。今回はNestJSで簡単なCRUDのAPIをさくさく作ってみましょう。NestJSとは?NestJSとは、TypeScriptおよびモダンJavaScriptのために作られたエンタープライズ級のNodeJSフレームワークです。冒頭でも述べたとおり、Angularにインスパイアされているため、Angularのような書き方でコーディングすることができます。(デコレータを使ったコーディングですね。)フォルダやファイルの構成も分かりやすく、フレームワークとして必要な機能もしっかりと有しています。ドキュメントもしっかり書かれており、サンプルとなるソースコードも公開されているので、すぐに開発が始められます。簡単なAPIを作ってみようそれでは、今回はユーザを管理する簡単なAPIを作ってみましょう。ベースを作るNestCLIコマンドを使ってプロジェクトを生成し、必要なフォルダとファイルを作成します。users.service.ts構成ができました。ユーザをCRUDするAPIを作るユーザを管理するCRUDのAPIを実装しましょう。app.listen(3000);}bootstrap();一通り完成しました。バリデーションを追加するPipeにJoiでのバリデーションを追加しましょう。null;}}これでバリデーションの追加ができました。テストを書いてみる最後に、コントローラーのテストを少し書いて動作確認しましょう。userController.getUser(userId1)).toThrow();});});});テストを実行してみましょう。3.83s.OKですね。最後にいかがでしたか?これでNestJSの基本はマスターできたと思います。ルールが決まっているので簡単に実装が始められるところが良いですね。ちなみに、現在NestJSのGitHubページ上に日本語のドキュメントが無いので、コントリビュートするチャンスですよ(笑)それでは。Problem」とその解決策を紹介します。はじめにアプリケーションをDocker化するにあたり、プロダクション用のDockerfileでは開発用のDockerfile以上にいくつか気をつける点があります。Problem」の対応です。Dockerをプロダクションに適用する場合は、理解しておく必要があります。それでは、問題の内容と解決策を見ていきましょう。1は「initプロセス」と呼ばれており、システムが起動した際に最初に起動するプロセスです。このinitプロセスの役割は、ゾンビプロセスの除去とサブプロセスへのシグナルの伝搬です。何の対策もせずにアプリケーションをDocker上で起動した場合、そのアプリケーションの起動プロセスがコンテナ上の最初のプロセスになってしまうため、ゾンビプロセスが残ったり、シグナルが正しく処理されないという問題が発生します。開発者として明確に困る点は、Docker化したアプリケーションが正しく停止しないことです。tiniとは?「tini」とは、コンテナ向けに作られたシンプルなinitプログラムです。Problem」を回避できます。Problem」を解決してみましょう。メッセージを返すだけのアプリケーションを作ります。.dockerignoreコードは以下のようにします。"app.js"].dockerignorenode_modules/試しにビルドして実行してみましょう。up...動作確認してから停止します。stopで停止しようとしてもすぐに停止することはなく、正しい停止処理で失敗して強制終了する形で停止しています。Codeのページを見ると書かれています。Numberに128を足した数字になります。Codeは「137」なので、128+9ということであり、「9」は「SIGKILL」のシグナルを示しているので、強制終了されていることが分かります。--initによる対応(一時的な起動)Dockerの「--init」オプションと使うことでDockerに同封されているinitプロセスを有効にできます。開発環境など一時的にこの問題を解決したい場合に適しています。それではこのオプションを付けて起動します。up...停止します。Code「143」(128+15なので「SIGTERM」)で正常に終了しています。tiniによる対応(永続的な起動)「tini」をDockerfile上に追加することでプロダクション用にこの問題を解決できます。Code「143」を「0」にマップすることにします。"app.js"]それでは変更したDockerfileでビルドして起動します。up...停止します。Code「0」で想定通りに終了しています。Problem」を解決できるようになったと思います。プロダクションでDockerを適用する際は注意しましょう。AuthorKeid自由で楽しい世界を目指すフルスタックWebデベロッパー。大学でコンピュータサイエンスを真面目に学び、日本の大手IT企業に就職後、新しい技術やスケールするビジネスが北米にある事に気づき、海外への挑戦を決意。英語ができなかっため、フィリピン留学およびカナダ留学を経て強制的に英語を上達させた。このブログでは海外に挑戦したいエンジニアやデザイナーに少しでも有益な情報を提供していきたいと思う。0.0010このブログの運営のためにBitcoinでの寄付を募集しています。お気持ち程度の寄付を頂けると管理者の励みになります。