Nikita Petrich
Back to home
PWA Wi-Fi onboarding flow
IoT / consumer electronics
04

AITOI

Interactive IoT toy (MVP)
AITOI
08/2025 – 09/2025 · ~2 months · Frontend engineer
Role
Frontend engineer
Team
3 people · frontend, embedded/hardware, lead
Location
Frankfurt, DE · remote
Language
German & English
Visibility
Internal system
Methodology
Self-directed

Responsibilities

  • Setup app for commissioning new devices: Wi-Fi onboarding by QR code scan with a guided flow, device pairing and robust error handling.
  • PWA dashboard for parents: follow, filter and review their children's play sessions.
  • Later reconfiguration of paired devices through the same platform-independent PWA.
  • Integration of Supabase for authentication, data storage and real-time synchronisation (including row level security).
  • A fast PWA architecture (Next.js) with a responsive UI.
  • CI pipeline (GitHub Actions) on top of containerised builds (Docker): unit tests (Vitest) and the build ran automatically on every change; deployment was done by hand.
  • Definition and implementation of type-safe data models and API interfaces (TypeScript, DTOs, Zod).
  • Close coordination in English with the hardware team to define the device-app communication and the setup protocols.
  • Advising and guiding the client from the initial idea to an actionable MVP concept.

Outcome

  • A fully functional MVP frontend in ~2–3 weeks of actual working time — independently, from concept through client coordination to the demo.
  • Setup app and parent dashboard as one platform-independent PWA, synchronised with the IoT device in real time.
  • A scalable, documented architecture as a solid basis for the product launch.
  • Trusted, cross-functional collaboration with the hardware team throughout the project — no friction at the device-app interface despite the tight schedule.
  • The client's testimonial explicitly names the CI/CD pipelines and unit tests as contributing to the quality, security and reliability of the applications.

Testimonial

Technologies

TypeScriptJavaScriptHTMLCSSSQLJSONYAMLNext.jsReactServer-Side Rendering (SSR)Progressive Web App (PWA)Mobile FirstResponsive DesignDesign SystemComponent librariesUI/UX DesignUsabilityPrototypingReact Hook FormDTOsFrontend developmentBackend developmentWeb developmentDevice PairingSupabaseSupabase RealtimeSupabase Edge FunctionsRow Level SecurityPostgreSQLData modellingTailwind CSSshadcn/uiJWTAuthenticationIT securityDockerLinuxUbuntuVercelCI/CDGitHub ActionsContinuous IntegrationVitestUnit TestingnpmCLI (Command Line Interface)Cursor AIModel Context Protocol (MCP)Agentic CodingMVP developmentClean CodeSOLIDClean ArchitectureDomain-Driven DesignDigital transformationSoftware developmentInterface developmentAPI integrationThird-party system integrationIoTConsumer Electronics