The Scholarship Management Web Application provides a user-friendly interface to view, apply, and manage scholarships. Users can also give reviews, get detailed scholarship information, and register/login to access specific features.
✅ Responsive and Dynamic UI: The interface adapts to different screen sizes and provides a dynamic user experience.
✅ Scholarship Listing: Users can browse a list of available scholarships with important details such as university, category, location, and application deadline.
✅ View Scholarship Details: Allows users to see more information about a specific scholarship.
✅ Client Reviews Section: Displays a scrolling marquee of client reviews to show feedback from past scholarship applicants.
✅ User Authentication: Registration and login functionality using context for user management.
✅ Interactive UI: Hover effects and smooth animations enhance user experience.
✅ Social Media Links: Footer contains links to various social media platforms for easy contact.
- Components – Structured project using reusable components.
- Props – Passed dynamic data between components.
- State Management (
useState) – Managed UI state effectively. - Side Effects (
useEffect) – Loaded data dynamically. - Conditional Rendering – Displayed different views based on state.
- React: The client-side is built with React.js to provide an interactive user interface.
- Tailwind CSS: Tailwind CSS is used for styling to create a responsive and visually appealing layout.
- React Router: Handles navigation between pages in the application.
- React Context API: Manages global state such as user authentication and cart items.
- React Fast Marquee: For smooth scrolling text (used for reviews).
- Smastrom React Rating: For displaying the star rating on reviews.
| Package | Version |
|---|---|
react |
^18.3.1 |
react-dom |
^18.3.1 |
react-router-dom |
^6.27.0 |
react-icons |
^5.3.0 |
react-toastify |
^10.0.6 |
recharts |
^2.13.3 |
react-tabs |
^6.0.2 |
localforage |
^1.10.0 |
match-sorter |
^7.0.0 |
sort-by |
^1.2.0 |
| Package | Version |
|---|---|
vite |
^5.4.10 |
@vitejs/plugin-react |
^4.3.3 |
eslint |
^9.13.0 |
eslint-plugin-react |
^7.37.2 |
eslint-plugin-react-hooks |
^5.0.0 |
postcss |
^8.4.47 |
autoprefixer |
^10.4.20 |
tailwindcss |
^3.4.14 |
daisyui |
^4.12.14 |
 |
🔗 Live Website: Scholarship Management
🔗 Server-Site: Server-Site Link
** Admin email: admin@admin.com ** Admin password: Aa123456 ** Moderator email:scholar@scholar.com ** Moderator password: Aa123456
Document: View Document
# Clone the repository
git clone https://github.com/alazim-star/b10a12-client-side.git
# Install dependencies
npm install
# Start the development server
npm run dev
# React-Router setup
npm install react-router-dom
npm install localforage match-sorter sort-by
npm run dev
### Prerequisites
- [Node.js](https://nodejs.org/) (including npm)
- [MongoDB](https://www.mongodb.com/) (or use a cloud solution like MongoDB Atlas)