بازگشت به پروژه‌ها
اپلیکیشن وب۱۴۰۵ مرداد

مهرنگار (MehrNegar)

مهرنگار یک سامانه تحت وب (Web Application) است که با هدف یکپارچه‌سازی فرآیندهای مدیریت فروش، انبار، مشتریان و عملیات سازمانی طراحی و توسعه یافته است. این پروژه با معماری مدرن Full-Stack توسعه داده شده و رابط کاربری سریع، تجربه کاربری روان و APIهای مقیاس‌پذیر را در کنار یکدیگر ارائه می‌دهد.

ReactTypeScriptD3.jsNode.js
مهرنگار (MehrNegar)

مهرنگار (Mehrnegar)

Business Management System

---

The Challenge

بسیاری از کسب‌وکارها اطلاعات مربوط به مشتریان، کالاها، سفارش‌ها و موجودی انبار را در نرم‌افزارهای جداگانه یا فایل‌های اکسل مدیریت می‌کنند. این موضوع باعث ایجاد مشکلاتی مانند:

  • پراکندگی اطلاعات
  • خطاهای انسانی
  • دشواری تهیه گزارش
  • مدیریت پیچیده موجودی
  • نبود دسترسی سریع به اطلاعات

می‌شود.

هدف از توسعه مهرنگار، ایجاد یک سیستم متمرکز برای مدیریت این فرآیندها در یک داشبورد یکپارچه بود.

---

The Solution

برای حل این مسئله، یک معماری Full-Stack مبتنی بر Next.js طراحی شد که رابط کاربری، API و منطق سمت سرور را در یک پروژه واحد ترکیب می‌کند.

سیستم به صورت ماژولار توسعه یافته تا افزودن قابلیت‌های جدید بدون تغییرات گسترده در هسته برنامه امکان‌پذیر باشد.

---

overview
overview

Key Features

مدیریت کالا

  • ثبت کالا
  • دسته‌بندی محصولات
  • مدیریت موجودی
  • کنترل موجودی لحظه‌ای

مدیریت مشتریان

  • ثبت اطلاعات مشتری
  • جستجوی سریع
  • مدیریت سوابق مشتریان

مدیریت سفارش‌ها

  • ثبت سفارش
  • پیگیری وضعیت سفارش
  • مدیریت فرآیند فروش

مدیریت فاکتورها

  • صدور فاکتور
  • مشاهده تاریخچه فاکتورها

مدیریت تراکنش‌ها

  • ثبت تراکنش‌ها
  • مدیریت گردش مالی

احراز هویت

  • ورود امن کاربران
  • ورود مبتنی بر OTP
  • مدیریت Session

گزارش‌گیری

  • داشبورد مدیریتی
  • نمایش آمار
  • گزارش فعالیت کاربران

ابزارهای جانبی

  • تولید Barcode
  • اسکن QR Code
  • Backup اطلاعات
  • تنظیمات سیستم
  • Activity Log

---

Technical Highlights

در این پروژه تمرکز ویژه‌ای روی کیفیت ساختار نرم‌افزار، مقیاس‌پذیری و قابلیت نگهداری انجام شده است.

---

Modern App Router

استفاده از معماری جدید App Router در Next.js باعث شده مسیرها، APIها و صفحات ساختار ساده، استاندارد و قابل نگهداری داشته باشند.

---

Modular Architecture

کدها به صورت ماژولار طراحی شده‌اند تا هر بخش مسئولیت مشخصی داشته باشد و توسعه آینده ساده‌تر شود.

---

Type Safety

استفاده کامل از TypeScript باعث کاهش خطاهای زمان اجرا و افزایش کیفیت توسعه شده است.

---

Database Layer

لایه دیتابیس با استفاده از:

  • PostgreSQL
  • Drizzle ORM
  • Drizzle Kit

پیاده‌سازی شده که علاوه بر عملکرد مناسب، مدیریت Migrationها را نیز ساده می‌کند.

---

RESTful APIs

تمام قابلیت‌های سیستم از طریق APIهای مستقل پیاده‌سازی شده‌اند که توسعه Frontend و Backend را از یکدیگر جدا می‌کند.

---

Responsive UI

رابط کاربری کاملاً Responsive بوده و روی:

  • Desktop
  • Tablet
  • Mobile

قابل استفاده است.

---

Tech Stack

Frontend

  • Next.js
  • React
  • TypeScript
  • Tailwind CSS

Backend

  • Node.js
  • Next.js Route Handlers
  • REST API

Database

  • PostgreSQL
  • Drizzle ORM
  • Drizzle Kit

Libraries

  • HTML5 QRCode
  • JSBarcode
  • Zip.js

Deployment

  • Vercel
  • GitHub

---

Architecture

```text

Users

Next.js Application

├──────────────┐

│ │

▼ ▼

Frontend API Routes

│ │

└──────┬───────┘

Business Logic

PostgreSQL

Drizzle ORM

products
products
reports
reports
sell
sell
settings
settings
overview-mobile
overview-mobile