https://github.com/nazmulxdev/nazmulxdev-portfolio-client
A modern MERN Stack portfolio site with smooth UI, animations, and contact form.
https://github.com/nazmulxdev/nazmulxdev-portfolio-client
expressjs firebase framer-motion nodejs react
Last synced: about 1 month ago
JSON representation
A modern MERN Stack portfolio site with smooth UI, animations, and contact form.
- Host: GitHub
- URL: https://github.com/nazmulxdev/nazmulxdev-portfolio-client
- Owner: nazmulxdev
- Created: 2025-06-28T21:14:06.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2026-04-30T12:06:34.000Z (2 months ago)
- Last Synced: 2026-04-30T12:15:28.735Z (2 months ago)
- Topics: expressjs, firebase, framer-motion, nodejs, react
- Language: JavaScript
- Homepage: https://nazmulxdev-13a14.web.app/
- Size: 927 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Personal Portfolio Website - Client
This repository contains the client-side code for my personal portfolio website. It showcases my skills, projects, educational background, and provides a way for visitors to contact me.
[](https://nazmulxdev-13a14.web.app/)
[](https://github.com/nazmulxdev/nazmulxdev-portfolio-server)
---
### **Project Overview**
This is a fully responsive single-page portfolio built with React and Tailwind CSS. The website features smooth animations and transitions to create an engaging user experience. It highlights my journey as a developer, my key skills, and the projects I have worked on.
---
### **Key Features**
✅ **Fully Responsive Design:** Ensures a seamless experience across all devices, from mobile phones to desktops.
✅ **Smooth Animations:** Utilizes Framer Motion and React Spring for fluid animations and page transitions.
✅ **Interactive UI:** Includes dynamic elements like counters, sliders, and typewriter effects to engage visitors.
✅ **Structured Sections:** Clearly organized sections for "About Me," "Skills," "Projects," and "Contact."
✅ **Functional Contact Form:** A working contact form that sends inquiries directly to my email using a dedicated backend server.
---
### **About Me**
#### **Education**
* **B.Sc (Engineering) in EEE**
* **Institute:** Hajee Mohammad Danesh Science & Technology University
* **Session:** 2021 (Currently in Level-3, Semester-II)
* **Higher Secondary Certificate (H.S.C)**
* **Institute:** Govt. Bangla College
* **Group:** Science
* **Passing Year:** 2020 | **GPA:** 5.00/5.00
* **Secondary School Certificate (S.S.C)**
* **Institute:** Konda High School
* **Group:** Science
* **Passing Year:** 2018 | **GPA:** 5.00/5.00
#### **Certifications & Skills**
* **Certified MERN Stack Developer** from Programming Hero.
* **Currently Working With:** React.js, Tailwind CSS, DaisyUI, Express.js, Node.js, Firebase, MongoDB.
* **Currently Exploring:** Next.js.
---
### **Technologies & Dependencies**
This project is built with the following technologies and packages:
- `@react-spring/web`
- `axios`
- `daisyui`
- `framer-motion`
- `react-countup`
- `react-icons`
- `react-intersection-observer`
- `react-router`
- `swiper`
- `typewriter-effect`
---
### **Getting Started Locally**
Follow these steps to run the client-side on your local machine:
**1. Clone the repository:**
```bash
git clone [https://github.com/nazmulxdev/nazmulxdev-portfolio-client.git](https://github.com/nazmulxdev/nazmulxdev-portfolio-client.git)
```
**2. Navigate to the project directory:**
```bash
cd nazmulxdev-portfolio-client
```
**3. Install NPM packages:**
```bash
npm install
```
**4. Set up environment variables:**
Create a file named `.env.local` in the root directory and add the URL of your deployed server.
```.env.local
VITE_API_URL=[https://nazmulxdev-portfolio-server.vercel.app](https://nazmulxdev-portfolio-server.vercel.app)
```
**5. Run the project:**
```bash
npm run dev
```
The application will be available at `http://localhost:5173` (or another port if 5173 is busy).
---