DEV Community

Cover image for Responsive ToDo App Using Redis As Main Database
Mayank Singh Tomar
Mayank Singh Tomar

Posted on

Responsive ToDo App Using Redis As Main Database

Overview of My Submission

Here, we are going to make a simple todo-app showing how we can use redis as main db.

  • For starters in backend server we will be using express, cors,redis-om. Where:

express: Provides basic server for connecting db and frontend.

cors: Provides connection btw backend and frontend.

redis-om: It is new library by redis which provides all basic neccessities required in a databse and can be managed and created using redis-cloud.

# Note: See repo on how to setup the basic db and api's.Link To Backend
  • Now lets setup the database:
  1. Here, we will be using redis cloud db which comes in both free and paid db @Redis-Cloud.
  2. For creating a db in redis cloud you just need to signup on #link and create a subscription.
  3. On creating a subscription redis will provide a db with particular endpoint and defaultuser&password.
  4. We just need endpoint and password for accessing the db.
  5. Then we will create the schema on which the db will work.
# Note: See repo on how to setup Schema. Link To Schema
  • Later, for frontend we will be using react as framework and bootstrap 5 as styling.
# Note: See repo on how to setup Frontend. Link To frontend
  • The whole process works as:
  1. Firstly, on initiating the backend we create a server on port 8000 which provides access to db and initiates api's.
  2. On otherhand, the frontend which is initiated on port 3000 can call api's to access the db and edit or update it.
  3. On for checking db we can use RedisInsight which is free to download provided by redis.
# Note: RedisInsight keeps db record on local machine. It helps in easy access to db and also it makes db easy to read and modify.Link To redisinsight

Submission Category: MERN Mavericks

Following languages are used in this project: JS/Node.js/CSS.

Here, you can find complete source code of the project:

Link To Source Code

The demo app can be seen on:

Link To Demo


Top comments (0)