Student Management Frontend

This project is the frontend for a web application designed to help educational institutions manage academic data. It provides tools for faculty and administrators to track student performance, manage course outcomes, and generate various academic reports.

Features

• Faculty Management: Add and manage faculty members.
• Student Management: Create and verify student profiles.
• Attendance Tracking: Record and report student attendance.
• Marks Entry & Management: Input and manage internal and semester-end exam marks.
• Course Outcome (CO) Management: Define and manage course outcomes.
• Attainment Calculation:
  • Calculate CO attainment (direct and indirect methods).
  • Calculate Program Outcome (PO) attainment.
• Report Generation: Generate various academic reports, potentially in PDF format.
• Subject Management: Create and manage subjects.
• Admin Dashboard: Centralized dashboard for administrative functions.
• User Authentication: Login functionality for admins and potentially other user roles.

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

• Node.js (v18.x or later recommended)
• npm (comes with Node.js) or yarn

Installation

1. Clone the repository:

   git clone https://github.com/Rizwanishere/Student-management-frontend.git

2. Navigate to the project directory:

   cd Student-management-frontend

3. Install dependencies:

   npm install

   (Or if you prefer yarn: yarn install)

Running the Application

Development Server

To start the application in development mode, run:

npm start

This will open the application in your default web browser, usually at http://localhost:3000. The page will reload if you make edits.

Building for Production

To create an optimized build of the application for production, run:

npm run build

This command bundles React in production mode and optimizes the build for the best performance. The build artifacts will be stored in the build/ directory.

Running Tests

To launch the test runner in interactive watch mode, run:

npm test

(Note: This assumes test files are set up. If not, this command might not produce meaningful output without further test configuration.)

Technologies Used

• Frontend Library: React
• Routing: React Router DOM
• Styling: Tailwind CSS, PostCSS, Autoprefixer
• State Management: React Context
• HTTP Client: Axios
• Charting: Chart.js, Recharts
• PDF Generation: html2pdf.js, jsPDF
• Excel Handling: xlsx (SheetJS)
• Icons: Lucide React, React Icons
• Development Tools: React Scripts, ESLint
• Package Manager: npm

Project Structure

A brief overview of the key directories:

faculty-frontend/
├── public/             # Static assets and index.html
├── src/
│   ├── components/     # Reusable UI components
│   ├── pages/          # Page-level components (routed components)
│   ├── utils/          # Utility functions, context, etc.
│   ├── index.css       # Global styles
│   ├── index.jsx       # Main entry point for the React application
├── .gitignore          # Specifies intentionally untracked files that Git should ignore
├── package.json        # Project metadata, dependencies, and scripts
├── tailwind.config.js  # Tailwind CSS configuration
└── README.md           # This file

Contributing

Contributions are welcome! If you have suggestions for improving the application, please feel free to:

1. Fork the repository.
2. Create a new branch for your feature or bug fix:

   git checkout -b feature/your-feature-name

   or

   git checkout -b bugfix/issue-number

3. Make your changes and commit them with clear messages.
4. Push your changes to your forked repository.
5. Create a Pull Request to the main repository's main branch.

Please ensure your code follows the existing style and that any new features are appropriately documented.