🏫 School Website & Admin Portal | MEAN Stack Application

A Full Stack School Management Web Application developed using the MEAN Stack (MongoDB, Express.js, Angular, Node.js) enabling institutions to manage academic content through a secure admin dashboard.

Demonstrates real-world enterprise concepts including JWT Authentication, Role-based Access, REST APIs, and scalable Angular architecture.

---

🏆 Skills Demonstrated

• Frontend: Angular, TypeScript, SCSS, Bootstrap
• Backend: Node.js, Express.js
• Database: MongoDB with Mongoose
• Authentication: JWT (JSON Web Token)
• Architecture: Component-Based Angular Design
• Concepts: CRUD Operations, Route Guards, HTTP Interceptors
• Tools: Git, GitHub, npm, Angular CLI

---

📑 Table of Contents

• About
• Key Features
• Getting Started
• API Endpoints
• Built Using
• Future Improvements
• Author
• License

---

🧐 About

The School Website & Admin Portal is a full-stack web application designed to help educational institutions manage website content efficiently.

The system consists of:

✅ Public School Website ✅ Secure Admin Dashboard ✅ REST API Driven Backend ✅ JWT Protected Authentication

Administrators can securely manage institutional data such as notices, events, teachers, gallery images, and student enquiries.

This project highlights practical implementation of:

• Full Stack Web Development
• Secure Authentication & Authorization
• Angular Routing & Guards
• Backend API Development
• MongoDB Data Management

---

✨ Key Features

🌐 Public Website

• View School Notices
• Explore Upcoming Events
• Teachers Information Page
• Image Gallery
• Contact Form Submission

---

🔐 Admin Dashboard (Protected)

• Secure Admin Login (JWT Authentication)
• Create / Update / Delete Notices
• Manage School Events
• Teacher Management
• Gallery Upload & Management
• View & Delete Contact Enquiries

---

⚙️ Technical Capabilities

• Angular Route Guards
• JWT HTTP Interceptor
• RESTful API Integration
• Modular Folder Architecture
• MongoDB Data Persistence
• Responsive UI Design

---

⚙️ Getting Started

✅ Prerequisites

• Node.js & npm
• MongoDB
• Angular CLI
• Git

Install Angular CLI:

npm install -g @angular/cli

---

1️⃣ Clone Repository

git clone https://github.com/<your-username>/school-portal.git
cd school-portal

---

2️⃣ Backend Setup

cd server
npm install
npm start

Backend runs on:

http://localhost:3000

---

3️⃣ Frontend Setup

Open another terminal:

cd client
npm install
ng serve

Frontend runs on:

http://localhost:4200

---

🔗 API Endpoints

Method	Endpoint	Description
POST	/api/auth/login	Admin Login
GET	/api/notices	Get Notices
POST	/api/notices	Add Notice
PUT	/api/notices/:id	Update Notice
DELETE	/api/notices/:id	Delete Notice
GET	/api/events	Get Events
POST	/api/contact	Submit Contact Form

---

🧰 Built Using

• Angular
• Node.js
• Express.js
• MongoDB
• JWT Authentication
• Bootstrap

---

🚀 Future Improvements

• Role-Based Access Control
• Image Upload using Cloud Storage
• Email Notifications
• Admin Analytics Dashboard
• Deployment using Docker & Cloud Platforms

---

👩‍💻 Author

Anuhya P Full Stack Developer | MEAN Stack | Angular | Node.js

📍 Open to Software Developer Opportunities in the UK

---

📄 License

This project is licensed under the MIT License.