A professional, production-ready precious metals asset tracking application built with Node.js, TypeScript, React, and comprehensive testing.

• RESTful API with 6 endpoints for complete asset management
• MySQL Database with Sequelize ORM for production reliability
• TypeScript throughout for type safety and better development experience
• Real-time Price Simulation with configurable volatility
• Comprehensive Security with Helmet, CORS, and rate limiting
• Health Check Endpoint for monitoring and deployment
• Input Validation with detailed error messages
• Graceful Error Handling with custom middleware

• Modern React 18 with hooks and functional components
• Professional UI/UX with responsive design and animations
• Live Price Updates with real-time price fluctuations
• CRUD Operations for asset management
• Form Validation with user-friendly error messages
• Mobile-First Design with responsive breakpoints
• Loading States and error handling

• Jest Unit Tests with 13 comprehensive test cases
• Cypress E2E Tests covering all user workflows
• ESLint & Prettier for code quality and consistency
• Webpack 5 for modern frontend build system
• Docker Support with multi-stage builds
• Hot Module Replacement for development efficiency

• Node.js 18+
• npm 8+
• Docker & Docker Compose (optional)
• MySQL 8.0 (if running without Docker)

# Clone the repository
git clone <repository-url>
cd mini-asset-tracker

# Start with Docker Compose
npm run docker:compose

# The application will be available at:
# - Frontend: http://localhost:3001
# - Backend API: http://localhost:3000
# - Health Check: http://localhost:3000/health

# Development environment with hot reload
npm run docker:compose:dev

# View logs
npm run docker:compose:logs

# Stop all services
npm run docker:compose:down

# Clean up containers and volumes
npm run docker:compose:clean

# Access container shell
npm run docker:shell

# Run tests in container
npm run docker:test

# Run linting in container
npm run docker:lint

# Clone and install dependencies
git clone <repository-url>
cd mini-asset-tracker
npm install

# Start MySQL database only
docker-compose up -d mysql

# Start development servers
npm run start:dev

# Or start separately:
# Backend: npm run dev
# Frontend: npm run dev:frontend

src/
├── controllers/        # Business logic and request handling
├── models/            # Database models with Sequelize
├── routes/            # API route definitions
├── config/            # Database and environment configuration
├── middleware/        # Custom middleware (error handling, etc.)
└── __tests__/         # Jest unit tests

src/frontend/
├── components/        # React components
├── services/         # API client and utilities
├── types/            # TypeScript type definitions
├── utils/            # Utility functions
└── styles/           # CSS files

• GET /api/v1/assets - List all assets
• POST /api/v1/assets - Create new asset
• GET /api/v1/assets/:id - Get asset by ID
• PUT /api/v1/assets/:id - Update asset
• DELETE /api/v1/assets/:id - Delete asset
• GET /api/v1/assets/:id/price - Get live price

# Get all assets
curl http://localhost:3000/api/v1/assets

# Create new asset
curl -X POST http://localhost:3000/api/v1/assets \
  -H "Content-Type: application/json" \
  -d '{"name":"Gold","symbol":"AU","price":1950.00}'

# Get live price
curl http://localhost:3000/api/v1/assets/1/price

# Run all tests
npm test

# Run tests in watch mode
npm run test:watch

# Run tests with coverage
npm run test:coverage

# Run E2E tests headlessly
npm run test:e2e

# Open Cypress GUI
npm run test:e2e:open

# Run all tests
npm run test:all

• 13 Jest unit tests covering all API endpoints
• 10+ Cypress E2E tests covering user workflows
• API error handling and validation
• Frontend component testing
• Responsive design testing

• View Assets: Grid layout with live price updates
• Create Assets: Modal form with validation
• Edit Assets: Inline editing with save/cancel
• Delete Assets: Confirmation dialogs
• Live Prices: Real-time price simulation

• Responsive Design: Mobile-first approach
• Loading States: Spinners and skeleton screens
• Error Handling: User-friendly error messages
• Accessibility: Keyboard navigation and ARIA labels
• Modern UI: Gradient backgrounds and smooth animations

• Helmet.js: Security headers
• CORS: Cross-origin resource sharing
• Rate Limiting: 100 requests per 15 minutes
• Input Validation: Comprehensive request validation
• SQL Injection Prevention: Parameterized queries with Sequelize
• XSS Protection: Content Security Policy

CREATE TABLE assets (
  id INT AUTO_INCREMENT PRIMARY KEY,
  name VARCHAR(255) NOT NULL,
  symbol VARCHAR(10) NOT NULL,
  price DECIMAL(10,2) NOT NULL,
  createdAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  updatedAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
);

# Build and start production services
npm run docker:compose

# Build production image only
npm run docker:build

# Run production container
npm run docker:run

# Or using docker-compose directly
docker-compose up --build -d

# Start development environment with hot reload
npm run docker:compose:dev

# View real-time logs
npm run docker:compose:logs

# Stop all services
npm run docker:compose:down

# Clean up everything (containers, volumes, images)
npm run docker:compose:clean

NODE_ENV=production
PORT=3000
DB_HOST=localhost
DB_PORT=3306
DB_NAME=asset_tracker
DB_USER=root
DB_PASSWORD=rootpassword
DB_DIALECT=mysql

# Development
npm run dev                 # Start backend server
npm run dev:frontend       # Start frontend server
npm run start:dev          # Start both servers

# Building
npm run build              # Build backend
npm run build:frontend     # Build frontend
npm run build:all          # Build both

# Testing
npm test                   # Run unit tests
npm run test:e2e          # Run E2E tests
npm run test:all          # Run all tests

# Code Quality
npm run lint              # Run ESLint
npm run format           # Run Prettier
npm run precommit        # Run all quality checks

For even simpler Docker management, use the provided Makefile:

# Show available commands
make help

# Build and start services
make up

# Start development environment
make up-dev

# View logs
make logs

# Stop services
make down

# Clean up everything
make clean

# Run tests
make test

# Access container shell
make shell

# Access database shell
make db-shell

• Webpack Code Splitting: Vendor and app bundles
• Database Indexing: Optimized queries
• Connection Pooling: Efficient database connections
• Compression: Gzip compression for static assets
• Caching: Browser caching headers
• Bundle Analysis: Source maps and optimization

The application includes a sophisticated price simulation system:

• Base Price: Initial asset price
• Volatility: Configurable price fluctuation (±2% by default)
• Real-time Updates: Prices update every 3-5 seconds
• Price Changes: Visual indicators for price movements
• Historical Tracking: Last updated timestamps

• User authentication and authorization
• Real-time WebSocket updates
• Price history charts and analytics
• Asset categories and filtering
• Export functionality (CSV, PDF)
• Push notifications for price alerts
• Multi-currency support
• Advanced charting with technical indicators

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

This project is licensed under the MIT License - see the LICENSE file for details.

• Built with modern web technologies
• Inspired by real-world asset tracking applications
• Comprehensive testing approach
• Professional development practices

Built with ❤️ using Node.js, TypeScript, React, and modern web technologies