Przejdź do treści
Mateusz Cieplak

Frontend Developer · React · Next.js · TypeScript

Buduję produkty webowe od początku do końca, od pliku w Figmie do produkcji.

W agencji Profitway prowadzę projekty klientów od pierwszego commita do wdrożenia: interfejs, backend CMS-a, integracje, serwery i domeny. Najczęściej Next.js, Shopify i WooCommerce, w pracy wspieranej przez AI, którą współtworzę dla całego zespołu.

komercyjnych projektów
2+ lata
projektów dla klientów i agencji w Profitway
11
polski ojczysty, angielski B2
PL / EN

Polska, praca zdalna

Portret Mateusza Cieplaka

01 · Realizacje

Wybrane realizacje

Projekty dla klientów i narzędzia wewnętrzne, które zbudowałem w agencji Profitway. Każdy prowadzi do opisu z zakresem prac, trudnymi momentami i liczbami.

  1. Co obsługuje panel
    1. Logowanie

      1. Konto Google
      2. Tylko domena firmowa
    2. Dla ludzi

      1. Brandland
      2. Devland
      3. Baza pracowników
      4. Stopki mailowe
      5. Oferty pracy
      6. Sejf
    3. Dla narzędzi AI

      1. MCP brandbooka · 19 narzędzi
      2. MCP dokumentacji IT · 10 narzędzi

    Jedna aplikacja Next.js, wdrożona w Dockerze.

    Narzędzie wewnętrzne · Next.js

    Wewnętrzny system agencji, dla ludzi i dla narzędzi AI

    Panel dla całego zespołu Profitway: materiały marki, codzienne narzędzia i dwa serwery MCP, które dają asystentom AI, takim jak Claude i Cursor, bezpośredni dostęp do brandbooka i dokumentacji technicznej firmy. Logowanie przez Google, tylko dla kont firmowych.

    modułów
    6
    narzędzi w 2 serwerach MCP
    29
    testów automatycznych w CI
    167
    interfejs, instalowany jak aplikacja
    PL / EN
    • Next.js 16
    • React 19
    • TypeScript
    • Tailwind CSS 4
    • Auth.js
    • next-intl
    • MCP
    • Vitest
    • Docker
  2. Co dzieje się z rezerwacją
    1. Kampania

      1. Link albo kod QR
      2. UTM zachowany w sesji
    2. Lejek

      1. Miasto
      2. Marka
      3. Auto
      4. Trasa
      5. Formularz
    3. Dostarczenie

      1. Zapis leada
      2. Mail do salonu
      3. Lead w CRM
      4. Potwierdzenie dla klienta

    Panel pokazuje status każdej wysyłki i pozwala ją ponowić.

    Generowanie leadów · Motoryzacja

    Lejek rezerwacji jazd testowych i panel kampanii dla grupy dealerskiej

    Pięciostopniowy lejek rezerwacji (miasto, marka, auto, trasa, formularz) dla grupy dealerskiej sprzedającej Audi, Volkswagena, Porsche i sześć innych marek oraz panel, w którym zespoły agencji i klienta tworzą linki kampanii z kodami QR i śledzą każdy lead aż do salonu i CRM-a.

    ładowanie listy aut
    14,7 s → 8 ms
    ścieżek kampanii sprawdzonych na produkcji
    204 / 204
    aut synchronizowanych co noc
    2800+
    blokujących błędów dostępności, dziś na 31 ekranach
    6 → 0
    • Next.js
    • React 19
    • TypeScript
    • SQLite
    • Docker
    • EasyPanel
    • REST API
    • CRM
  3. Love and Hate: strona główna na ekranie komputera
    Love and Hate na telefonie

    Shopify · Moda

    Sklep na nowym motywie, przebudowane karty produktu, szybszy na telefonach

    Love and Hate sprzedaje bieliznę szytą w Polsce. Przeniosłem sklep ze starego motywu Prestige 4 na Prestige 11 w Online Store 2.0, przebudowałem karty produktu, dodałem to, czego wymagają unijne przepisy o odstąpieniu od umowy, a potem zmierzyłem i usunąłem to, co spowalniało telefony.

    PageSpeed mobile, średnio
    57 → 71
    czasu przeliczania stylów
    −85%
    waga strony kolekcji
    700 → 502 KB
    tekstów w pamięci tłumaczeń EN
    3800+
    • Shopify
    • Liquid
    • Prestige 11 (OS 2.0)
    • Metaobjects
    • Customer Privacy API
    • Judge.me
    • Python
  4. Hadat Cosmetics: strona główna na ekranie komputera
    Hadat Cosmetics na telefonie

    Shopify · Kosmetyki

    Sklep Shopify w pięciu językach, z projektu w Figmie

    Hadat Cosmetics sprzedaje kosmetyki do włosów, ciała i dłoni po angielsku, łotewsku, niemiecku, francusku i włosku. Nowy sklep na Shopify zastąpił starą stronę na WooCommerce. Napisałem motyw z pliku projektantki w Figmie, w dwuosobowym zespole, w którym kolega prowadził proces tłumaczeń i analitykę.

    języków: EN, LV, DE, FR, IT
    5
    tekstów pokrytych w ponownym audycie LV
    99%
    podstron przeszukanych moim narzędziem
    70
    opinii przeniesionych ze starego sklepu
    26 / 26
    • Shopify
    • Liquid
    • JavaScript
    • Shopify Flow
    • Customer Privacy API
    • Judge.me
  5. Manuarte: strona główna na ekranie komputera
    Manuarte na telefonie

    WordPress + WooCommerce · Gastronomia i wydarzenia

    Strona restauracji, show i sali eventowej ze sprzedażą biletów, zbudowana od nowa

    Manuarte to restauracja i miejsce wydarzeń w Łodzi z programem Dinner & Show. Projekt zaczął się jako odświeżenie, a skończył jako pełna przebudowa: własny motyw WordPress, sprzedaż biletów na każde show w WooCommerce i własna wtyczka do zgód, analityki i przekierowań.

    wagi filmu w nagłówku, do
    −73%
    mniej na każdej stronie
    ~1,6 MB
    przekierowań w jednym kroku 301
    161 / 161
    zepsutych linków w audycie
    0
    • WordPress
    • WooCommerce
    • PHP
    • ACF
    • Custom plugin
    • Consent Mode v2
    • GTM
    • GA4

