Beginner’s Guide to GraphQL in React Native & React(1/3)(Updated)

We will explain GraphQL, and build a basic GraphQL server for this part of the guide.

“turned on iMac and displaying game application” by Aral Tasher on Unsplash

So what is GraphQL?

GraphQL is a query language, where you would define schemas or the structure of your data such as object types, resolvers which will execute each field in the schema, and connectors which are for defining or retrieving your database instance for your resolvers, which will return the data indicated by the schema. It enables a versionless server, which means that the API will update itself. It also enables pagination and other cool features.

GraphQL vs REST?

GraphQL server can be accessed from one endpoint, which will send our entire server.

mkdir top25NFLPlayerMobile 
cd top25NFLPlayerMobile
npm init -y
react-native init top25NFLPlayers
mkdir server && cd server
touch index.js
npm i -D nodemon babel-cli babel-preset-es2015 babel-preset-stage-2
npm i -S apollo-server graphql graphql-tools mongoose dotenv
Start a simple server
npm start
Graphql playground.
CONNECTION_STRING = <CONNECTION STRING>
/node_modules
.env
touch typeDefs.js resolvers.js connectors.js
connect to your database.
Define your Player Model
Define your type definitions for your schema.
Define how your fields are executed.
Your Apollo Server
Graphql Server
npm i -S apollo-server graphql graphql-tools mongoose dotenv
Add main and proxy properties to your package.json
mkdir server
cd server
touch index.js
Have your basic react/graphql server running.
CONNECTION_STRING=<MongoDB Connection String>
touch typeDefs.js resolvers.js connectors.js
Connect to your mongodb database using mongoose.
Define your Player Model
Define your type definitions for your server.
Define how your fields in your schema are executed.
Define your server.
Data Retrieved!

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store