PROJECT OVERVIEWWEB APPLICATION
Jubilee — a pharmacy chain promo: a widget and an account
A prize draw for the anniversary of a pharmacy chain: customers register receipts, get a guaranteed prize and take part in weekly draws and the main one, a travel certificate. The promo page is made in Tilda; everything else is a Vue app.
- Role
- Frontend developer
- Timeline
- 2026, September — October
The challenge
Embed the Tilda promo page into the app and build receipt registration, winners and an account with sign-in through the chain's account around it — working both as a website of its own and as a widget on someone else's page.
What the solution includes
- Two builds from one codebase: a website and a widget — a custom element in Shadow DOM, embedded with a single script and apart from the styles of the page.
- The Tilda promo page: its export is synced into the repository through the Tilda API, its styles are isolated with @scope, its buttons open dialogs of the app, and the winners table is mounted right into its markup.
- Sign-in through the customer's account of the chain (SSO), with no separate sign-up.
- Receipt registration: a QR code through the camera, a photo or the data typed by hand.
- The account: the receipt history with statuses and tickets to the draws, prizes with promo codes to copy, notifications about checked receipts and wins.
- In the widget, fonts and the SVG sprite work inside Shadow DOM, while dialogs and scroll locking stay within it.
- An API layer on TanStack Query with a request cache, the contract in OpenAPI and API tests without a browser or a backend.
A commercial team project: I built the whole frontend; the promo page is made in Tilda. Screenshots are from a local build with test data; the names and logos of the chain and its partners are hidden.