Skip to content

Latest commit

 

History

12 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 

Repository files navigation

🎬 Video Editor Portfolio Website

A modern, responsive portfolio website developed for a professional video editor to showcase creative work, attract clients, and simplify project inquiries. The application is built using the MERN Stack and provides an elegant interface for displaying editing services, featured projects, testimonials, and contact information.


✨ Features

👤 Visitor Features

  • Modern and responsive UI
  • Hero section with professional introduction
  • About section
  • Services section
  • Portfolio/Gallery showcasing editing projects
  • Featured videos and reels
  • Client testimonials
  • Contact form
  • Social media integration
  • Mobile-friendly design
  • Smooth scrolling animations

🔐 Admin Features

  • Secure Admin Login
  • Dashboard
  • Add, Edit & Delete Portfolio Projects
  • Manage Testimonials
  • Update Services
  • Update Personal Information
  • Manage Contact Requests

🛠️ Tech Stack

Frontend

  • React.js
  • Vite
  • JavaScript (ES6+)
  • Tailwind CSS
  • React Router
  • Axios

Backend

  • Node.js
  • Express.js
  • RESTful APIs
  • JWT Authentication

Database

  • MongoDB
  • Mongoose

DevOps & Deployment

  • Docker
  • Jenkins
  • CI/CD Pipeline
  • Git & GitHub
  • AWS
  • Nginx (Optional)

📂 Project Structure

video-editor-portfolio/
│
├── client/
│   ├── src/
│   ├── components/
│   ├── pages/
│   ├── assets/
│   └── package.json
│
├── server/
│   ├── controllers/
│   ├── routes/
│   ├── middleware/
│   ├── models/
│   ├── config/
│   └── package.json
│
└── README.md

🚀 Getting Started

Clone the Repository

git clone https://github.com/SrihariWebDeveloper/frelanace_portfolio.git

cd frelanace_portfolio

Install Dependencies

Frontend

cd client
npm install

Backend

cd server
npm install

⚙️ Environment Variables

Create a .env file inside the server folder.

PORT=5000

MONGO_URI=your_mongodb_connection_string

JWT_SECRET=your_secret_key

CLIENT_URL=http://localhost:5173

▶️ Run the Application

Backend

npm run dev

Frontend

npm run dev

📚 Key Learnings

  • Developing scalable MERN Stack applications
  • REST API development
  • JWT Authentication
  • MongoDB data modeling
  • Responsive UI design with Tailwind CSS
  • Docker containerization
  • CI/CD pipeline implementation using Jenkins
  • Deployment on cloud infrastructure

🔮 Future Enhancements

  • Blog Section
  • Client Booking System
  • Online Payment Integration
  • CMS for Content Management
  • Analytics Dashboard
  • Email Notifications
  • AI-powered Portfolio Recommendations
  • Multi-language Support

👨‍💻 Author

Srihari Erukala

Computer Science (AI & ML)


⭐ Support

If you found this project useful, consider giving it a ⭐ on GitHub. Your support is greatly appreciated!

About

No description, website, or topics provided.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages