ViteReactHTMLPortfolio

react-portfolio — Vite Portfolio Template

By vedangdhuri

A personal portfolio website template built on React and Vite, including page components for the hero section, about, skills, projects, and contact, along with an animated starry background and scroll-aware navigation.

Open Source Site Download Source ZIP

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews

Desktop homepage1 / 2

Visit websiteOpens in a new tab

Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-16View source

What stands out

A quick read of the recorded project description.

Built with React, configured for development with Vite and custom aliases

Includes visual presentation with an animated starry background and dynamic sections

Provides scroll-aware navigation and responsive layout

Integrates toast notifications and contact form components

Components are organized in layers by pages and ui, with additional hooks and lib utility directories

Released under the MIT license

Template Details

This is a portfolio website template for showcasing personal projects and skills, and the README positions it as Vedang Dhuri's personal portfolio project. The project is built with React, configured for development with Vite and custom aliases, and the interface layer incorporates React Bootstrap and Bootstrap, along with Tailwind CSS-related notes.

The core features listed in the README include: an animated starry background and dynamic sections, scroll-aware navigation and responsive layout, toast notifications and a contact form, and modular component and utility organization. The source structure shows page components divided into HeroSection, AboutSection, SkillSection, ProjectSection, ContactSection, Navbar, Footer, and StarBackground; UI components include AnimatedContent, ProfileCard, ScrollStack, FlipWords, and toast/toaster; there are also hooks/use-toast and lib/utils.

The README does not provide information on data sources, content management, deployment process, browser compatibility, or performance, nor does it explain the backend handling of the contact form. The installation steps are to clone the repository, run npm install, run npm start, and open the page at http://localhost:5173/. The project is released under the MIT license.

ViteReactHTMLPortfolio

Is it right for your project?

Use Cases

Building a personal portfolio website to showcase projects and skills
Serving as a component-based structure reference for React + Vite projects
Adding animated backgrounds and scroll interaction effects to a personal homepage
Providing an interface implementation with a form and toast prompts for the contact area

Suitable For

Individual developers who need a React portfolio template
Frontend learners who want to reference component layering and page structure
Users preparing to build a personal homepage by replacing content based on existing components

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

1
Clone the repository: git clone https://github.com/vedangdhuri/vedangdhuri.github.io
2
After entering the directory, run npm install to install dependencies
3
Run npm start to launch the application
4
Open http://localhost:5173/ in a browser to view the page
5
The README does not describe deployment steps or the production build method

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version in a public repository under the MIT license; the free scope is the code of this version and does not mean that external services or third-party assets are free.

Must comply with when using

Free use, modification, commercial use, and distribution of this version's code are permitted.
When distributing copies or substantial portions of the code, retain the original author's copyright notice and the complete MIT license notice.
The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
External services such as domains, hosting, databases, payments, or AI may incur separate charges.

View Original Text Basis

Permission is hereby granted, free of charge
Original License Text

https://github.com/vedangdhuri/react-portfolio/blob/main/LICENSE https://github.com/vedangdhuri/react-portfolio/blob/main/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-16. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms: GitHub
Documentation and maintenance reference score: More documented · 88 / 100
Technologies: Vite · React · HTML
Website type: Portfolio

How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded: 2026-01-30
Screenshot last checked: 2026-10-16

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Vite as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Review declaration: codex-user-requested-batch-review-20261017 · 2026-10-16

Inspect the recorded source material

SHA-256: 382a3c52639af07c30b49007b62d329be9da502670ddf378e723cbbd80e2f9d0

2026-10-16T16:12:33.241Z

Source file / repository

<h1 align="center">REACT PORTFOLIO</h1>
<h3 align="center">Transforming Visions Into Stunning Digital Realities</h3>
<div align=center>
    <img src="https://img.shields.io/github/last-commit/vedangdhuri/vedangdhuri.github.io?style=flat&logo=git&logoColor=white&color=0080ff" alt=""/>
    <img src="https://img.shields.io/github/languages/top/vedangdhuri/vedangdhuri.github.io?style=flat&color=0080ff" alt=""/>
    <img src="https://img.shields.io/github/languages/count/vedangdhuri/vedangdhuri.github.io?style=flat&color=0080ff" alt=""/>
    <a href="https://vedangdhuri.github.io/"><img src="https://img.shields.io/badge/Visit_Site-Portfolio-blue?style=flat&color=0080ff" alt=""/></a> 
</div>
<h2 align="center">Built with the tools and technologies:</h2>
<div align="center">
    <img src="https://img.shields.io/badge/JSON-000?logo=json&logoColor=fff" alt="" />
    <img src="https://img.shields.io/badge/npm-CB3837?logo=npm&logoColor=fff" alt="" />
    <img src="https://img.shields.io/badge/esbuild-FFCF00.svg?style=flat&logo=esbuild&logoColor=black" alt="" />
    <img src="https://img.shields.io/badge/JavaScript-F7DF1E?logo=javascript&logoColor=000" alt="" />
    <img src="https://img.shields.io/badge/React%20Bootstrap-41E0FD.svg?style=flat&logo=React-Bootstrap&logoColor=black" alt="" /> <br/>
    <img src="https://img.shields.io/badge/React-%2320232a.svg?logo=react&logoColor=%2361DAFB" alt="" />
    <img src="https://img.shields.io/badge/Vite-646CFF?logo=vite&logoColor=fff" alt="" />
    <img src="https://img.shields.io/badge/ESLint-4B32C3.svg?style=flat&logo=ESLint&logoColor=white" alt="" />
    <img src="https://img.shields.io/badge/Bootstrap-7952B3.svg?style=flat&logo=Bootstrap&logoColor=white" alt="" />
