https://github.com/yousefraeis/watson-portfolio-site
Watson is a sleek and modern frontend portfolio crafted with React.js, SCSS, and Framer Motion. 🎨✨ Designed to showcase my skills and projects, it combines responsive layouts with smooth, eye-catching animations. Inspired by JavaScript Mastery, this portfolio reflects my passion for web development and continuous growth. 🚀
https://github.com/yousefraeis/watson-portfolio-site
css3 framer-motion front-end frontend html javascript javascript-mastery javascriptmastery js react reactjs scss
Last synced: about 2 months ago
JSON representation
Watson is a sleek and modern frontend portfolio crafted with React.js, SCSS, and Framer Motion. 🎨✨ Designed to showcase my skills and projects, it combines responsive layouts with smooth, eye-catching animations. Inspired by JavaScript Mastery, this portfolio reflects my passion for web development and continuous growth. 🚀
- Host: GitHub
- URL: https://github.com/yousefraeis/watson-portfolio-site
- Owner: yousefraeis
- Created: 2024-10-07T10:19:42.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-10-07T12:39:45.000Z (8 months ago)
- Last Synced: 2025-04-02T02:38:09.918Z (about 2 months ago)
- Topics: css3, framer-motion, front-end, frontend, html, javascript, javascript-mastery, javascriptmastery, js, react, reactjs, scss
- Language: JavaScript
- Homepage: https://watson-chi.vercel.app
- Size: 3.85 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Watson - Frontend Web Portfolio
Welcome to Watson, a modern and stylish frontend web portfolio developed using React.js, SCSS, and Framer Motion. This project showcases my skills and projects in an engaging and visually appealing manner.
## Table of Contents
- [Features](#features)
- [Technologies Used](#technologies-used)
- [Getting Started](#getting-started)
- [Installation](#installation)
- [Usage](#usage)
- [Deployment](#deployment)
- [🌐 Live Demo](#🌐-live-demo)
- [🎉 Acknowledgements](#🎉-acknowledgements)
## Features
- **Responsive Design**: Looks great on all devices.
- **Smooth Animations**: Enhances user experience with Framer Motion.
- **Modern UI**: Clean and intuitive design for better interaction.
- **Interactive Components**: Engaging elements to showcase projects.
## Technologies Used
- **React.js**: For building dynamic user interfaces.
- **SCSS**: For organized and maintainable styling.
- **Framer Motion**: To add smooth and attractive animations.
- **HTML5**: For the foundational structure of the web pages.
## Getting Started
To set up a local copy of Watson, follow these steps:
### Prerequisites
Ensure you have the following installed:
- Node.js (version 14 or later)
- npm (Node Package Manager)
### Installation
1. Clone the repository:
```bash
git clone https://github.com/yourusername/watson-portfolio.git
```
2. Navigate to the project directory:
```bash
cd watson-portfolio
```
3. Install the dependencies:
```bash
npm install
```
## Usage
To start the development server, run:
```bash
npm start
```
This will open the application in your default browser at `http://localhost:3000`.
## Deployment
To build the project for production, run:
```bash
npm run build
```
This will create a `build` folder containing the optimized version of your application, ready for deployment on any static hosting service.
## 🌐 Live Demo
Experience the live demo [here](https://watson-chi.vercel.app/).
## 🎉 Acknowledgements
A special thanks to Adrian Hajdin and his YouTube channel, JavaScript Mastery, for their outstanding tutorials that inspired this project. Be sure to check out their channel for invaluable insights into JavaScript and web development!