5 minutes GraphQL Environment Setup

An easy way to set up GraphQL Server with any database in under 5 minutes.

Setting up a GraphQL server is a very tedious part for me. I am sure that whenever you get a new idea you want to start working immediately on it but spending an hour just to start working on a project is a mood-killer.

Here I am showing you how you can set up a GraphQL server from scratch using Apollo & Prisma.

What is GraphQL, Apollo & Prisma?

As stated by Facebook in official documentation —

GraphQL is a query language for your API, and a server-side runtime for executing queries using a type system you define for your data. GraphQL isn’t tied to any specific database or storage engine and is instead backed by your existing code and data.

Apollo is the industry-standard GraphQL implementation, providing the data graph layer that connects modern apps to the cloud.

Prisma is a next generation ORM for Node.js & TypeScript. It helps app developers build faster and make fewer errors with an open source ORM for PostgreSQL, MySQL and SQLite.

Okay so enough with the introduction. If you are here then you already know what GraphQL is and you know it’s SDL. Apollo is something that will make our process of setting graphQL server very easy and Prisma will make us feel heavenly for connecting a database to the server.

All you need to do is follow these steps and you are done.

Let’s get started —

Step 1: Open terminal or Powershell and navigate where you want to create a project. Now copy the command given below, paste it in the terminal and edit the [project name].

mkdir [project name] && cd [project name] && touch index.js && echo type Query {info: String!} > schema.graphql && echo const resolvers = {}; module.exports = resolvers; > resolvers.js && npm init -y && npm install apollo-server nodemon prisma && npx prisma init

This command will create a new project directory, navigate into it, initialize a new node.js project, install dependencies, initialize Prisma, and create necessary files to work on the project.

**For an in-depth analysis and explanation, I will soon write an article and link it at the bottom of this article soon.**

Edited/Changed project name or folder name.
Edited/Changed project name or folder name.

Step 2: This step is pretty simple, all you need to do is to create a new database. That’s it. Doesn’t matter if you are using CLI or DBMS just create a new schema/database and remember its name. We will need it in the next step.

Step 3: Now open the project folder in a code editor (I prefer VS Code) and navigate to schema.prisma inside prisma subdirectory. Here you have to add and modify few things —

  1. You have to set the provider to your desired database which you are going to use. For me, it’s MySQL so I will set
provider = “mysql”

2. You need to have an initial model to migrate for the very first time. So, write a simple started model or just copy-paste the one given below (You can/should remove it later)

model User {id Int @id @default(autoincrement())name String?
}

Now open your .env file and edit your DATABASE_URL. If you are using postgresql then you just need to edit some minor details but if you are using some other database then you can go to their website and search for database connection URLs and you will find one for sqlite and MySQL. I am using MySQL so I will use the MySQL one.

”mysql://[user_name]:[password]@localhost:3306/[database_name]”

You need to define the name of the database too which we created in step 2 to hook up a particular database with it.

3. Now run this command given below and just press enter to create your first database migration.

npx prisma migrate dev && npx prisma generate

Step 4: This is a pretty easy step too. All you need to do is to copy & paste everything given below in the index.js file situated in the root directory.

**For detailed explanation check out the detailed article where I will explain everything in detail soon.**

Step 5: For the last step, you just need to run node server or using nodemon and then start the Prisma Studio server too. (Run both the commands on different terminal windows)

node index.jsnpx prisma studio

Step 6: WRITE YOUR SCHEMA AND RESOLVERS!!!!!

Everything is set up, all you need to do is write your own GraphQL schema, resolvers & Prisma schema.

Note: Every time you make changes to the Prisma schema you need to run the migration command as well as the generate command. You can do that by running the command given below —

npx prisma migrate dev --name [migration name]npx prisma generate

That’s it! That’s everything you need to do to set up a graphQL server in under 5 minutes with the database of your own choice connected to it. Now you can spend time building an amazing product instead of worrying and wasting time on the setup part.

Soon I will write an in-depth explanation of everything we did above and leave the link here, so don’t miss out on it.

If you have any suggestions for me then I would love to hear them and improve myself.

Thank You for reading. ❤

Connect with me on Instagram: https://www.instagram.com/sarthak_rohatgi/

Send me an E-mail: sarthakrohatgi.22@gmail.com

Programming enthusiastic who aims to keep learning more and more things.