LUDGI's nextjs Project Setup and Documentation

⚠️ Prerequisites: This application requires the following Docker containers to be running:

• Redis
• RabbitMQ

The application will not function properly unless these services are running.

Node Version

Ensure you are using the following Node.js version:

• v22.12.0

---

Installation and Running the Project

Package Installation

pnpm install

Start the Project

pnpm run dev

---

PostgreSQL Setup

Start PostgreSQL Service

cd docker-compose/postgres
docker compose -f postgres-compose.yml up --build -d

Access PostgreSQL Container

docker exec -it postgres_db bash

Connect to the Database

Ensure the database mydb is created and configured properly.

psql -U postgres -d mydb

Shut Down PostgreSQL Service

docker compose -f postgres-compose.yml down

Manage Volumes

• List Volumes

  docker volume ls

• Inspect Volume

  docker volume inspect postgres_db_volume

• Remove Volume

  docker volume rm postgres_db_volume

PostgreSQL Commands

• Show Port

  psql -U postgres -d mydb -c "SHOW PORT;"

• List Users

  psql -U postgres -d mydb -c "\du"

• List Databases

  psql -U postgres -d mydb -c "\l"

• Create Database

  psql -U postgres -d mydb -c "CREATE DATABASE mydb;"

• Create Table

  psql -U postgres -d mydb -c "CREATE TABLE users (id SERIAL PRIMARY KEY, name VARCHAR(255), email VARCHAR(255));"

• Create User

  psql -U postgres -d mydb -c "CREATE USER myuser WITH PASSWORD 'mypassword';"

• Grant Privileges

  psql -U postgres -d mydb -c "GRANT ALL PRIVILEGES ON DATABASE mydb TO myuser;"

---

Prisma Setup

• Reference: Prisma Setup Guide

Database Migration

npx prisma migrate dev

Open Prisma Studio

npx prisma studio

Generate Prisma Client Code

npx prisma generate

Push Prisma Schema to Database

npx prisma db push

Deploy Prisma Migrations

npx prisma migrate deploy

Reset Prisma Migrations

npx prisma migrate reset

List Prisma Migrations

---

GraphQL Code Generation

• Refer to the following resources:
  • GraphQL Documentation
  • Code Generation Guide

---

Code Analysis

Run Bundle Analysis

npx run analyze

---

CLI Usage

This project uses commander and inquirer for an intuitive command-line interface. The CLI tool can be explored further at its npm package page.

• Check Version

  npx ludgi-cli -V

• Create a New Command

  npx ludgi-cli -n getUserProfile

• Delete a Command

  npx ludgi-cli -d

• List All Commands

  npx ludgi-cli -l

---

Redis Setup

• Reference: Redis Documentation

Start Redis Container

sh docker-compose/redis/up.sh

Start Redis in Background

docker compose -f docker-compose/redis/redis-compose.yml up -d

Configure Password

Update .env file to reflect the new password.

docker exec redis_cache redis-cli CONFIG SET requirepass ludgi1234

Verify Password

docker exec redis_cache bash -c 'echo "PING" | redis-cli -a ludgi1234 2>/dev/null'

Stop Redis Container

docker compose -f docker-compose/redis/redis-compose.yml down

Access Redis CLI in Docker

docker exec -it redis_cache redis-cli

---

RabbitMQ

Start RabbitMQ Container

docker compose -f docker-compose/rabbitmq/rabbitmq-compose.yml up -d

Stop RabbitMQ Container

docker compose -f docker-compose/rabbitmq/rabbitmq-compose.yml down

Access RabbitMQ Management Console

• URL: http://localhost:15672/
• Default Credentials:
  • Username: admin
  • Password: admin123

---

React Hook Form with Zod

• Resources:
  • React Hook Form
  • Resolvers for Zod

---

Next-Safe-Action

• Documentation: Next-Safe-Action

---

ESLint Setup

• Documentation:
  • Next.js ESLint Configuration
  • Prettier ESLint Config

---

Storybook

• Documentation: Storybook
• Start Storybook:

  npm run storybook

---

Cypress

• Documentation: Cypress
• Open Cypress:

  npm run cy:open

---

Dummy Data Generation

Generate dummy data for development purposes:

npx tsx scripts/createDummyData.ts

---

Prometheus and Grafana

Start Prometheus and Grafana

docker compose -f docker-compose/prometheus_grafana/prometheus-grafana-compose.yml up -d

Access Web Interfaces

• Prometheus: http://localhost:9090
• Grafana: http://localhost:8081

---

Next.js Integration

Install Prometheus client for metrics:

npm install prom-client

• Metrics Endpoint: /api/metrics
• Example API: /api/example

App Build with Docker Compose

To build the app using Docker Compose, use the following commands:

docker builder prune
docker compose -f app-compose.yml down
docker compose -f app-compose.yml up --build -d
docker compose -f docker-compose/app/app-compose.yml up --build -d

---

GraphQL

Field Selection

• Refer to the Field Selection Documentation.

Resolvers

• Learn more about GraphQL Resolvers.

GraphQL-WS Documentation

• Reference: GraphQL-WS Documentation

---

Type Definitions and Descriptions

Type Definition	Description	Example
Root Type	Entry point for API requests	Query, Mutation
Custom Type	Data structure used by API	User, Post, Comment

---

Prisma Optimization

• Reference: Prisma Optimization Guide

app build

manual(recommended)

docker builder prune # if you want to delete all the build cache
cd docker-compose/app
docker compose -f app-compose.yml down
docker compose -f app-compose.yml up --build -d

auto

sh docker-compose/app/build.sh