02 · Projekt po godzinach

Co buduję po pracy

Tu ćwiczę backendową połowę full-stack JavaScriptu.

Projekt po godzinach · 2026

Mafia IRL

Mobilna aplikacja webowa do gry w Mafię przy prawdziwym stole. Gracze dołączają do pokoju z telefonów, prowadzący kieruje fazami nocy i dnia, a każda rola, akcja nocna i głosowanie synchronizują się w czasie rzeczywistym.

  • Silnik gry po stronie serwera na Express i Socket.IO: przebieg faz, rozstrzyganie nocy, głosowanie w dzień, warunki zwycięstwa i ponowne połączenia
  • Osobny widok prowadzącego z bieżącym podglądem tego, co dzieje się w nocy
  • Opcjonalne liczniki czasu faz ustawiane w lobby i boty do testowania rozgrywki
  • Testy Vitest dla każdej fazy oraz test integracyjny całej partii
  • Aplikacja webowa i serwer w Dockerze, z uruchomieniem w sieci lokalnej jedną komendą do testów na prawdziwych telefonach
  • Next.js
  • React
  • Tailwind CSS
  • Node.js
  • Express
  • Socket.IO
  • PocketBase
  • Vitest
  • Docker

Kod źródłowy na GitHubie(otwiera się w nowej karcie)

Pętla gry, prowadzona przez serwer
  1. Lobby

    1. Gracze dołączają
    2. Rozdanie ról
  2. Noc

    1. Detektyw sprawdza
    2. Lekarz chroni
    3. Mafia wybiera
    4. Rozstrzygnięcie nocy
  3. Dzień

    1. Dyskusja
    2. Głosowanie
    3. Rozstrzygnięcie dnia

Noc i dzień powtarzają się, aż wygra miasto albo mafia.

Wcześniejsze projekty

03 · Sposób pracy

Jak pracuję

Standardy, które wnoszę do każdego projektu, niezależnie od technologii.

  1. Wydajność

    Bez przesunięć układu, obrazy WebP, leniwe ładowanie i świadomie dobrany sposób renderowania, sprawdzane od 320 do 1920 px przy każdym wdrożeniu.

  2. Dostępność

    Semantyczny HTML, obsługa klawiatury i testy WCAG jako część pracy, a nie poprawki na koniec.

  3. Git wszędzie

    Każdy projekt w Gicie, także WordPress i Shopify: gałęzie, pull requesty, konwencja commitów i wdrożenia przez webhooki.

  4. Infrastruktura

    Domeny, rekordy DNS, SSL, zmienne środowiskowe, Docker i EasyPanel. Konfiguruję to, co wdrażam.

  5. Praca wspierana przez AI

    Claude Code i Cursor na co dzień oraz własne serwery MCP, które dają całemu zespołowi kontekst projektu w narzędziach AI.

  6. Mierzalne wyniki

    Liczby przed i po dla wagi, szybkości i dostępności, żeby zmiana była faktem, a nie wrażeniem.

04 · O mnie

Od geologii do frontendu

Zanim zająłem się frontendem, studiowałem hydrogeologię i geologię inżynierską na AGH w Krakowie. Analityczne podejście zostało: lubię mierzyć przed i po, dlatego większość moich realizacji ma liczby.

Do programowania przeszedłem przez kurs frontendu w Mate Academy i staż w CoderBros, a od 2025 roku buduję dla klientów w Profitway. Teraz rozwijam się w stronę full-stack JavaScriptu, a Mafia IRL to miejsce, w którym ćwiczę backend.

Obejrzyj krótką autoprezentację wideo(otwiera się w nowej karcie)

  1. 2025 - obecnie

    Frontend Developer

    Profitway

  2. 2024 - 2025

    Frontend Developer, staż

    CoderBros

  3. 2024 - 2025

    Kurs frontendu, ponad 700 godzin

    Mate Academy

  4. 2016 - 2021

    Magister, hydrogeologia i geologia inżynierska

    AGH w Krakowie

Narzędzia

Frontend
React, Next.js, TypeScript, JavaScript, HTML, CSS
Stylowanie
Tailwind CSS, SCSS, RWD, praca z projektami w Figmie
Backend
Node.js, Express, route handlery Next.js, Socket.IO, Auth.js, Zod, PocketBase, SQLite
E-commerce i CMS
Shopify (Liquid, Markets), WooCommerce, WordPress z ACF i własnymi wtyczkami
Jakość
Core Web Vitals, WCAG, schema.org, SEO techniczne, Vitest
Infra i narzędzia
Git, Docker, EasyPanel, Vercel, Cloudflare, DNS i SSL, n8n, GTM i GA4
AI
Claude Code, Cursor, własne serwery MCP
Języki
polski (ojczysty), angielski (B2)

Kontakt

Porozmawiajmy.

Szukasz frontend developera, który doprowadzi projekt aż do produkcji? Skorzystaj z formularza albo napisz bezpośrednio.

kontakt@mateuszcieplak.com

Dane służą wyłącznie do odpowiedzi. Formularz obsługuje Web3Forms.

Skontaktuj się