This repository hosts my personal professional portfolio, engineered to be fast, responsive, and scalable.
Unlike traditional static HTML portfolios, this application is built as a Single Page Application (SPA) using the React ecosystem. It features a custom-built blogging system powered by Fumadocs MDX, allowing for type-safe, component-rich documentation and articles directly within the app.
I chose a modern stack to ensure performance and maintainability:
- Core Framework:
React.js(v18+) for component-based UI architecture. - Build Tool:
Vitefor lightning-fast Hot Module Replacement (HMR) and optimized production builds. - Styling:
Tailwind CSSfor a utility-first, fully responsive design system without CSS bloat. - Routing:
React Router DOMfor seamless client-side navigation. - Content Management:
Fumadocs MDXto manage blog posts and documentation as code, enabling rich content rendering.
- Dynamic Project Showcase: reusable card components that display project details, live demos, and source code links.
- Integrated Tech Blog: A fully functional blog section using MDX, allowing me to write technical articles using Markdown + React components.
- Responsive Layout: Mobile-first design that adapts flawlessly to tablets and desktops.
- Direct Connect: Integrated "Copy Email" functionality and social media quick-links for seamless networking.
I am treating this portfolio as a living product. Upcoming features include:
- Dark Mode: Implementing a system-wide theme toggler using Tailwind's dark mode class strategy.
- Performance Optimization: Implementing lazy loading for image assets to improve Lighthouse scores.
- CMS Integration: Exploring headless CMS options to decouple content from code further.
- Clone the repository:
git clone https://github.com/tsdebug/my-portfolio-react
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Open the local host link (usually
http://localhost:5173) in your browser.
Engineered with React, styled with Tailwind, and built for performance.