Design System Creation To prepare for the redesign of the application, I
started by creating a component library. To visualize and test these components
easily, I chose to work with Storybook, which allowed me to build each component
in an isolated environment before integrating them into the application. Since
the project includes many interface elements, I organized the library following
the Atomic Design methodology, dividing components into atoms,
molecules, and organisms.
Admin Interface Development I built a scalable admin interface hosted on a
separate subdomain to streamline the management of users, articles, taxonomies
with hierarchical structures, and content collections. This administration panel
also provides full analytics and performance monitoring through a complete and
intuitive dashboard.
Integration of the Tiptap Editor for Article Writing
I integrated Tiptap, a modern and highly customizable text editor, to simplify article creation and formatting.
With its intuitive UI, Tiptap makes it easy to insert rich text, images, links, and code blocks.
The goal was to provide authors with a simple yet powerful tool to produce high-quality content, while ensuring better consistency and flexibility in article management.
Technical Architecture & Deployment The project is structured as a full-stack
monorepo managed with pnpm workspaces, grouping the backend, the CMS, and the design system within a single development environment. This structure improves collaboration, code reuse, and consistency across all applications. Deployment is fully automated with Ansible, which handles server configuration, application deployment through Docker, and provisioning of services such as PostgreSQL and Nginx. This ensures a fast, reliable, and fully reproducible setup across all environments.