Work Gallery

Projects.

Focusing on product readiness and technical excellence across cross-platform mobile and web ecosystems.

DİLAN CONSULTING

Next.js 16Tailwind v4Framer MotionMagic UI

Challenge

Creating a modern, highly aesthetic, and high-performance web platform for a professional consulting center offering sports psychology, individual counseling, and educational coaching, with a strong focus on building trust, premium visual elegance, and seamless appointment scheduling.

Learnings

→Hands-on experience with Next.js 16 App Router and Turbopack compiler behaviors

→Advanced style management practices using newly released Tailwind CSS v4 variables

→Architectural design focused on separating static site data from UI components

→Performance optimization for animation-heavy landing pages

The Solution

Developed a premium Next.js 16 application leveraging micro-animations, a carefully curated warm color palette, and fully responsive layouts. Integrated a centralized data architecture (site-content.js) that completely abstracts all website content, enabling the client to update pricing packages, copy, and testimonials without editing any codebase.

Key Features

Premium responsive layouts designed with HSL color variables
Smooth transition and scroll animations using Framer Motion and Magic UI
Dynamic statistics panel featuring automatic number counters
Interactive micro-animations (cards, dynamic hero section, floating buttons)
Decoupled data layer abstracted from the UI for effortless content updates

Architectural Insight

A modular, Tailwind v4-based Next.js 16 application. It implements an independent content configuration layer (siteContent) that separates text values from JSX templates, establishing a solid foundation for future Headless CMS integration.

COUNTSIP

Beta Testing

Flutter 3.xDart 3.xRiverpod 3FirebaseAdMobGoogle Mapsfl_charts

Try on TestFlight

Challenge

Developing a non-clinical, social-first drink tracking app that occupies the gap between medical tools and reckless games. Challenges included real-time fuzzy search optimization, complex BAC estimation using the Watson Formula, and ensuring strict App Store compliance for alcohol-related social content.

Learnings

→Advanced state management with Riverpod 3

→Optimizing complex UI with 150ms search debounce

→Implementing biometrics-aware medical formulas

→Relational data architecture in Firestore NoSQL

→iOS App Store compliance & App Check security

The Solution

Architected a high-performance Flutter application leveraging Riverpod for state management and Firebase as a unified BaaS. Implemented a custom Alcohol Point System (APS) to gamify the experience, fuzzy search with Levenshtein similarity for discoverability, and a robust social graph.

Key Features

Smart Fuzzy Search (Levenshtein similarity)
Watson Formula BAC Estimation algorithm
Gamified APS (Alcohol Point System) scoring
Social Feed with 'Şerefe' (Cheers) reactions
Memory Archive with photo & venue tagging
12+ Achievement Badges (Milestone system)
Cross-platform Sync with Firebase serverless
Privacy-first social graph & blocking controls

Engineering Blueprints

Technical Schematics

Architectural Insight

Enterprise-grade Flutter architecture using Riverpod for reactive state management. Dedicated layers for data repositories (Firebase), business logic, and UI. Integrated Google Maps for venue tagging and fl_charts for personalized health analytics.

AI RERESUME

React Router 7PuterClaude AI

Live Site Source Code

Challenge

Building a full-stack application without traditional backend infrastructure

Learnings

→React Router 7's full-stack capabilities and server-side rendering

→Puter platform for backend-as-a-service

→Client-side PDF generation with jsPDF

→State management with Zustand for complex workflows

→AI integration patterns and prompt engineering

The Solution

Leveraged Puter platform for file management, KV storage, and AI integration, allowing rapid development without server setup

Key Features

PDF CV upload and parsing
AI-powered feedback analysis using Claude
ATS compatibility scoring
Category-based evaluation system
PDF report generation client-side

Architectural Insight

Client-side heavy architecture with Puter handling file storage and AI API calls. Zustand manages application state, while React Router 7 handles routing and data loading.

CRUMBLE WEBSITE

ReactTypeScriptVite

Live Site Source Code

Challenge

Creating a modern, responsive website for a local business with multiple content sections and achieving top search rankings

Learnings

→Vite's build optimization and HMR

→TypeScript in production React apps

→Tailwind CSS utility-first approach

→SEO best practices and implementation

→Structured data (Schema.org) markup

→Local SEO techniques for business visibility

The Solution

Built a performant React SPA with Vite for fast development and optimized builds. Implemented comprehensive SEO strategy including meta tags, structured data, keyword optimization, and performance tuning.

Key Features

Responsive design across all devices
Menu categorization and display
Campaign sections with dynamic content
Instagram integration
Location and contact information
SEO optimization with structured data
Performance optimization (95+ Lighthouse score)

Architectural Insight

Single Page Application with component-based architecture. Vite handles bundling and optimization, while React manages component state and rendering.

NOVA ESKRIM WEBSITE

ReactVite

Live Site Source Code

Challenge

Building an information-rich website for a sports club with dynamic content and scheduling

Learnings

→Component reusability and composition

→Data structure design for content management

→Responsive layout strategies

→Performance considerations for content-heavy sites

The Solution

Developed a modular React application with reusable components for different content types. Focused on clean data structure and easy content management

Key Features

Club information and history
Training schedule management
Achievement showcase
Fencing rules and regulations
Live match tracking integration

Architectural Insight

Modular React application with component-based content sections. Designed for easy content updates and future feature expansion.

Contact.

Send Email