Loading...

01/04

Site

Sadovnikov

Sadovnikov is a personal portfolio website. Its main purpose is to allow you to showcase your experience, stack, and projects to a potential employer. Also, Sadovnikov has become a large educational project in which I studied the modern architecture of full‑stack applications.

STACK

NextJS

SASS

React

TypeScript

Caddy

Redux Toolkit

KEY FEATURES

Administrative panel

A proprietary CMS for managing projects, descriptions, technologies, metrics, key features, and other content without directly editing the code.

Content editor

A rich-text editor with visual and HTML modes, supporting formatting, links, images, and inline styles.

Localization

Russian and English versions of the interface and content, with independent translation editing for each project.

Self‑hosted analytics

Umami integration for in‑house analytics of visits and user behavior without advertising trackers.

Media and files

Uploading and managing images directly from the admin panel, with file storage on your own server.

Full‑stack infrastructure. CI/CD

Next.js, PostgreSQL, Prisma, and Docker Compose work as a single system, while Caddy provides HTTPS and routing for production traffic. CI/CD

01 / 06

DESCRIPTION

CHALLENGES & SOLUTIONS

The main challenge was that Sadovnikov gradually stopped being just a website. It became a system with multiple content types, media, localization, an admin UI and its own production environment.

1
Content & localization

Every project has RU/EN content, while the admin panel still needs to remain manageable as the amount of structured data grows.

2
Media

Images can be uploaded from the admin panel, stored on the server and served as independent assets across project pages.

3
Content editor

While publishing JustBuy, I became a real user of my own CMS and realized that a plain textarea was not enough. That led to a rich-text editor with Visual and HTML modes.

4
Production

Docker Compose, PostgreSQL, Prisma, Caddy and self-hosted Umami are connected into one production setup running on my own VPS.


While improving the admin panel, I used an AI coding agent for the first time not only for suggestions, but also for direct implementation work.

Rich-text editor

I defined the requirements, UX and boundaries of the feature. The AI agent was used to accelerate implementation by modifying the codebase directly, while I reviewed the result, tested the integration and studied the resulting implementation.

I consider this part of the project AI-assisted development rather than code written entirely by hand.

METRICS

Performance

Speed and perormance

90/100

Load time

Average loading time

1.4 s

SEO

Search engine optimization

100/100

Accessibility

Lighehouse, A11y

93/100

EVOLUTION

Explore the project timeline

0111

February 2026

Initial Commit

The first commit initializes the repository with basic files and structure.

February 2026

Basic Sections Implementation

Implemented sections like Header, Preview, Skill, and Stack.

February 2026

User Interface Enhancements

Added interactive elements such as hover effects and language switching buttons.

April 2026

Responsive Design Improvements

Adapted various sections for different screen sizes including mobile, tablet, and desktop.

April 2026

Next.js Migration

Successfully migrated the application to Next.js framework.

April 2026

Animations Integration

Integrated custom hooks and components for smooth animations across the site.

April 2026

Performance Optimizations

Optimized images, implemented dynamic imports, and improved overall performance.

June 2026

Backend Development Start

Started backend development using database models and queries.

July 2026

Authentication System

Implemented user authentication and protected sensitive actions.

July 2026

Final Polish and Bug Fixes

Fixed remaining bugs, optimized code, and prepared for deployment.

August 2026

Unit Testing Completion

Completed writing comprehensive unit tests covering core functionalities.