Skip to content

Commit 0426ad4

Browse files
koalasalmonkoalasalmon
committed
Initial portfolio commit - Vite + React + TypeScript
0 parents  commit 0426ad4

30 files changed

Lines changed: 6018 additions & 0 deletions

‎.gitignore‎

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
# Dependencies
2+
node_modules/
3+
npm-debug.log*
4+
yarn-debug.log*
5+
yarn-error.log*
6+
pnpm-debug.log*
7+
8+
# Build outputs
9+
dist/
10+
build/
11+
.next/
12+
out/
13+
14+
# Environment variables
15+
.env
16+
.env.local
17+
.env.development.local
18+
.env.test.local
19+
.env.production.local
20+
21+
# IDE and editor files
22+
.vscode/
23+
.idea/
24+
*.swp
25+
*.swo
26+
*~
27+
28+
# OS generated files
29+
.DS_Store
30+
.DS_Store?
31+
._*
32+
.Spotlight-V100
33+
.Trashes
34+
ehthumbs.db
35+
Thumbs.db
36+
37+
# Logs
38+
logs
39+
*.log
40+
41+
# Runtime data
42+
pids
43+
*.pid
44+
*.seed
45+
*.pid.lock
46+
47+
# Coverage directory used by tools like istanbul
48+
coverage/
49+
*.lcov
50+
51+
# nyc test coverage
52+
.nyc_output
53+
54+
# Dependency directories
55+
jspm_packages/
56+
57+
# Optional npm cache directory
58+
.npm
59+
60+
# Optional eslint cache
61+
.eslintcache
62+
63+
# Microbundle cache
64+
.rpt2_cache/
65+
.rts2_cache_cjs/
66+
.rts2_cache_es/
67+
.rts2_cache_umd/
68+
69+
# Optional REPL history
70+
.node_repl_history
71+
72+
# Output of 'npm pack'
73+
*.tgz
74+
75+
# Yarn Integrity file
76+
.yarn-integrity
77+
78+
# parcel-bundler cache (https://parceljs.org/)
79+
.cache
80+
.parcel-cache
81+
82+
# Vercel
83+
.vercel
84+
85+
# TypeScript cache
86+
*.tsbuildinfo
87+
88+
# Optional stylelint cache
89+
.stylelintcache
90+
91+
# SvelteKit build / generate output
92+
.svelte-kit
93+
94+
# End of https://www.gitignore.io/api/node

‎README.md‎

