Welcome this portfolio website! This project showcases work as a web developer and is built using React with several modern libraries to enhance its functionality, animations, and user experience.
This is a simple yet dynamic portfolio website that provides a visually appealing and interactive experience for visitors. Below is a brief description of the core libraries and tools I used in this project.
- React: The entire website is built using React, a powerful JavaScript library for building user interfaces.
- Vite: The development environment leverages Vite, a fast build tool that helps with a quicker and smoother development experience.
I used Framer Motion to add smooth animations and interactions to the website. It provides easy-to-use hooks for animating components, making the website feel more dynamic and engaging.
This library helped in implementing smooth scrolling between different sections of the website. It provides an easy way to add anchor links that create a seamless navigation experience for users.
I utilized React-Hook-Form for the contact form to handle form state and validation in a simple, performant way. This helped ensure that form submission and validation are intuitive for both users and developers.
Keen-Slider is used to create responsive carousels in the project. It provided an efficient and lightweight way to display slideshows of images or projects in a sleek, modern way.
- Components: The reusable UI components (e.g., buttons, loaders, social media icons) are stored in the
components
folder. - Sections: Each page section (e.g., About, Projects, Contact) is kept in the
sections
folder, making the codebase modular and easier to manage. - Hooks: I used a custom hook stored in the
hooks
folder to simplify and reuse common logic.
To get started with this project, you'll need to have Node.js and npm installed on your machine.
Clone the repository:
git clone [https://github.com/Gitzak/react-portfolio-app-design.git](https://github.com/Gitzak/react-portfolio-app-design.git)
Navigate to the project folder and install dependencies:
cd your-portfolio
npm install
Run the development server:
npm run dev
**Available Scripts**
-
npm run dev: Starts the development server using Vite.
-
npm run build: Builds the project for production.
-
npm run preview: Previews the production build.
**Contact**
If you have any questions or suggestions, feel free to contact me.
**License**
This project is open source and available under the MIT License.