Official Koru Impact Platform (Frontend)

Overview

This project represents the official "digital front door" for Koru Impact. It is a robust, scalable, and multilingual platform designed to serve corporate clients and verifying bodies (such as Google for Startups). As part of the core development team, I focused on architecting the frontend using the latest Next.js 15 features and establishing a reliable CI/CD pipeline.

My Contributions

Frontend Architecture: Developed reusable, accessible UI components using shadcn/ui and Tailwind CSS, ensuring design consistency across over 40 distinct pages.
CI/CD Implementation: Configured the continuous integration and deployment pipelines to ensure smooth delivery from development to production.
State Management Strategy: Implemented a dual-state architecture separating Server State (TanStack Query) for API data caching and Client State (Zustand) for UI interactions.
Testing: Wrote unit and integration tests using Vitest to maintain code reliability.

Key Technical Features

Framework: Built on Next.js 15 (App Router) with Turbopack for high-performance development and rendering.
Internationalization (i18n): Deep integration with next-intlayer for seamless English/Turkish localization, including middleware-based locale detection.
AI Integration: Incorporated Google Generative AI (Gemini) to power smart features like a chatbot and intelligent text editing.
Rich Interactions: Features a custom rich text editor (Tiptap), data visualization (Recharts), and complex interactive drawers (Vaul).
Strict Typing: Developed entirely in TypeScript to ensure type safety across the extensive codebase.

Tech Stack

Core: Next.js 15, TypeScript, React
Styling: Tailwind CSS, shadcn/ui
State: TanStack Query, Zustand
Tools: Vitest, pnpm, Intlayer

Overview

My Contributions

Frontend Architecture: Developed reusable, accessible UI components using shadcn/ui and Tailwind CSS, ensuring design consistency across over 40 distinct pages.

CI/CD Implementation: Configured the continuous integration and deployment pipelines to ensure smooth delivery from development to production.

State Management Strategy: Implemented a dual-state architecture separating Server State (TanStack Query) for API data caching and Client State (Zustand) for UI interactions.

Testing: Wrote unit and integration tests using Vitest to maintain code reliability.

Key Technical Features

Framework: Built on Next.js 15 (App Router) with Turbopack for high-performance development and rendering.

Internationalization (i18n): Deep integration with next-intlayer for seamless English/Turkish localization, including middleware-based locale detection.

AI Integration: Incorporated Google Generative AI (Gemini) to power smart features like a chatbot and intelligent text editing.

Rich Interactions: Features a custom rich text editor (Tiptap), data visualization (Recharts), and complex interactive drawers (Vaul).

Strict Typing: Developed entirely in TypeScript to ensure type safety across the extensive codebase.