Almost futuristic portfolio

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

About Me

I'm a Developer passionate about creating immersive web experiences that blend cutting-edge technology with beautiful design.
My goal is to continuously improve as an engineer while creating solutions that are scalable, maintainable, and easy to use.

Portfolio

Live URL: https://portfolio-23959360757.us-central1.run.app

How I Built It

Tech Stack

Core Technologies:

• React - Component-based UI architecture
• Vite - Lightning-fast build tool with optimized chunking
• Three.js (@react-three/fiber + @react-three/drei) - Immersive 3D graphics
• i18next - Internationalization (PT/EN support)
• GSAP - Animations

Deployment:

• Google Cloud Run - Containerized deployment with Docker
• Cloud Build - CI/CD pipeline
• Nginx - Production-grade web server with optimized MIME types

Design Decisions

1. Cyberpunk Aesthetic - Neon colors, grid backgrounds, HUD elements
2. GPU-Accelerated Animations - All animations use transform and opacity
3. Responsive Design - Mobile-first approach with fluid typography
4. Accessibility - Semantic HTML, ARIA labels, proper heading hierarchy

Development Process

Initial Build:

• Started with basic React + Vite setup
• Implemented Hero section with Three.js 3D scene (Synthwave Grid, Neon Sun)
• Added lazy-loaded sections (About, Skills, Projects, Contact)

Google AI Tools Used

While I didn't directly use Google AI tools for code generation, I leveraged:

• Google Cloud Run - Serverless deployment platform
• Google Cloud Build - Automated build and deployment
• Google Antigravity - Development platform, evolving the IDE into the agent-first era.

The iterative optimization process was data-driven, using PageSpeed's detailed metrics to identify and eliminate performance bottlenecks.

What I'm Most Proud Of

Performance Metrics:

• FCP (First Contentful Paint): ~1.5s (60% faster)
• TBT (Total Blocking Time): Reduced from 15,350ms to minimal
• Forced Reflows: Eliminated 29ms by removing Framer Motion
• Bundle Size: Optimized to 324KB gzipped critical JS Three.js Optimization - frameloop="demand", dpr={[1, 1.5]}, antialias: false, Intersection Observer pausing
• Memoized Components - HUDElement and DecorativeLine wrapped in React.memo()

Busquem conhecimento" — ET Bilu