Empowering education through seamless digital connections.
Built with the tools and technologies:
Edify.website.demo.-.Made.with.Clipchamp.1.mp4
Edify is a dynamic and immersive education platform built with React, tailored to connect students, educators, and institutions in one unified digital environment. It delivers a clean, modern user experience across all devices and focuses on interactive, accessible, and high-quality education for learners of all levels.
💡 “We ensure better Education for a better world.”
Edify isn't just a front-facing website—it's a feature-rich education system with dedicated sections for academic programs, faculty, student testimonials, and campus facilities. Designed with scalability in mind, it supports static and dynamic deployments, integrates with external systems, and offers a modular architecture for easy extension.
Whether you're:
- A school or university administrator showcasing your institution,
- A student exploring learning options, or
- A developer looking to build your own version,
Edify offers the foundation for your goals.
The main objectives behind Edify are:
✅ Digital Transformation for Education
Enable traditional institutions to maintain an engaging online presence.
✅ Student-Centric Design
Deliver structured, bite-sized, and visually intuitive content for learners.
✅ Modern UI for Institutions
Provide an aesthetic and functional showcase of campus life, academic programs, and teaching excellence.
✅ Ease of Use & Accessibility
Ensure the platform is intuitive for every type of user, including students, faculty, and parents.
| Layer | Technologies Used |
|---|---|
| Frontend | React (with Create React App or Vite), JSX, Functional Components |
| Routing | react-router-dom |
| State Management | React Context API (or Redux if extended) |
| Styling | CSS Modules / Tailwind CSS / SCSS |
| Responsive Design | Flexbox, Grid, Media Queries for mobile optimization |
| Assets | Custom SVGs, Web-optimized PNGs/JPEGs, Fonts from Google Fonts |
| Deployment | Vercel / GitHub Pages |
edify/
├── public/ # Static assets served directly (favicon, manifest, etc.)
│ └── index.html # Root HTML file
├── src/ # All source files
│ ├── assets/ # Static media assets like images and videos
│ │ ├── images/ # All PNGs, JPGs, icons
│ │ └── videos/ # MP4 and other video files
│ ├── components/ # Reusable shared UI components
│ │ ├── Navbar/ # Navigation bar component
│ │ │ ├── Navbar.jsx
│ │ │ └── Navbar.css
│ │ ├── Footer/ # Footer section
│ │ │ ├── Footer.jsx
│ │ │ └── Footer.css
│ │ ├── Title/ # Title header component
│ │ │ ├── Title.jsx
│ │ │ └── Title.css
│ │ └── VideoPlayer/ # Embedded video component
│ │ ├── Videoplayer.jsx
│ │ └── Videoplayer.css
│ ├── pages/ # Route-level pages
│ │ ├── Home/ # Homepage content (Hero, etc.)
│ │ ├── About/ # About page content
│ │ │ ├── About.jsx
│ │ │ └── About.css
│ │ ├── Campus/ # Campus info section
│ │ │ ├── Campus.jsx
│ │ │ └── Campus.css
│ │ ├── Contact/ # Contact form and info
│ │ │ ├── Contact.jsx
│ │ │ └── Contact.css
│ │ ├── Facilities/ # School/College facility info
│ │ │ ├── Facilities.jsx
│ │ │ └── Facilities.css
│ │ ├── Programs/ # Program offerings
│ │ │ ├── Programs.jsx
│ │ │ └── Program.css
│ │ ├── Teachers/ # Teachers profiles
│ │ │ ├── Teachers.jsx
│ │ │ └── Teachers.css
│ │ └── Testimonials/ # User testimonials or feedback
│ │ ├── Testimonials.jsx
│ │ └── Testimonials.css
│ ├── data/ # Static data (JS/JSON) to populate UI
│ │ ├── teachers.json
│ │ ├── programs.json
│ │ └── testimonials.json
│ ├── styles/ # Global styles or shared variables
│ │ └── index.css
│ ├── App.jsx # Main app component with routing
│ └── main.jsx # ReactDOM entry point
├── .gitignore
├── README.md # Project overview, setup instructions
├── eslint.config.js # ESLint configuration
├── vite.config.js # Vite build configuration
├── package.json
├── package-lock.json
🔹 Homepage
- Hero section with mission statement and call to action.
- Smooth navigation to explore the entire platform.
🔹 Programs Offered
- Detailed sections for Graduation, Master's, and Post-Graduate programs.
- Modular cards displaying course information.
🔹 About Us
- Highlights university philosophy, mission, and vision.
🔹 Virtual Campus Gallery
- Dynamic photo carousel showcasing campus life.
🔹 Facilities
- Interactive section covering infrastructure (library, park, canteen, swimming pool, etc.)
🔹 Teacher Profiles
- Cards showcasing faculty members, their expertise, and subjects.
🔹 Student Testimonials
- Quotes and feedback from real users, giving credibility and trust.
🔹 Contact Section
- Static or dynamic form integration for inquiries.
🔹 Fully Responsive UI
- Optimized for mobile, tablet, and desktop using responsive layout strategies.
- 🎓 Universities/Schools: Use Edify as a digital front for campus outreach.
- 👨💻 Developers: Extend the platform for online learning or LMS systems.
- 📈 Startups/EdTech: Customize it as an MVP for educational products.
- 📷 Portfolio Projects: Showcase frontend and UI/UX design skills.
link : https://edify-rho.vercel.app/
To run this project locally:
Ensure the following are installed:
- Node.js (v16+ recommended)
- npm or yarn
- Git
# Clone the repository
git clone https://github.com/Anamicca23/edify.git
# Navigate into the project
cd edify
# Install dependencies
npm install
# or
yarn install
### ▶️ Run the Development Server
```bash
npm start
# or
yarn startYour app should now be running at http://localhost:3000.
- 🔐 Authentication system for students and teachers
- 📊 Admin dashboard with content management
- 💬 Chat or discussion board integration
- 📦 CMS support (Strapi, Sanity, Contentful)
- 🌐 Multi-language/i18n support
We welcome contributions of all kinds! To get started:
# Create a new branch
git checkout -b feature/your-feature-name
# Commit your changes
git commit -m "Add your message"
# Push to the branch
git push origin feature/your-feature-name
# Open a pull requestThis project is open-sourced under the MIT License.
Built with 💙 using React to reshape the future of education.
