minxa.lol – Frontend
This is the React-based frontend for minxa.lol, a modern and lightweight URL shortener.
🧰 Tech Stack
- React – Frontend UI framework
- TypeScript – Typed JavaScript
- Create React App – App bootstrap and tooling
- Tailwind CSS – Utility-first styling
- Redux Toolkit – State management
⚙️ Environment Setup
1. Install Dependencies
npm install
2. Create .env File
cp .env.example .env
Edit the .env file to configure the API URL:
REACT_APP_API_BASE_URL=http://localhost:8000
🚀 Running the Frontend
Development Server
npm start
This starts the development server on http://localhost:3000.
Production Build
npm run build
Test
npm test
Docker (via Docker Compose)
From the root of the project:
python generate_configs.py
docker compose -f docker-compose.generated.yml up --build -d
📁 Directory Overview
frontend/
├── public/ # Static assets
├── src/
│ ├── api/ # API functions
│ ├── app/ # Redux store and hooks
│ ├── features/ # Feature slices
│ ├── pages/ # Page components
│ ├── routes/ # App router
│ └── utils/ # Client-side utilities
├── .env.example # Sample environment file
├── package.json # Project config and scripts
├── tailwind.config.js
├── tsconfig.json
└── README.md
🧪 Testing (Coming Soon)
Testing will be supported via React Testing Library and Jest.