Skip to content

Latest commit

 

History

History
293 lines (217 loc) · 9.03 KB

File metadata and controls

293 lines (217 loc) · 9.03 KB

syscare-dynamicdev_

🛠️ ITSM System (Information Technology Service Management)

Docker Node.js React TypeScript PostgreSQL License

A modern, full-stack IT Service Management system built with React, Node.js, and PostgreSQL.

FeaturesTech StackInstallationUsageScreenshots


🎯 Overview

syscare-dynamicdev_ is a comprehensive IT Service Management (ITSM) system designed to streamline service request handling, ticket management, and customer support operations. Built with modern web technologies and a sleek Cyberpunk Tech Red theme, it provides an intuitive interface for both customers and administrators.


✨ Features

📋 Customer Portal

  • Service Request Submission - Customers can submit tickets with detailed descriptions
  • File Attachments - Support for multiple image uploads (up to 5 files)
  • Priority Selection - Low, Medium, High, and Critical priority levels
  • Real-time Notifications - Instant feedback on ticket status

🎛️ Admin Dashboard

  • Ticket Management - View, update, and resolve service requests
  • Status Tracking - New → In Progress → Resolved workflow
  • Admin Notes - Internal notes visible to customers
  • Statistics Dashboard - Real-time charts and analytics
  • Notification Bell - Real-time alerts for new tickets

👥 Role-Based Access Control (RBAC)

  • Super Admin - Full system access including admin management
  • General Admin - Ticket management and customer support

🌟 Premium Features - Unlock Professional Customization

Transform your ITSM into your own branded platform!

What Premium Unlocks:

  • 🎨 Custom Branding Suite - Upload your company logo and rebrand the entire system with your identity
  • Personalized Tagline - Replace default branding with your company slogan and messaging
  • 🏷️ Custom Footer Text - Full footer customization for professional presentation
  • Flexible Activation - Choose between 1 hour (testing), 7 days, or 15 days duration
  • 🔄 Hot-Swap Branding - Change branding on the fly without system restart
  • 🔐 Secure License System - Advanced key-based activation for premium tier

Why Go Premium?

  • Make the system truly yours with white-label capabilities
  • Perfect for MSPs, IT consulting firms, and corporate deployments
  • Impress clients with professional, branded service portals
  • Flexible pricing with duration-based licensing

Ready to Upgrade? Scan the QR code in the App Settings panel to get your Premium License Key and unlock unlimited customization possibilities!

🔐 Security

  • JWT Authentication - Secure token-based authentication
  • Password Hashing - bcrypt encryption for passwords
  • Protected Routes - Secure admin access

🛠️ Tech Stack

Frontend

Technology Description
⚛️ React 18 UI Library with Hooks
📘 TypeScript Type-safe JavaScript
Vite Next-gen build tool
🎨 Tailwind CSS Utility-first CSS framework
🔌 Socket.io Client Real-time communication
🍞 React Hot Toast Beautiful notifications
📊 Recharts Chart library for analytics
🎯 Lucide React Beautiful icon library

Backend

Technology Description
🟢 Node.js 18 JavaScript runtime
🚀 Express.js Web application framework
🔌 Socket.io Real-time bidirectional communication
🔐 JWT JSON Web Token authentication
🔒 bcryptjs Password hashing
📁 Multer File upload handling

Database

Technology Description
🐘 PostgreSQL 15 Relational database
🔧 Adminer Database management UI

DevOps

Technology Description
🐳 Docker Containerization
🐙 Docker Compose Multi-container orchestration

📦 Installation

Prerequisites

Quick Start with Docker

  1. Clone the repository

    git clone https://github.com/your-username/syscare-dynamicdev.git
    cd syscare-dynamicdev
  2. Start all services

    docker-compose up --build -d
  3. Access the application

  4. Default Admin Credentials

    Email: default@localhost
    Password: password
    

    ⚠️ Important: Change the default password immediately after first login!


🔧 Configuration

Environment Variables

The following environment variables can be configured in docker-compose.yml:

Variable Default Description
DB_HOST db Database host
DB_PORT 5432 Database port
DB_USER admin Database username
DB_PASS password Database password
DB_NAME db Database name
PORT 8798 API server port
JWT_SECRET change_this_secret_in_production JWT signing secret

Database Connection (Adminer)

Field Value
System PostgreSQL
Server db:5432
Username admin
Password password
Database db

🚀 Usage

Customer Portal

  1. Navigate to http://localhost:5173
  2. Fill in the service request form:
    • Customer name and contact information
    • Problem description
    • Select priority level
    • Attach relevant images (optional)
  3. Submit the request
  4. Track your ticket status

Admin Dashboard

  1. Click "Admin Login" in the navigation
  2. Enter your credentials
  3. Manage tickets:
    • View all service requests
    • Update ticket status
    • Add admin notes
    • View attached images
  4. Access statistics and charts

App Settings (Super Admin Only)

  1. Navigate to "App Settings" tab
  2. Activate premium features with a license key
  3. Customize:
    • Upload custom logo
    • Change app name
    • Modify tagline
    • Update footer text

📁 Project Structure

syscare-dynamicdev/
├── public/                 # Static assets
│   ├── dynamicdev.png     # Default logo
│   ├── payment-qr.jpg     # Payment QR code
│   └── uploads/           # User uploaded files
├── server/                # Backend API
│   ├── index.js          # Express server
│   ├── authMiddleware.js # JWT authentication
│   ├── upload-middleware.js # File upload handler
│   └── schema-migration.sql # Database schema
├── src/                   # Frontend source
│   ├── components/       # React components
│   ├── pages/           # Page components
│   ├── App.tsx          # Main app component
│   ├── config.ts        # API configuration
│   └── index.css        # Global styles
├── docker-compose.yml    # Docker services
├── dockerfile           # Frontend container
└── README.md           # This file

🔒 Security Recommendations

Before deploying to production:

  1. Change Default Credentials

    • Update database password in docker-compose.yml
    • Change default admin password after first login
    • Set a strong JWT_SECRET
  2. Environment Variables

    • Use .env files for sensitive data
    • Never commit secrets to version control
  3. HTTPS

    • Enable HTTPS with SSL certificates
    • Use a reverse proxy (nginx, Traefik)
  4. Firewall

    • Restrict port access
    • Only expose necessary ports

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

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

📄 License

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


👨‍💻 Author

dynamicdev_


⭐ Star this repo if you find it useful! ⭐

Made with ❤️ and ☕