Skip to content

Commit 4a4a440

Browse files
davidagustinclaude
andcommitted
feat: update featured projects list and improve scroll navigation
Update FEATURED_IDS to: Coding Drills, Sign Language Learning, Backend Engineer Detective, Coding Tricks Practice, UI Patterns React, System Design Practice, React 30. Keep featured cards simple (no rich detail). Improve scroll-to-section with navbar offset (64px) so sections don't hide behind the fixed nav. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent af30260 commit 4a4a440

File tree

3 files changed

+15
-9
lines changed

3 files changed

+15
-9
lines changed

README.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,12 @@ Personal portfolio showcasing 25 full-stack projects built with React, Next.js,
2222
| Project | Stack | Description |
2323
|---------|-------|-------------|
2424
| [Coding Drills](https://coding-drills.vercel.app) | Next.js 16, React 19, Monaco Editor, WebLLM | Interactive learning platform — thousands of problems across 25 languages |
25-
| [PIIxelate](https://piixelate.vercel.app) | Next.js 15, Tesseract.js, OpenAI | Multi-layer PII detection and pixelation with 7-layer architecture |
26-
| [Coding Tricks Practice](https://coding-tricks-practice.vercel.app) | Next.js, TypeScript, Monaco Editor | Interactive coding challenges with live code execution |
27-
| [20 Newsgroups ML](https://machine-learning-project-theta.vercel.app) | Next.js, Scikit-learn, XGBoost | ML analysis dashboard with 10+ algorithms |
28-
| [Backend Engineer Detective](https://backend-engineer-detective.app-production.workers.dev/) | Node.js, Cloudflare Workers | Backend engineering challenges and detective puzzles |
29-
| [React 30](https://react-30-nu.vercel.app) | React 19, TypeScript, Framer Motion | 30-day React challenge with progressive complexity |
3025
| [Sign Language Learning](https://spell-your-name.vercel.app/) | Next.js 15, MediaPipe, React 19 | ASL learning with real-time hand tracking |
26+
| [Backend Engineer Detective](https://backend-engineer-detective.app-production.workers.dev/) | Cloudflare Workers, TypeScript | 121 investigation cases with AI mentor guidance |
27+
| [Coding Tricks Practice](https://coding-tricks-practice.vercel.app) | Next.js, TypeScript, Monaco Editor | 155+ LeetCode-style challenges across 19 categories |
28+
| [UI Patterns React](https://ui-patterns-react.vercel.app/) | Next.js 15, React 19, TypeScript 5.6 | 90+ production-ready components, WCAG 2.1 AA |
29+
| [System Design Practice](https://system-design-practice.vercel.app/) | Next.js 15, React 19, TypeScript | 50 study topics, 40 concepts, 60 quizzes |
30+
| [React 30](https://react-30-nu.vercel.app) | Next.js 16, React 19, TypeScript | 30 vanilla JS projects rebuilt as modern React |
3131

3232
[View all 25 projects on the live site.](https://davidagustin.github.io/#projects)
3333

src/components/Projects.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ const ProjectThumbnail: React.FC<{ project: Project; className?: string }> = ({
4242
};
4343

4444
/* ─── Featured Strip ─── */
45-
const FEATURED_IDS = [1, 21, 24, 5, 23, 25, 17];
45+
const FEATURED_IDS = [1, 17, 23, 24, 19, 18, 25];
4646

4747
const FeaturedStrip: React.FC<{ onSelect: (p: Project) => void }> = ({ onSelect }) => {
4848
const featured = useMemo(() =>
@@ -60,8 +60,8 @@ const FeaturedStrip: React.FC<{ onSelect: (p: Project) => void }> = ({ onSelect
6060

6161
const interval = setInterval(() => {
6262
if (!isHoveredRef.current && scrollRef.current) {
63-
// Card width: w-80 (320px) + gap-4 (16px) = 336px
64-
const cardWidth = 336;
63+
// Card width: w-96 (384px) + gap-4 (16px) = 400px
64+
const cardWidth = 400;
6565
scrollRef.current.scrollBy({ left: cardWidth, behavior: 'smooth' });
6666

6767
// If reached the end, scroll back to start

src/utils/scroll.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
11
export const scrollToSection = (sectionId: string): void => {
2+
if (sectionId === 'home') {
3+
window.scrollTo({ top: 0, behavior: 'smooth' });
4+
return;
5+
}
26
const element = document.getElementById(sectionId);
37
if (element) {
4-
element.scrollIntoView({ behavior: 'smooth' });
8+
const navbarHeight = 64;
9+
const top = element.getBoundingClientRect().top + window.scrollY - navbarHeight;
10+
window.scrollTo({ top, behavior: 'smooth' });
511
}
612
};

0 commit comments

Comments
 (0)