Multilingual cultural platform built with Next.js 16 and Strapi CMS. Features dynamic content management, internationalization with next-intl, Markdown rendering, and SEO optimization .
Next.js
Shadcn
Tailwindcss
Strapi
SKC Vukovar is a modern digital platform developed for the Student Cultural Center in Vukovar. The website was built using Next.js 16 (App Router) with a Strapi headless CMS backend, enabling flexible content management for editors while maintaining a fast and SEO-optimized frontend.
The platform allows administrators to easily publish news, events, and publications while providing visitors with a responsive and accessible browsing experience.
⸻
Technical Architecture
Frontend • Next.js 16 (App Router) • React 19 • TypeScript • TailwindCSS • Radix UI components • Framer Motion animations • next-intl (internationalization) • react-markdown + remark-gfm • sharp (image optimization)
Backend • Strapi Headless CMS • REST API content delivery • Media library management
⸻
Key Features
Headless CMS Architecture
Strapi is used as the central content management system, allowing editors to manage: • News and announcements • Cultural events • Publications and documents • Media assets and images
The Next.js frontend dynamically fetches and renders this content while maintaining optimal performance and SEO.
⸻
Internationalization
The platform includes a full multi-language implementation using next-intl, enabling: • Locale-based routing • Translated UI content • Localized metadata for SEO • Flexible language switching
This ensures accessibility for both local and international audiences.
⸻
Markdown Content Rendering
Content from the CMS is rendered using react-markdown with GitHub Flavored Markdown (GFM) support, enabling editors to easily structure rich content including: • Tables • Lists • Links • Formatted text
This allows flexible content editing without requiring developer involvement.
⸻
Modern UI System
The interface is built using TailwindCSS and Radix UI components to ensure accessibility and consistency across the application.
Interactive elements and micro-interactions were implemented with Framer Motion, providing a modern and engaging user experience while maintaining high performance.
⸻
SEO Optimization
SEO improvements include: • Automatic sitemap generation using next-sitemap • Server-side rendering for better indexing • Dynamic metadata generation • Optimized images using Sharp
⸻
Deployment
The application is prepared for production deployment with optimized builds and stable integration between the Next.js frontend and the Strapi backend.
⸻
Result
The final platform provides: • A flexible CMS for content editors • A modern and responsive user interface • Scalable architecture for future expansion • Strong SEO performance and optimized loading speeds
