https://github.com/renuma1618/my-portfolio---react.js
A responsive React.js portfolio showcasing personal projects, skills, and services. Includes smooth scrolling navigation, contact form with Web3Forms integration, and reusable component structure using React hooks.
https://github.com/renuma1618/my-portfolio---react.js
api components-react hooks jsx reactjs smooth-scrolling
Last synced: 5 months ago
JSON representation
A responsive React.js portfolio showcasing personal projects, skills, and services. Includes smooth scrolling navigation, contact form with Web3Forms integration, and reusable component structure using React hooks.
- Host: GitHub
- URL: https://github.com/renuma1618/my-portfolio---react.js
- Owner: Renuma1618
- Created: 2025-07-13T15:54:04.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-07-22T18:58:12.000Z (5 months ago)
- Last Synced: 2025-07-22T20:41:13.675Z (5 months ago)
- Topics: api, components-react, hooks, jsx, reactjs, smooth-scrolling
- Language: JavaScript
- Homepage: https://portfolioreactjsrenuka.netlify.app/
- Size: 6.53 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Portfolio Website
This is a personal portfolio website built using **React.js**. It highlights my profile, skills, services, and latest projects, with a fully responsive layout and smooth navigation experience. The site is designed to give a quick overview of who I am, what I do, and how to contact me.
---
## ✨ Features
- Built with **React.js**
- Smooth scrolling with `react-anchor-link-smooth-scroll`
- Modular component structure using JSX and CSS
- React Hooks: `useState`, `useRef`
- Dynamic content loading using data files (`my_Work_data.js`, `services_.js`)
- Contact form integration using **Web3Forms API**
- Fully responsive layout
- Copyright footer
---
## 📁 Components
- **Navbar** – Contains links to: Home, About Me, Services, My Work, Contact Me
- **About** – Introduction section with skills
- **MyWork** – Displays recent projects using dynamic data from `my_Work_data.js`
- **Services** – Showcases web development concepts I understand, powered by `services_.js`
- **Contact** – Functional form connected to Web3Forms for sending emails via POST and Fetch
- **Footer** – Includes copyright notice
---
## Technologies Used
- **React.js**
- **JavaScript (ES6)**
- **CSS**
- **React Hooks** (`useState`, `useRef`)
- **Web3Forms** (for email handling)
- **react-anchor-link-smooth-scroll**
---
## Contact Form Setup (Web3Forms)
To enable the contact form:
1. Sign up at [Web3Forms](https://web3forms.com) and get your API key.
2. Use the `POST` method with `fetch` to submit form data.
---
#### Deployed in Netlify