Portfolio Website

Overview

This is a modern portfolio website built with Next.js, React, and TypeScript. The website features an interactive dot background animation, a technology stack showcase, and a scrollable UI with a scroll-to-top button.

Features

• Interactive Dot Background: A canvas-based animation that responds to mouse movement
• Technology Stack Display: Showcases proficiency and usage of various technologies with animated progress bars
• Responsive Design: Optimized for various screen sizes
• Scroll-to-Top Button: Appears when scrolling down and smoothly returns to the top of the page

Technologies Used

• React: Frontend library for building user interfaces
• Next.js: React framework for server-side rendering and static site generation
• TypeScript: Typed superset of JavaScript
• SCSS: For advanced styling capabilities
• React Icons: For technology and UI icons

Getting Started

Prerequisites

• Node.js (v14 or higher recommended)
• npm or yarn

Installation

# Clone the repository
git clone <repository-url>

# Navigate to project directory
cd <project-directory>

# Install dependencies
npm install
# or
yarn install

Running the Development Server

npm run dev
# or
yarn dev

Open http://localhost:3000 in your browser to see the result.

Project Structure

• src/app/_components/: React components
  • dotbackground.tsx: Interactive canvas background
  • technology.tsx: Technology stack showcase
  • scrollToTop.tsx: Button to scroll to the top
• src/styles/: SCSS style modules

License

MIT License

Author

Erick Tran / enVId Tech