a modern, interactive portfolio showcasing my skills and projects as a full-stack software developer.
react | typescript | tailwind css | vite | framer motion |
- animated ascii art header: eye-catching introduction using framer motion
- interactive tech stack display: hover-triggered project information
- key projects showcase: highlighting my best work with github links
- responsive design: seamless experience across all devices
- dark mode: sleek, terminal-inspired interface
src/
βββ components/
β βββ ascii/
β β βββ AnimatedASCII.tsx # ascii art animation
β β βββ SocialLinks.tsx # github and linkedin links
β βββ layout/
β β βββ Footer.tsx # page footer with tech icons
β β βββ Header.tsx # personal info and contact
β β βββ Layout.tsx # main container component
β βββ projects/
β β βββ KeyProjects.tsx # featured projects section
β βββ tech/
β βββ TechStack.tsx # interactive tech stack display
β βββ TechStackItem.tsx # individual tech item component
βββ main.tsx # app entry point
βββ index.css # global styles and tailwind imports
- clone:
git clone https://github.com/detalhe/portfolio.git
- install:
npm install
- run:
npm run dev
- view: open
http://localhost:5173
in your browser
- personal info: update
Header.tsx
- projects: modify
KeyProjects.tsx
- tech stack: adjust
TechStack.tsx
andTechStackItem.tsx
- styling: customize Tailwind classes in component files
optimized for easy deployment on vercel or netlify. follow their docs for specific instructions.
github |