>> 發文日期 : 2023/8/9
終於有機會在專案開發上接觸到GraphQL,雖然是負責前端的工作,但同時也一起學習一下,順便比較看看跟之前寫Restful的差異。
因為已經習慣用Typescript開發,就先把Typescript的環境建好,接著安裝Apollo Server 4,並且安裝相關的套件。
建立一個index.ts,並且在裡面建立一個Apollo Server,另外我們需要建立兩個typeDefs跟resolvers,這兩個是Apollo Server必須要的,typeDefs是定義GraphQL的Schema,而resolvers則是定義Schema的實作。
建立一個typeDefs,需要注意兩個比較特別的type,Query跟Mutation,Query是用來查詢資料,Mutation則是用來修改資料,這邊我們先建立一個Query,並且定義一個type為String的hello。
建立一個resolvers,並且實作hello的功能,這邊我們先回傳一個字串。
執行npm start,並且在瀏覽器輸入http://localhost:4000,就可以看到GraphQL的介面,這邊我們可以在左邊的Query輸入hello,並且按下執行,就可以看到右邊的結果。
這次的範例主要只是快速建立個簡單的Apollo Server來實作GraphQL,當然上方的Github範例裡有其他功能,像是Mutation,資料的處裡與型別的定義,有興趣的可以參考看看。