89 lines
2.9 KiB
Markdown
89 lines
2.9 KiB
Markdown
<div align="center">
|
|
|
|
# Evandro Dev — Portfolio
|
|
|
|
**A cinematic, interactive developer portfolio built with Next.js, React, TypeScript, and motion-first UI engineering.**
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
## Overview
|
|
|
|
This is the portfolio site for **Evandro Dev**. It presents professional work, case studies, technical positioning, and interactive visual storytelling through a high-polish Next.js interface.
|
|
|
|
The project combines a modern App Router codebase with motion design, 3D/visual effects, and tested UI components.
|
|
|
|
## Highlights
|
|
|
|
| Area | Details |
|
|
| --- | --- |
|
|
| Framework | Next.js App Router with React and TypeScript. |
|
|
| Motion | GSAP, Framer Motion, Lenis, and custom animation components. |
|
|
| Visuals | Three.js / React Three Fiber / Drei for interactive and cinematic surfaces. |
|
|
| Styling | Tailwind CSS, utility composition, and reusable component primitives. |
|
|
| Quality | Jest, Testing Library, property-based tests, and Biome checks. |
|
|
| Content | Portfolio sections, case pages, company logos, hero composition, and supporting docs. |
|
|
|
|
## Project structure
|
|
|
|
```txt
|
|
app/
|
|
page.tsx Main portfolio route
|
|
layout.tsx Root layout and metadata
|
|
components/ Portfolio sections and cinematic UI modules
|
|
cases/ Case-study routes/content
|
|
api/ Server/API routes
|
|
components/ Shared UI primitives
|
|
lib/ Utilities and shared logic
|
|
docs/ Supporting documentation
|
|
graphify-out/ Project analysis output
|
|
public/ Static assets
|
|
```
|
|
|
|
## Getting started
|
|
|
|
```bash
|
|
pnpm install
|
|
pnpm dev
|
|
```
|
|
|
|
The development server uses Turbopack through the project script.
|
|
|
|
## Scripts
|
|
|
|
| Command | Purpose |
|
|
| --- | --- |
|
|
| `pnpm dev` | Start the Next.js development server. |
|
|
| `pnpm build` | Build the production application. |
|
|
| `pnpm start` | Start the production server after building. |
|
|
| `pnpm lint` | Run Biome checks. |
|
|
| `pnpm format` | Format the codebase with Biome. |
|
|
| `pnpm test` | Run Jest tests. |
|
|
| `pnpm test:watch` | Run Jest in watch mode. |
|
|
|
|
## Engineering standards
|
|
|
|
- Keep visual sections modular and testable.
|
|
- Respect reduced-motion and accessibility expectations for animated sections.
|
|
- Keep portfolio copy and case-study content easy to update without touching low-level animation code.
|
|
- Validate interactive components with tests when changing behavior, layout assumptions, or accessibility states.
|
|
|
|
## Validation
|
|
|
|
Before publishing changes:
|
|
|
|
```bash
|
|
pnpm lint
|
|
pnpm test
|
|
pnpm build
|
|
```
|
|
|
|
## License
|
|
|
|
Personal portfolio project unless a repository license says otherwise.
|