Next.js Architecture
- Designed app router structure with mix of server and client components for optimal performance
- Implemented dynamic routes with proper loading states and metadata handling
POE2 Tools
Next.js toolkit for Path of Exile 2 featuring skill tree visualization, build planning, and DPS calculations. Uses Supabase for auth/data and integrates with POE API for character syncing.
Next.js application providing essential tools for Path of Exile 2 players. Features skill tree planning with node visualization, build management with POE account integration, and detailed DPS calculations.
Build Key Features
- 01
Skill Tree Visualization
Interactive skill tree with node filtering, regex search, and ascendancy selection. Uses custom Python scanner for node detection and includes undo/redo for allocation history. Features detailed stat tracking and node highlighting options.
- 02
DPS Calculator
Dual weapon damage calculator supporting physical, elemental and chaos damage types. Includes global modifiers, real-time updates, and calculation history tracking. Visualizes damage type distribution for build analysis.
- 03
Build Management
Build planning system with template support and build sharing. Integrates with POE accounts for character data syncing. Uses server-side rendering for optimal performance and includes public/private visibility options.
- 04
Authentication System
Supabase authentication with email verification and password reset. Includes POE OAuth for account linking and protected routes. Features seamless session management and auth state syncing.
Friction Challenges
- 1
Tree Data Structure
Building an efficient skill tree system that handles node relationships, path finding, and stat calculations while maintaining smooth performance with large datasets. Required careful optimization of node operations and state management.
- 2
Damage Calculations
Creating a flexible DPS system handling multiple damage types and weapon configurations. Solved through modular calculation engine and efficient state updates for real-time number crunching.
- 3
State Management
Coordinating complex state across skill tree allocation, build configurations, and live calculations. Implemented robust state management patterns while ensuring consistent data flow between components.
Takeaways Learnings
Authentication Patterns
- Built secure auth flows with Supabase including email verification and session management
- Integrated POE OAuth with proper token refresh and error handling
Performance Optimization
- Developed efficient rendering strategies for large skill tree visualization
- Implemented optimized calculation engine for real-time DPS updates