Skip to main content

Posts

Showing posts with the label graphql

Utilise GraphQL and Apollo Client for Maintaining React State

One library that is quite popular to allow our application to interact with the GraphQL server is Apollo Client ( @apollo/client ). It has support for several popular client libraries including React. It also provides cache management functionality to improve the performance of the application when interacting with GraphQL. Rather than integrating another library to manage our application state, we can leverage what Apollo Client already has to maintain the state. The solution is achieved by creating a customised query to load the result from a local variable or storage. Then, the query is executed like other queries using useQuery() . The steps are as follows. Create a local query that will read data only from the cache. Create a cache that defines a procedure for the query to read data from local values. Call the query anytime we want to read the state value. For instance, we want to read the information of the current user that has successfully logged in...

Create A GraphQL Server Using Express and Apollo Server

GraphQL can be described as a query language for API. GraphQL was initiated by Facebook developers when they tried to build a better data fetching mechanism for their mobile application. By using GraphQL, frontend developers can request any data from the backend server with specified format and properties based on their actual needs. Creating a server that has support for handling GraphQL-based requests has become easy nowadays. Express as a de-facto framework for building HTTP server has the capability to be integrated with Apollo Server which is a popular GraphQL server. Minimal modules that we need are express , graphql , and apollo-server-express . For instance, we will set up a project and build the requirements. We utilize ESM syntax for building the sample program. Firstly, we initiate the project and install the dependencies. mkdir express-graphql cd ./express-graphql yarn init -y yarn add express graphql apollo-server-express Because we use ESM syntax, we need to set the...