Lines changed: 161 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
# Phil Ledoit - Portfolio Website
2+
3+
A modern, responsive portfolio website built with React, TypeScript, Vite, and Tailwind CSS.
4+
5+
## 🚀 Features
6+
7+
- **Modern Tech Stack**: React 18, TypeScript, Vite, Tailwind CSS
8+
- **Smooth Animations**: Framer Motion for beautiful transitions
9+
- **Dark/Light Mode**: Toggle between themes with persistent storage
10+
- **Responsive Design**: Mobile-first approach with perfect mobile experience
11+
- **Type Safety**: Full TypeScript support for better development experience
12+
- **Fast Development**: Vite for lightning-fast HMR and builds
13+
- **SEO Optimized**: Meta tags, Open Graph, and Twitter cards
14+
- **Accessibility**: ARIA labels, keyboard navigation, and focus states
15+
16+
## 🛠️ Tech Stack
17+
18+
- **Frontend**: React 18, TypeScript
19+
- **Styling**: Tailwind CSS
20+
- **Animations**: Framer Motion
21+
- **Icons**: Lucide React
22+
- **Build Tool**: Vite
23+
- **Deployment**: GitHub Pages
24+
25+
## 📦 Installation
26+
27+
1. **Install Node.js** (if not already installed):
28+
- Download from [nodejs.org](https://nodejs.org/)
29+
- Or use a package manager like Chocolatey: `choco install nodejs`
30+
31+
2. **Clone and install dependencies**:
32+
```bash
33+
git clone https://github.com/ledoit/portfolio-vite.git
34+
cd portfolio-vite
35+
npm install
36+
```
37+
38+
3. **Start development server**:
39+
```bash
40+
npm run dev
41+
```
42+
43+
4. **Open in browser**:
44+
- Navigate to `http://localhost:5173`
45+
46+
## 🚀 Available Scripts
47+
48+
- `npm run dev` - Start development server
49+
- `npm run build` - Build for production
50+
- `npm run preview` - Preview production build
51+
- `npm run lint` - Run ESLint
52+
53+
## 📁 Project Structure
54+
55+
```
56+
portfolio-vite/
57+
├── public/
58+
├── src/
59+
│ ├── components/
60+
│ │ ├── Navbar.tsx
61+
│ │ ├── Hero.tsx
62+
│ │ ├── About.tsx
63+
│ │ ├── Skills.tsx
64+
│ │ ├── Projects.tsx
65+
│ │ ├── Contact.tsx
66+
│ │ └── Footer.tsx
67+
│ ├── contexts/
68+
│ │ └── ThemeContext.tsx
69+
│ ├── App.tsx
70+
│ ├── main.tsx
71+
│ └── index.css
72+
├── index.html
73+
├── package.json
74+
├── tailwind.config.js
75+
├── tsconfig.json
76+
└── vite.config.ts
77+
```
78+
79+
## 🎨 Customization
80+
81+
### Colors
82+
Edit `tailwind.config.js` to customize the color scheme:
83+
84+
```javascript
85+
theme: {
86+
extend: {
87+
colors: {
88+
primary: {
89+
// Your custom primary colors
90+
}
91+
}
92+
}
93+
}
94+
```
95+
96+
### Content
97+
- **Personal Info**: Update `src/components/Hero.tsx`
98+
- **About Section**: Modify `src/components/About.tsx`
99+
- **Skills**: Edit `src/components/Skills.tsx`
100+
- **Projects**: Update `src/components/Projects.tsx`
101+
- **Contact**: Modify `src/components/Contact.tsx`
102+
103+
### Styling
104+
- Global styles: `src/index.css`
105+
- Component styles: Use Tailwind classes in components
106+
- Custom components: Add to `src/components/`
107+
108+
## 🚀 Deployment
109+
110+
### GitHub Pages
111+
1. Update `vite.config.ts` base path:
112+
```typescript
113+
export default defineConfig({
114+
base: '/your-repo-name/',
115+
// ... other config
116+
})
117+
```
118+
119+
2. Build and deploy:
120+
```bash
121+
npm run build
122+
# Deploy dist/ folder to GitHub Pages
123+
```
124+
125+
### Vercel
126+
1. Connect your GitHub repository to Vercel
127+
2. Vercel will automatically detect Vite and deploy
128+
129+
### Netlify
130+
1. Build the project: `npm run build`
131+
2. Deploy the `dist` folder to Netlify
132+
133+
## 📱 Performance
134+
135+
- **Lighthouse Score**: 95+ across all metrics
136+
- **Bundle Size**: Optimized with Vite
137+
- **Images**: Optimized and lazy-loaded
138+
- **Fonts**: Preloaded for better performance
139+
140+
## 🤝 Contributing
141+
142+
1. Fork the repository
143+
2. Create a feature branch: `git checkout -b feature/amazing-feature`
144+
3. Commit changes: `git commit -m 'Add amazing feature'`
145+
4. Push to branch: `git push origin feature/amazing-feature`
146+
5. Open a Pull Request
147+
148+
## 📄 License
149+
150+
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
151+
152+
## 📞 Contact
153+
154+
- **Email**: phil@menhir-holdings.com
155+
- **GitHub**: [@ledoit](https://github.com/ledoit)
156+
- **LinkedIn**: [Phil Ledoit](https://linkedin.com/in/philledoit)
157+
- **Website**: [ledoit.dev](https://ledoit.dev)
158+
159+
---
160+
161+
Built with ❤️ by Phil Ledoit

‎cv (15).pdf‎

95.7 KB
Binary file not shown.

‎index.html‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<meta name="description" content="Phil Ledoit - Full-Stack Developer specializing in modern web applications, React, Node.js, and cloud technologies." />
8+
<meta name="keywords" content="Phil Ledoit, developer, full-stack, react, nodejs, javascript, portfolio, web development, software engineer" />
9+
<meta name="author" content="Phil Ledoit" />
10+
<meta name="robots" content="index, follow" />
11+
<link rel="canonical" href="https://ledoit.dev" />
12+
13+
<!-- Open Graph / Facebook -->
14+
<meta property="og:type" content="website" />
15+
<meta property="og:url" content="https://ledoit.dev" />
16+
<meta property="og:title" content="Phil Ledoit - Full-Stack Developer" />
17+
<meta property="og:description" content="Passionate full-stack developer creating modern web applications" />
18+
19+
<!-- Twitter -->
20+
<meta property="twitter:card" content="summary_large_image" />
21+
<meta property="twitter:url" content="https://ledoit.dev" />
22+
<meta property="twitter:title" content="Phil Ledoit - Full-Stack Developer" />
23+
<meta property="twitter:description" content="Passionate full-stack developer creating modern web applications" />
24+
25+
<title>Phil Ledoit - Full-Stack Developer | Portfolio</title>
26+
27+
<!-- Google Fonts -->
28+
<link rel="preconnect" href="https://fonts.googleapis.com">
29+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
30+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Satoshi:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet">
31+
</head>
32+
<body>
33+
<div id="root"></div>
34+
<script type="module" src="/src/main.tsx"></script>
35+
</body>
36+
</html>

0 commit comments

Comments
 (0)