A sleek, responsive, and futuristic portfolio template crafted for engineering students to showcase their innovation, technical prowess, and groundbreaking projects. Built with cutting-edge web technologies for the digital age.
| 🎯 Feature | 🔧 Technology | 📊 Status |
|---|---|---|
| Responsive Design | CSS Grid + Flexbox | ✅ Active |
| Modern Architecture | Next.js 14 + App Router | ✅ Active |
| Type Safety | TypeScript 5.0+ | ✅ Active |
| Styling Framework | Tailwind CSS 3.0+ | ✅ Active |
| Component Library | Custom React Components | ✅ Active |
| Performance Optimization | Next.js Image + SSG | ✅ Active |
| Contact Integration | Form Handling + API Routes | ✅ Active |
| SEO Optimized | Meta Tags + Structured Data | ✅ Active |
engineer_portfolio/
├─ app/
│ ├─ about/
│ ├─ blog/
│ ├─ certificates/
│ ├─ contact/
│ ├─ education/
│ ├─ experience/
│ ├─ projects/
│ ├─ skills/
│ ├─ globals.css
│ ├─ layout.tsx
│ └─ page.tsx
├─ components/
│ ├─ home/
│ │ ├─ about-preview.tsx
│ │ ├─ contact-preview.tsx
│ │ ├─ hero-section.tsx
│ │ ├─ projects-preview.tsx
│ │ └─ skills-preview.tsx
│ ├─ layout/
│ │ ├─ footer.tsx
│ │ └─ navbar.tsx
│ ├─ ui/ # Reusable UI elements
│ │ ├─ [~50+ custom components like accordion, button, card, toast, etc.]
│ └─ theme-provider.tsx
├─ hooks/
│ └─ use-toast.ts
├─ lib/
│ ├─ constants.ts
│ ├─ motion.ts
│ └─ utils.ts
├─ .eslintrc.json
├─ .gitignore
├─ components.json
├─ next-env.d.ts
├─ next.config.js
├─ package-lock.json
├─ package.json
├─ postcss.config.js
├─ tailwind.config.ts
├─ tsconfig.json
└─ README.md
# 1️⃣ Clone the repository
git clone https://github.com/niladri-1/Engineering_Student_Portfolio.git
# 2️⃣ Navigate to project directory
cd Engineering_Student_Portfolio
# 3️⃣ Install dependencies
npm install
# 4️⃣ Start development server
npm run dev
# 5️⃣ Open in browser
# Navigate to http://localhost:3000| 🔧 Component | 📍 Location | 🎯 Purpose |
|---|---|---|
| Personal Info | app/page.tsx |
Update your details and bio |
| Project Gallery | components/Projects.tsx |
Showcase your engineering projects |
| Styling Theme | tailwind.config.ts |
Customize colors and design |
| Static Assets | public/ |
Replace with your images/icons |
| Contact Form | components/Contact.tsx |
Configure contact information |
| 📈 Metric | 🎯 Score | 🏆 Status |
|---|---|---|
| Lighthouse Performance | 98/100 | 🟢 Excellent |
| Accessibility | 100/100 | 🟢 Perfect |
| Best Practices | 100/100 | 🟢 Perfect |
| SEO | 100/100 | 🟢 Perfect |
| First Contentful Paint | < 1.2s | 🟢 Fast |
| Largest Contentful Paint | < 2.5s | 🟢 Fast |
| 🖥️ Command | 🎯 Description |
|---|---|
npm run dev |
Start development server |
npm run build |
Build for production |
npm run start |
Start production server |
npm run lint |
Run ESLint checks |
npm run type-check |
Run TypeScript checks |
We welcome contributions from the engineering community!
📋 Contributing Guidelines • 🐛 Report Bug • 💡 Request Feature
This project is licensed under the MIT License - see the LICENSE file for details.
