onlook

O nástroji

Onlook je vizuální editor kódu pro React a Next.js aplikace, díky kterému mohou designéři a produktoví manažeři upravovat živé komponenty přímo v reálném zdrojovém kódu týmu – kód je jediným zdrojem pravdy. AI čte existující codebase včetně design tokenů a Storybooku a provádí úpravy tak, aby vypadaly jako dílo samotného týmu, bez generického boilerplate kódu. Pravým kliknutím lze zobrazit přesné umístění prvku v kódu, přetahováním vkládat a přeuspořádávat prvky a upravovat Tailwind styly přímo v editoru. Nástroj podporuje sdílení plátna, prostorové komentáře a synchronizaci změn do kódu, které je možné odeslat vývojářům ke schválení formou pull requestů. Funguje s Reactem, Next.js a libovolným přístupem ke stylování (Tailwind, CSS modules, styled-components). Onlook je open source a lze jej zdarma self-hostovat. Konkrétní ceny cloudové verze nejsou na webu uvedeny.

Klíčové vlastnosti

• Úpravy živých React komponent přímo ve zdrojovém kódu
• AI čte codebase včetně design tokenů a Storybooku
• Zobrazení umístění prvku v kódu pravým klikem
• Přetahování a přeuspořádávání prvků vizuálně
• Úprava Tailwind stylů přímo v editoru
• Sdílené plátno s prostorovými komentáři a export do pull requestů

Časté dotazy

Kategorie