App is currently in construction.

Inkling

Inkling, one player draws a word or phrase while others race against the clock to guess what it is.

Tech Stack
Architecture
Installation
Frontend Deployment to Vercel
Backend Deployment to Render

Tech Stack

Vite + Typescript + React.js
ShadcnUI
Tailwind CSS
Zod
Node.js + Express.js
MongoDB + Mongoose
Redis Cloud
Knip
Socket.io
Husky
Docker (optional)

Architecture

├── 📁.husky                   # Git hooks for pre-commit checks  
├── 📁backend                  # Backend logic with API, models, services, and configurations  
│   ├── 📁src                  # Source code for the backend  
│   |   ├── 📁config               # Configuration for MongoDB, Redis, and Socket.IO  
│   |   ├── 📁models               # MongoDB models for User and Game  
│   |   ├── 📁routes               # API routes (Auth) with controllers
│   |   ├── 📁utils                # Utility functions like JWT and hashing 
│   |   ├── 📁services             # Service logic (e.g., game services) 
│   |   ├── server.js          # Server entry point  
│   |   └── app.js             # Creating an express instance
│   ├── Dockerfile             # Docker configuration
│   ├── knip.config.js         # Knip configurations
│   └── docker-compose.yml     # Multi-container Docker setup  
├── 📁frontend                 # Frontend code using Vite + React + Typescript with Tailwind CSS  
│   ├── 📁@                    # ShadcnUI components and utility libraries  
│   ├── 📁public               # Public assets  
│   ├── 📁src                  # Source code for frontend app  
│   |   ├── 📁context              # React contexts (Auth, Canvas, Game)  
│   |   ├── 📁hooks                # Custom hooks for API requests and sockets  
│   |   ├── 📁pages                # Application pages like Account and Game  
│   |   └── 📁utils                # Helper functions (e.g., date and drawing utilities)
│   ├── tailwind.config.js     # Tailwind CSS configuration  
│   ├── tsconfig.json          # TypeScript configuration  
│   └── vite.config.ts         # Vite configuration  
└── .gitignore                 # Files to be ignored by Git

Installation

Clone the repo

git clone

Move to Inkling

cd Inkling

Install dependencies

npm install

Frontend
1. Move to frontend
```
cd frontend
```
1. Install dependencies
```
npm install
```
1. Create a .env file
```
touch .env
```
1. Add server url
```
VITE_SERVER_URL=http://localhost:3000
```
1. Run the development server
```
npm run dev
```
Backend (with docker)
1. Move to backend
```
cd backend
```
1. Pull the docker container
```
docker pull immortalnova/inkling
```
1. Create a .env file
```
touch .env
```
1. Add the below to .env file
```
NODE_ENV=development
```
1. Create a MongoDB database and add your Mongo URL to .env file
```
MONGO_URL=mongodb+srv://.....
```
1. Generate a random secret key for digital signing (run in terminal) :
```
openssl rand -base64 32
```
1. Add your secret key used to hash JWT tokens
```
JWT_SECRET=secret_key.....
```
1. Create a Redis Cloud account and add your Redis details to .env file
```
REDIS_PASSWORD=password.....
REDIS_HOST=redis-something.....redis-cloud.com
REDIS_PORT=xxxxx
```
1. Add client url
```
CLIENT_URL=http://localhost:5173
```
1. Run an image locally (with env variables):
```
docker run --env-file ./.env -p 3000:3000 immortalnova/inkling
```
Backend (without docker)
1. Move to backend
```
cd backend
```
1. Install dependencies
```
npm install
```
1. Create a .env file
```
touch .env
```
1. Add the below to .env file
```
NODE_ENV=development
```
1. Create a MongoDB database and add your Mongo URL to .env file
```
MONGO_URL=mongodb+srv://.....
```
1. Generate a random secret key for digital signing (run in terminal) :
```
openssl rand -base64 32
```
1. Add your secret key used to hash JWT tokens
```
JWT_SECRET=secret_key.....
```
1. Create a Redis Cloud account and add your Redis details to .env file
```
REDIS_PASSWORD=password.....
REDIS_HOST=redis-something.....redis-cloud.com
REDIS_PORT=xxxxx
```
1. Add client url
```
CLIENT_URL=http://localhost:5173
```
1. Run development server:
```
npm run dev
```

dhruvkjain/Inkling

Inkling

Contents

Tech Stack

Architecture

Installation

Frontend Deployment to Vercel

Backend Deployment to Render