https://github.com/itsalexhimself/portfolio
A modern, responsive portfolio website built with React. Features dark mode, smooth animations, and a clean design. Built with React, Framer Motion, and Emotion.
https://github.com/itsalexhimself/portfolio
css css3 emotion framer-motion java javascript node-js nodejs portfolio portfolio-construction portfolio-management portfolio-optimization portfolio-page portfolio-project portfolio-site portfolio-template portfolio-website portfolios react reactjs
Last synced: 7 months ago
JSON representation
A modern, responsive portfolio website built with React. Features dark mode, smooth animations, and a clean design. Built with React, Framer Motion, and Emotion.
- Host: GitHub
- URL: https://github.com/itsalexhimself/portfolio
- Owner: ItsAlexHimself
- License: other
- Created: 2025-03-04T11:59:16.000Z (7 months ago)
- Default Branch: master
- Last Pushed: 2025-03-04T12:12:41.000Z (7 months ago)
- Last Synced: 2025-03-04T13:24:06.110Z (7 months ago)
- Topics: css, css3, emotion, framer-motion, java, javascript, node-js, nodejs, portfolio, portfolio-construction, portfolio-management, portfolio-optimization, portfolio-page, portfolio-project, portfolio-site, portfolio-template, portfolio-website, portfolios, react, reactjs
- Language: JavaScript
- Homepage:
- Size: 196 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Modern Portfolio Website
A beautiful, responsive portfolio website built with React, featuring dark mode support, smooth animations, and a modern design.
## Features
- 🌓 Dark/Light mode toggle
- 🎨 Modern and clean design
- 📱 Fully responsive layout
- ✨ Smooth animations using Framer Motion
- 🎯 Section-based navigation
- 📝 Contact form
- 📊 Skills visualization
- ⏳ Experience timeline
- 🖼️ Project showcase
- 🔗 Social media integration
## Light Mode Preview
## Dark Mode Preview
## Technologies Used
- React.js
- Framer Motion
- Emotion (styled-components)
- React Icons
- CSS Variables
- Modern CSS Features
## Getting Started
### Prerequisites
- Node.js (v14 or higher)
- npm or yarn
### Installation
1. Clone the repository
```bash
git clone https://github.com/yourusername/portfolio.git
```
2. Navigate to the project directory
```bash
cd portfolio
```
3. Install dependencies
```bash
npm install
# or
yarn install
```
4. Start the development server
```bash
npm start
# or
yarn start
```
5. Open [http://localhost:3000](http://localhost:3000) to view it in your browser
## Customization
1. Update personal information in `src/App.js`
2. Replace placeholder images with your own
3. Modify the color scheme in `src/App.css`
4. Add your own projects to the `projects` array
5. Update skills and experience in their respective arrays
6. Add your social media links
7. Update the contact form endpoint
## Project Structure
```
portfolio/
├── public/
│ ├── index.html
│ └── favicon.ico
├── src/
│ ├── components/
│ │ └── ProjectCard.js
│ ├── App.js
│ ├── App.css
│ └── index.js
├── package.json
├── README.md
└── LICENSE
```
## License
This project is licensed under the Creative Commons Attribution-NonCommercial 4.0 International License - see the [LICENSE](LICENSE) file for details.
### What you can do:
- Use the code for personal or non-commercial projects
- Modify and adapt the code
- Share the code with others
### What you cannot do:
- Use the code for commercial purposes without permission
- Remove the attribution requirement
- Claim the code as your own
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
## Acknowledgments
- [React](https://reactjs.org/)
- [Framer Motion](https://www.framer.com/motion/)
- [Emotion](https://emotion.sh/)
- [React Icons](https://react-icons.github.io/react-icons/)
## Contact
- **GitHub:** [itsalexhimself](https://github.com/itsalexhimself)
- **Email:** [itsalexhimself1@protonmail.com](mailto:itsalexhimself1@protonmail.com)
Project Link: [https://github.com/itsalexhimself/portfolio](https://github.com/itsalexhimself/portfolio-website)