Chapter 02無料公開

プロジェクト作成

nekoniki
nekoniki
2020.10.29に更新

はじめに、下記コマンドでプロジェクトを作成します。
名前はtypescript-graphql-tutorialとします。

mkdir typescript-graphql-tutorial
cd typescript-graphql-tutorial

さらに対象ディレクトリでVSCodeを起動します。

code ./

yarn initもしくは手動でpackage.jsonを作成します。
yarn initで作成した場合はプロジェクト名等々を聞かれますが基本的にはデフォルトで問題ありません。

最終的に以下のようなpackage.jsonが出来上がればOKです。

package.json
{
  "name": "typescript-graphql-tutorial",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT"
}

ライブラリのインストール

以下のコマンドでライブラリをインストールしていきます。
今回の主役となるgraphql-yogaTypescriptで動作させるにあたって必要となるnodemon,ts-node,typescriptをインストールします。

yarn add graphql-yoga
yarn add -D nodemon ts-node typescript 

基底ディレクトリの作成

ルートディレクトリのままだとソースが散らかってしまうのでsrcディレクトリを作成します。
以降のソースはsrc以下に作成していくものとします。

mkdir src
cd src

型ファイルの作成

以降の章で扱っていくデータ型を定義するファイルを作成します。
src/types.tsファイルを作成し、以下のように記述しましょう。

src/types.ts
export type Chapter = {
    no: number;
    name: string;
    version: string;
    original: boolean;
    postDate: string;
}

Chapterという型を定義しました。
noなどのいくつかのプロパティを持つ型です。
今回のハンズオンでは、このChapter型のデータをやりとりしていくモックを作成します。