In ProgressPersonalFeatured
racu.dev - Personal Website
Personal Website & Professional Dossier A modern personal website built with Next.js 15 and React 19 , featuring a glassmorphism design system, three-tier access control (public, gated, admin), bilingual content (EN/RO), and a full-featured admin dashboard for managing portfolio, blog, testimonials, and more. Core Stack Technology Role Next.js 15 Turbopack, App Router, Server Components & Server Actions React 19 Modern hooks — useActionState, useTransition, useOptimistic TypeScript 5.9 Strict mode across the entire codebase Tailwind CSS 4 Custom design tokens and glassmorphism component library PostgreSQL + Prisma ORM 40+ models, idempotent migrations, safe production deploys Vercel Hosting, edge middleware, and blob storage Key Features Feature Description Portfolio Project showcase with rich text descriptions (Tiptap), image galleries, tech stack tags, and live GitHub activity timelines with adaptive date grouping Blog Full publishing system with bilingual content, Tiptap rich text, syntax-highlighted code blocks (Lowlight), tags, and multiple formats — articles, TIL, case studies Git Activity Dashboard Automated GitHub/Bitbucket import pipeline (commits, PRs, comments, languages) with yearly activity stats, per-repo breakdowns, and animated counters Access Control Three visibility tiers: public, gated via signed tokens, and admin-only. Includes a gated access request pipeline with scoring, enrichment, and email notifications via Resend Testimonials Submission form, LinkedIn import, admin approval queue, and public display with expandable cards CV System Structured resume data (experience, education, skills, languages), PDF export via react-pdf, and DOCX import support i18n Fully bilingual (English & Romanian) with a type-safe dictionary system and locale-aware date formatting Admin Dashboard Complete CMS for projects, blog posts, testimonials, media, CV, access requests, git repo sync, and site settings Additional Technologies Library Purpose Three.js / React Three Fiber 3D graphics and interactive visuals GSAP Smooth scroll-driven animations and transitions Tiptap 3 Rich text editing with code block syntax highlighting NextAuth 5 OAuth authentication with Prisma adapter Upstash Redis Rate limiting and caching Resend + React Email Transactional emails with dark-themed HTML templates Zod 4 Runtime schema validation for forms and API inputs Vitest + Playwright Unit, integration, and end-to-end testing Design System Custom glassmorphism component library — translucent glass-effect cards, contextual badges, interactive buttons with loading states, modals, tabs, and bento grid layouts. Dark-first design with carefully tuned opacity layers, subtle borders, and a multi-accent color system. Terminal-inspired aesthetic with monospace typography throughout. Component highlights: Translucent glass-effect cards with layered backdrop blur Contextual badges and interactive buttons with loading states Modals, tabs, and bento grid layouts Terminal-inspired aesthetic with monospace typography Dark-first with carefully tuned opacity layers and subtle borders
