Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/yousefraeis/watson-portfolio
Watson is a modern frontend web portfolio built with React.js, SCSS, and Framer Motion. It showcases my skills and projects, focusing on responsive design and smooth animations. Inspired by JavaScript Mastery tutorials, this portfolio enhances my web development expertise.
https://github.com/yousefraeis/watson-portfolio
css3 framer-motion front-end frontend html javascript javascript-mastery javascriptmastery js react reactjs scss
Last synced: 2 months ago
JSON representation
Watson is a modern frontend web portfolio built with React.js, SCSS, and Framer Motion. It showcases my skills and projects, focusing on responsive design and smooth animations. Inspired by JavaScript Mastery tutorials, this portfolio enhances my web development expertise.
- Host: GitHub
- URL: https://github.com/yousefraeis/watson-portfolio
- Owner: yousefraeis
- Created: 2024-10-07T10:19:42.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-10-07T12:39:45.000Z (3 months ago)
- Last Synced: 2024-11-01T20:25:37.327Z (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!