InkScape Innovators.
A full-stack platform I independently developed for a €60,000 Erasmus+ KA210-VET project, combining multilingual comic publishing, an advanced reading experience, content management, role-based administration, and engagement analytics in one system.
Completed · Erasmus+ KA210-VET
- 01 · Role
- Sole Full-stack Developer · UI/UX · Database & cloud architecture
- 02 · Platform
- Responsive Web
- 03 · Period
- Erasmus+ KA210-VET · Completed
- 04 · Status
- Completed · Erasmus+ KA210-VET
Project context
InkScape Innovators was developed for a €60,000 Erasmus+ KA210-VET project bringing vocational education students from Türkiye, Greece, and Portugal together around sustainability, green skills, digital storytelling, and AI-assisted creative production. The platform combines a multilingual institutional landing page presenting the project and its partners, a digital library for student-created comics, detailed comic pages, an advanced reading experience, and a complete content-management environment. I independently handled the entire software-development process, including product design, frontend and backend architecture, database modeling, authentication, AWS S3 media management, analytics, and the administration panel.
Core challenge
The main challenge was to build much more than a conventional content website: the product had to deliver a modern comic-reading experience for end users while also providing a powerful CMS that project administrators could operate without technical knowledge. Comic content had to be managed through a chapter-and-page hierarchy, large media assets required secure storage, the application needed multilingual and role-based behavior, anonymous engagement had to be tracked without requiring user accounts, and the reader had to support very different desktop and mobile reading preferences within the same application.
What I built
- 01
Developed the public website, comic platform, reader, and administration panel end to end with Next.js, React, TypeScript, and Tailwind CSS.
- 02
Built locale-aware routing and translation infrastructure with next-intl for English, Turkish, Greek, and Portuguese across the landing page, public product experience, and administration interface.
- 03
Designed the relational data model for Comic, Chapter, ChapterPage, Category, User, ReadLog, LikeLog, and Message entities with Prisma on PostgreSQL.
- 04
Implemented authentication and authorization with Supabase Auth using ADMIN and SUPER_ADMIN roles, protecting administration routes through middleware and server-side permission checks.
- 05
Built a two-step comic CMS for managing general metadata, categories, cover media, chapters, and individual comic pages from a single workflow.
- 06
Implemented drag-and-drop ordering for chapters and comic pages, list/grid management views, and cleanup of media assets removed during editing or deletion.
- 07
Integrated AWS S3 with short-lived presigned upload URLs so cover images, chapter pages, and avatars can be uploaded securely without exposing cloud credentials to the client.
- 08
Built an advanced comic reader supporting single, double, and triple-page layouts; vertical and horizontal reading; click and scroll navigation; LTR and RTL direction; zoom; fullscreen; light, dark, and sepia themes; grayscale, brightness, page spacing, and auto-scroll controls.
- 09
Implemented Continue Reading behavior that stores detailed page progress on the client while maintaining chapter-level progress on the server through an anonymous hashed visitor fingerprint.
- 10
Built a toggle-based anonymous like system using the same visitor fingerprint so readers can preserve like state without creating an account while aggregate like counts remain available.
- 11
Developed search across title, description, author, and category data, together with a recommendation flow that prioritizes shared categories and falls back to content from the same country.
- 12
Implemented Featured, Popular, and Newest discovery flows, including popularity ranking based on reading activity and category-driven browsing.
- 13
Built an administration analytics dashboard covering total reads and likes, published and draft comics, daily engagement trends, device distribution, top comics, reader countries, and recent activity.
- 14
Connected the public contact form to the database and built an inbox-style admin experience for searching, filtering, and managing messages with read/unread state.
- 15
Implemented SUPER_ADMIN user management together with login, logout, profile updates, and password-reset flows.
- 16
Added IP-based rate limiting to authentication and password-reset operations to reduce abuse and excessive request attempts.
Technical approach
The application is built on Next.js App Router, React, TypeScript, and Tailwind CSS. Public pages, comic discovery, and the reader run within the same application, while locale-aware administration routes are separated through ADMIN and SUPER_ADMIN permissions. Authentication is handled by Supabase Auth, while application data is managed through Prisma ORM and PostgreSQL. Comic content follows a Comic → Chapter → ChapterPage hierarchy, with categories connected through many-to-many relations. Large media assets are stored in AWS S3 rather than in the relational database; the backend generates short-lived presigned upload URLs for secure direct uploads. TanStack Query is used for client-side data fetching and mutations alongside server actions. The anonymous engagement layer creates a SHA-256 visitor fingerprint from IP and User-Agent data without storing the raw IP as the session identifier; ReadLog and LikeLog records are keyed by comic and this anonymous session ID. Detailed page progress is stored in localStorage while server-side reading state retains chapter progress. The analytics layer transforms ReadLog and LikeLog activity into engagement totals, daily trends, device breakdowns, geographic reach, top-content rankings, and recent-activity views.
System structure
- 01
Frontend
Next.js · React · TypeScript · Tailwind CSS - 02
Data
Prisma · PostgreSQL · Supabase - 03
Authentication
Supabase Auth · ADMIN / SUPER_ADMIN - 04
Media
AWS S3 · Presigned Upload URLs - 05
State & Fetching
TanStack Query · Server Actions - 06
Internationalization
next-intl · EN / TR / EL / PT - 07
Engagement
Reading Progress · Likes · Anonymous Fingerprint - 08
Analytics
Reads · Likes · Devices · Countries · Activity
Current state
The platform was completed as the digital publishing and content-management infrastructure for the Erasmus+ KA210-VET project and is accessible through a live demo. The public experience includes project presentation, a comic library, featured/popular/newest collections, categories, search, comic detail pages, recommendations, and the advanced reader. The administration side manages comics, chapters, pages, categories, users, contact messages, and engagement analytics from a unified dashboard. The application supports four languages, with Supabase Auth for identity, Prisma/PostgreSQL for relational data, and AWS S3 for media storage.