</div>
<h2 align="left">✅ Overview</h2>
<p>Vedang Dhuri's portfolio website template is a modern, React-powered project designed to showcase personal projects and skills with style and efficiency. It combines cutting-edge tools like Vite, Tailwind CSS, and Bootstrap to enable rapid development and a cohesive user experience.</p>

<h4 align="left">Why vedangdhuri.github.io?</h4>
<p>This project provides a robust foundation for building engaging, visually appealing personal websites. The core features include:</p>
<ul align="left">
    <li><strong>🌟 Visual Enhancements:</strong>  Animated starry backgrounds and dynamic sections create an immersive browsing experience.</li>
    <li><strong>🛠 Streamlined Configuration:</strong>  Uses Vite and custom aliases for fast, consistent development workflows.</li>
    <li><strong>🚀 User Engagement:</strong>  Integrated toast notifications and contact forms facilitate real-time interaction.</li>
    <li><strong>📦 Modular Architecture:</strong>  Well-organized components and utilities promote maintainability and scalability.</li>
    <li><strong>🖥 Responsive Design:</strong> Scroll-aware navigation and adaptable layouts ensure seamless access across devices.</li>
</ul>

<h2 align="left">⚙️ Installation & Setup</h2>

1. 1️⃣ Clone the repository
    <pre><code>❯ git clone https://github.com/vedangdhuri/vedangdhuri.github.io</code></pre>
    <pre><code>cd vedangdhuri.github.io</code></pre>

2. 2️⃣ Install dependencies
    <pre><code>npm install</code></pre>

3. 3️⃣ Run the app
    <pre><code>npm start</code></pre>

4. 4️⃣ Open in browser
   <p>The app will automatically open at</p>
   <pre><code>http://localhost:5173/</code></pre>

<h2 align="left">🧭 Project Structure</h2>
<pre><code>
src/
├── assets/
│   ├── font/
│   │   ├── Poppins-Bold.ttf
│   │   └── BastligaOne.ttf
│   └── img/
│       ├── code.png
│       ├── main_image.png
│       ├── match_master_game.png
│       ├── safecityhub.png
│       ├── to_do_list_using_react.png
│       ├── top_icon.png
│       ├── weather_app.png
│       ├── aes_ed.png
│       └── homeImg.png
├── components/
│   ├── ui/
│   │   ├── css/
│   │   │   ├── ProfileCard.css
│   │   │   └──ScrollStack.css
│   │   ├── AnimatedContent.jsx
│   │   ├── ProfileCard.jsx
│   │   ├── ScrollStack.jsx
│   │   ├── FlipWords.jsx
│   │   ├── toast.jsx
│   │   └── toaster.jsx
│   └── pages/
│       ├── AboutSection.jsx
│       ├── ContactSection.jsx
│       ├── Footer.jsx
│       ├── HeroSection.jsx
│       ├── Navbar.jsx
│       ├── ProjectSection.jsx
│       ├── SkillSection.jsx
│       └── StarBackground.jsx
├── hooks/
│   └── use-toast.jsx
├── lib/
│   └── utils.jsx
├── App.jsx
├── index.css
└── main.jsx
</code></pre>

<h2 align="left">📜 License</h2>
<p>Licensed under the <a href="https://github.com/vedangdhuri/vedangdhuri.github.io/blob/main/LICENSE" target="_blank">MIT License</a>.</p>

Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

Resumify

Resumify is a browser-based resume builder built with React, TypeScript, and Vite.

Vite · Portfolio

showlit

Showlit is a personal website template built with React, Vite, TypeScript, Tailwind CSS, and shadcn/ui.

Vite · Portfolio

folium

A developer portfolio template built with Vite, React, TypeScript, and Tailwind CSS.

Vite · Portfolio

kurizu-discord

A personal portfolio website built with React and Vite that mimics the Discord desktop app, organizing projects, skills, and experience into customizable channels, threads, a member list, and emoji reactions.

Vite · Portfolio

cv-educornelsen

A React + TypeScript personal portfolio template built with Vite, featuring a streaming AI chatbot powered by Google Gemini. An Express backend proxies requests to keep the API key server-side, with rate limiting, IP throttling, canary token injection, and LangFuse tracing.

Vite · Portfolio

about-me-personal-portfolio-website-template

AboutMe is a free personal website template built with Bootstrap and Vite, released under the MIT license. It provides a single-page index.html with organized src directories for images, JavaScript, and SCSS, along with npm scripts for development and build.

Vite · Portfolio