Introduction
Learning a new technology can be overwhelming and time-consuming. But what if you could quickly build a production-scale application that grows with your business needs? With the Express-Apollo-Prisma Starter kit from starter.dev, you can quickly and easily get up and running with a modern, scalable web application that can stand the test of time.
In this blog post, we will cover what's included in the kit, how to set it up, and how to use the provided tools to create a scalable web application. We will also discuss how to extend the starter kit to add features like authentication. Finally, we will look at how to use the provided tools to ensure that your application is well-maintained and efficient.
By the end of this post, you will have a better understanding of how to use the Express-Apollo-Prisma starter kit to create a production-scale web application.
Prerequisites
- You will need a development environment running Node.js; this tutorial was tested on Node.js version 16.18.0 and npm version 9.4.2.
- You will also need to have docker-compose installed on your machine.
What is Included in the Express-Apollo-Prisma Starter Kit?
The Express-Apollo-Prisma starter kit is a scaffolded repository that provides you with a complete web application with a modern tech stack. The kit comes with everything you need to get started, including:
- Express: a popular web framework for Node.js. It provides a robust set of features for building web applications and APIs.
- Apollo Server: an open-source GraphQL server that is compatible with any GraphQL client. It is used to serve the GraphQL API.
- Prisma: a next-generation ORM that makes working with databases easy for application developers. It provides a powerful data layer for your application.
- MySQL: a popular open-source relational database management system. It is used to store data for the application.
- Redis: an in-memory data structure store that is used to cache data for the application.
- RabbitMQ: an open-source message broker that is used to manage communication between services.
In addition, the kit also comes with a number of included tooling such as Jest for testing, TypeScript for type-checking, and ESLint and Prettier for code linting and formatting.
How to Set Up the Express-Apollo-Prisma Starter Kit
Setting up the Express-Apollo-Prisma starter kit is simple. The easiest way to get started is to use the starter.dev CLI. All you need to do is run the following command:
npm create @this-dot/starter --kit express-apollo-prisma
or
yarn create @this-dot/starter --kit express-apollo-prisma
Once the command has been run, you will be prompted to select the express-apollo-prisma starter kit, and to name your new project. You then need to cd into your project directory and run npm install to install the dependencies.
Next, you need to create a .env file and copy the contents of .env.example into it. This file will contain the environment variables for your application.
After that, you need to start the database and the Redis instances. You can do this by running the command npm run infrastructure:start. This will start the database and other required services in Docker containers.
Finally, you can start the development server by running the command npm run dev. This will start the Express server and the Apollo Server. If all goes well, you should be able to access the API documentation at http://localhost:4001.
Prisma and MySQL
As we began developing this starter kit, we chose to use Prisma and MySQL as our database because of its extensive features and trustworthiness in the industry. Its open-source object-relational database system can accommodate high levels of concurrency and big data, as well as complex queries and data types. Moreover, due to its extensibility, developers can add custom functions and data types to the database. Because of its expansive and engaged group of developers and users, Prisma and MySQL is an ideal selection for applications of any magnitude.
To connect to the database instance, the kit employs Prisma and MySQL. Prisma was chosen because it simplifies the management of database connections and the execution of common database operations such as querying, inserting, updating, and deleting data. It supports a variety of databases, including MySQL. It also makes it easier to switch between databases.
Prisma offers a range of features that assist in managing changes to the database schema over time, including database migrations. Prisma is a useful tool for streamlining database-related code, enhancing its efficiency and reliability. It can be a beneficial addition to any TypeScript or JavaScript project that requires interaction with a database.
To introduce an initial set of data into your database, run the following commands:
npm run infrastructure:start - this starts up the database instance
npm run db:seed - this seeds the database
The seed command runs the prisma/seed.ts file, where you can introduce your seeders for your own needs.
You can also use Prisma studio to provide a straightforward, grid-based view of the data present in the database defined in the kit:
npx prisma studio
Caching
When dealing with high levels of concurrent requests, it is important to have a caching strategy in place to reduce API response times, and rate limiting. Caching can make an API faster and more responsive by decreasing the time it takes to retrieve data from the server. It can also reduce the amount of load placed on the database, or bypass rate limiting on external APIs used by the back-end. The starter kit comes with Redis as the caching layer. Redis is an in-memory data structure store that is used to cache data for the application.
We use Redis to cache the calls to the database, the Prisma entities include a caching mechanism to decrease the time it takes to retrieve data. Each entity has optional caching, which can be achieved by passing the Redis client with the TTL (time to live) in the src\graphql\server-context\server-context-middleware-options.ts file.
Queue
A message queue allows different applications or components to communicate with each other in a decoupled and asynchronous manner. It enables one application to send messages to another application or component without having to wait for a response, or be directly connected to it. This allows the sender and receiver to operate independently, and at their own pace. The use of message queues can improve the scalability, reliability, and performance of distributed systems by reducing coupling between components, providing fault-tolerance, and optimizing resource utilization.
The kit provides an implementation of queueing using RabbitMQ, the most widely deployed open-source message broker that allows multiple applications to communicate with each other through queues.
To start the worker that processes messages in the queue, run the commands:
npm run infrastructure:start- starts the RabbitMQ server (you can skip this if you already ran this command)npm run queue:run- starts the queue worker
This should start a process that listens for messages in our queue and processes them. See the queue/worker.ts file to modify it to your needs:
// Listener
channel.consume(AMQP_QUEUE_JOB, (message) => {
// process queue message here
});
The src/queue/job-generator-handler.ts file contains the logic for generating a job and adding it to the queue. The createJobGeneratorHandler function creates an Express request handler that accepts a message, and adds it to the queue. The createQueueChannel function sets up a connection to the RabbitMQ server and returns a channel object, which is used to perform various actions on the queue, such as creating a new queue, binding it to an exchange, and publishing a message to the queue.
To use this implementation of queueing, you can send a POST request to the /example-job endpoint with a message in the request body, and the message will be added to the queue. Once the message is in the queue, it will be processed in the order it was added
curl -X POST http://localhost:4001/example-job
-H “Content-Type: application/json”
-d '{“message”:”simple queue message!”}'
How to Extend the Starter Kit to Add Features
The Express-Apollo-Prisma Starter Kit is designed to be extensible, so you can easily add new features and functionality to your application. You can add additional GraphQL modules to your application. To do this, you need to create a new folder in src/graphql/schema and add the relevant files to it. There are some examples already included to get you started. Once the files are added, you will need to update the src/graphql/server-context/server-context-middleware-options.ts file to include the new module.
In order to add authentication to your application, you need to add a GraphQL mutation that will handle user registration and authentication. You can then use the passport library to integrate with the mutation.
You can also add custom Express middleware to your application by updating the src/main.ts file.
Conclusion
The Express-Apollo-Prisma Starter Kit is a great starting point for quickly getting up and running with a production-scale web application. With its modern tech stack and included tooling, you can quickly build a scalable, well-maintained application that can grow with your business needs.
This post has covered what's included in the kit, how to set it up, and how to use the provided tools to create a scalable web application. We have also discussed how to extend the starter kit to add features like authentication and how to use the provided tools to ensure that your application is well-maintained and efficient.
The Express-Apollo-Prisma Starter kit is a great tool for any web developer, and with the included tooling, you can quickly create a robust, enterprise-grade application.
