Skip to content

Latest commit

 

History

History
117 lines (82 loc) · 3.6 KB

File metadata and controls

117 lines (82 loc) · 3.6 KB

Online Workshop Frontend

Build Status Docker Build React Node Docker License

A modern frontend for the Online Workshop management system.


About

This repository hosts the frontend client for the Online Workshop application. It is built with React to provide a visually engaging user experience for students or users, faculty, and administrators.

The application recently underwent a major UI overhaul, featuring a Glassmorphism(some part) design language, smooth animations, and a fully responsive layout.


Key Features

Modern UI/UX

  • Glassmorphism Design: Sleek, semi-transparent cards with soft shadows and blur effects.
  • Interactive Elements: Smooth hover animations on buttons, inputs, and images.
  • Responsive Layout: Seamless experience across Desktop, Tablet, and Mobile devices(Not Perfect).

Robust Authentication

  • Secure Login and Signup with "CAPTCHA" protection.
  • Forgot Password & Reset Password workflows.
  • Role-based redirection (Student, Faculty, Admin).

Dashboard & Management

  • Admin: Manage workshops, users, and system settings.
  • Faculty: Create workshops and view attendance.
  • Student: Browse, register, and attend workshops.

Technologies Used

  • React: Component-based UI library.
  • CSS3: Custom styling with CSS Variables, Flexbox, and Grid.
  • Axios: Efficient HTTP client for API communication.
  • React Router: Dynamic client-side routing.
  • React Toastify: Beautiful notifications.
  • Docker: Containerization for consistent deployment.
  • GitHub Actions: Automated CI/CD pipelines.

Project Structure

src/
├── admincomponents/    # Admin-specific dashboards and tools
├── components/         # Shared auth pages (Login, Signup, Reset Password)
├── facultycomponents/  # Faculty-specific dashboards
├── public/             # Static assets (images, icons)
├── App.js              # Main application router
└── index.css           # Global styles

Getting Started

Follow these steps to set up the project locally:

  1. Clone the repository:

    git clone https://github.com/udaykiriti/onlineworkshop-frontend.git
    cd Onlineworkshop
  2. Install dependencies:

    npm install
  3. Start the development server:

    npm start

    The app will open at http://localhost:3000.


Docker Support

You can also run the application using Docker:

  1. Build and run with Docker Compose:
    docker-compose up --build

The application will be available at http://localhost:3000.


Contributing

Contributions are welcome! Please fork the repository and create a pull request for any feature enhancements or bug fixes.


Made with React