Skip to content

liquizz/personal-website

Repository files navigation

Vladyslav Sheiko's Personal Website

This repository contains the source code for my personal portfolio website built with modern web technologies. The site showcases my professional experience, skills, and contact information in a clean, responsive design with dark/light theme support.

🌐 Hosted Website Link

🌟 Features

  • Responsive Design - Optimized for all device sizes
  • Light/Dark Mode - Smooth theme transitions with dynamic backgrounds
  • Interactive UI - Animated components using Framer Motion
  • Internationalization - Multi-language support using i18next
  • Dynamic Backgrounds - Interactive 3D network effect using Vanta.js
  • Accessibility - Built with a11y best practices
  • SEO Optimized - Proper meta tags with React Helmet

🛠️ Technologies Used

  • React - UI library
  • TypeScript - Type safety
  • Tailwind CSS - Utility-first styling
  • Framer Motion - Animations
  • i18next - Internationalization
  • Vanta.js - 3D background effects
  • Three.js - WebGL rendering
  • Lucide Icons - Modern SVG icons

📁 Project Structure

src/
├── components/
│   ├── About.tsx - About section with personal information
│   ├── Contact.tsx - Contact form and information
│   ├── Experience.tsx - Professional experience timeline
│   ├── Header.tsx - Navigation and theme toggle
│   ├── Hero.tsx - Landing section with Vanta.js background
│   ├── LanguageSwitcher.tsx - Language selection component
│   ├── SEO.tsx - SEO metadata component
│   └── Skills.tsx - Technical skills section
├── assets/
│   ├── files/ - Resume and other downloadable files
│   └── images/ - Image assets
├── i18n/ - Translation files
├── App.tsx - Main application component
└── index.tsx - Entry point

🚀 Getting Started

Prerequisites

  • Node.js (v18+)
  • npm or yarn

Installation

  1. Clone the repository:
git clone https://github.com/liquizz/personal-website.git
cd personal-website
  1. Install dependencies:
npm install
# or
yarn
  1. Start the development server:
npm start
# or
yarn start
  1. Open http://localhost:5173 in your browser.

✨ Special Features

Interactive Network Background

The website features a dynamic background created with Vanta.js that responds to user interaction and changes smoothly when switching between light and dark themes.

Smooth Theme Transitions

Theme changes include a smooth fade transition effect that enhances user experience while switching between light and dark modes.

Responsive Glass Morphism

UI components use modern glass morphism effects with backdrop filters for an elegant, contemporary look that works across different themes.

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🔗 Contact


Built with ❤️ by Vladyslav Sheiko