https://www.twine.net/signin

React Dashboard is a modern React-based dashboard application built around Material Design principles, focusing on a clean, responsive, and component-driven user experience.

The dashboard provides a structured application layout with:

Responsive dashboard interface for desktop and mobile screens
Material Design UI components with consistent spacing, typography, colors, elevation, and interaction patterns
Dashboard cards and statistics for presenting important information at a glance
Data visualization and charts for understanding application metrics
Navigation and application layout with a structured sidebar/header experience
Reusable React components for maintaining consistency across the application
Responsive tables and data presentation
Interactive UI elements such as menus, dialogs, buttons, forms, and navigation controls
Modern React architecture with reusable and modular components
Technology Focus
React
↓
Material Design
↓
Reusable Components
↓
Responsive Dashboard
↓
Charts / Data Visualization
↓
Interactive Application UI

The project demonstrates practical experience in building enterprise-style React dashboards, with particular emphasis on reusable component architecture, Material Design, responsive layouts, data visualization, and maintainable frontend development.

https://www.twine.net/signin

My personal technology portfolio showcasing software development projects, technical expertise, and practical experience in designing and building modern web applications and backend systems.

The portfolio highlights full-stack development capabilities across React, Angular, TypeScript, Javascript, HTML, CSS, Node.js, Express, REST APIs, databases, authentication, and modern application architecture, with projects demonstrating real-world implementation rather than isolated technology examples

https://www.twine.net/signin

DoctorCare API is a secure, layered RESTful backend API for the Doctor Appointment Booking System. It is built with Node.js, Express, TypeScript, Drizzle ORM, and MySQL, and provides the core services required by both Doctor and Patient applications.

The API follows a modular architecture with separate routes, controllers, services, database/repository layers, validation, authentication, and shared utilities, providing a maintainable foundation for the frontend application.

Key API Capabilities
Authentication & Authorization
User authentication
JWT access-token authentication
Refresh-token based session renewal
Role-based Doctor and Patient access
User & Profile Management
Current-user profile retrieval
Profile updates
Account status and role information
Doctor Management
Doctor profiles
Specializations
Doctor availability
Effective-date-based availability management
Doctor leave management
Appointment Management
Appointment booking
Doctor and patient appointment views
Appointment status management
Appointment history and logs
Prescription Management
Prescription creation
Doctor prescription management
Patient prescription history
Database & Data Integrity
MySQL relational database
Drizzle ORM
Transaction-based operations
Structured validation and error handling
API Documentation
Interactive Swagger/OpenAPI documentation
Request and response examples
Authentication-aware API testing
Endpoint-level schemas and parameters
Architecture
Client / React Application
↓
REST API
↓
Express
↓
Authentication
↓
Routes
↓
Controllers
↓
Services
↓
Database Layer
↓
Drizzle ORM
↓
MySQL

The API is designed so that the frontend remains independent of the database implementation and communicates through well-defined REST endpoints.

𝗙𝘂𝗹𝗹-𝗦𝘁𝗮𝗰𝗸 𝗣𝗿𝗼𝗱𝘂𝗰𝘁 — 𝗗𝗼𝗰𝘁𝗼𝗿 𝗔𝗽𝗽𝗼𝗶𝗻𝘁𝗺𝗲𝗻𝘁 𝗕𝗼𝗼𝗸𝗶𝗻𝗴 𝗣𝗹𝗮𝘁𝗳𝗼𝗿𝗺

Over the last few weeks, I’ve evolved this project from a UI demo into a fully integrated React + Express application, connecting a role-based frontend with a structured REST API & MySQL backend.

This build brings together frontend architecture, backend APIs, JWT authentication, scheduling workflows, runtime validation, and state management into one complete system.

🌐 𝗟𝗶𝘃𝗲 𝗔𝗽𝗽𝗹𝗶𝗰𝗮𝘁𝗶𝗼𝗻
🔗 Doctor Care React App: https://www.twine.net/signin

🔑 𝗗𝗲𝗺𝗼 𝗖𝗿𝗲𝗱𝗲𝗻𝘁𝗶𝗮𝗹𝘀
👨‍⚕️ Doctor: https://www.twine.net/signin / Demo@123
👤 Patient: https://www.twine.net/signin / Demo@123

🏗️ 𝗙𝗿𝗼𝗻𝘁𝗲𝗻𝗱 𝗔𝗿𝗰𝗵𝗶𝘁𝗲𝗰𝘁𝘂𝗿𝗲
Built with a modern React ecosystem:
⚛️ React 19 + TypeScript | ⚡ Vite | 🎨 shadcn/ui + Tailwind CSS
🧭 React Router DOM | 📊 Recharts | 🌙 Light/Dark theme
🔄 TanStack Query (Server-state management)
🐻 Zustand (Client/application state & persistence)
📋 React Hook Form + Zod (Type-safe form validation)
🌐 Axios (API communication)

The UI leverages reusable components, responsive layouts, accessible forms, loading/error states, dialogs, notifications, and role-specific navigation.

👨‍⚕️ 𝗗𝗼𝗰𝘁𝗼𝗿 𝗪𝗼𝗿𝗸𝗳𝗹𝗼𝘄
• View dashboard metrics & patient info
• Manage profile, availability & leave
• Handle appointments, status workflows & prescriptions

👤 𝗣𝗮𝘁𝗶𝗲𝗻𝘁 𝗪𝗼𝗿𝗸𝗳𝗹𝗼𝘄
• Browse doctors, view profiles & check availability
• Book slots, view appointment history & access prescriptions
• Manage profile settings

🔐 𝗔𝘂𝘁𝗵𝗲𝗻𝘁𝗶𝗰𝗮𝘁𝗶𝗼𝗻 & 𝗦𝗲𝗰𝘂𝗿𝗶𝘁𝘆
• JWT-based auth with access/refresh token workflow
• Protected routes & role-based authorization
• Axios interceptors & ownership-aware API access

🔗 𝗕𝗮𝗰𝗸𝗲𝗻𝗱 & 𝗔𝗣𝗜 𝗗𝗼𝗰𝘀
⚡ Node.js + Express + TypeScript + Drizzle ORM + MySQL
📖 Swagger / OpenAPI: https://www.twine.net/signin

Description — DoctorCare

DoctorCare is a full-stack Doctor Appointment Booking System designed to simplify the interaction between doctors and patients through a modern web application.

The system provides separate experiences for Doctors and Patients, allowing users to securely log in and manage their healthcare-related activities.