Refactor lub przepisanie front-u za pomocą AI

Chciałbym przepisać część aplikacji napisanej w AI (w fatalny sposób) tak żeby używała gotowych komponentów UI (np. Shadcn / MaterialUI) zachowując wygląd tej aplikacji. Sam layout stron też powinien zostać przepisany - w skrócie chciałbym jak najbardziej odzworować obecny wygląd używając gdzie się da gotowych komponentów UI.

Czy miał ktoś podobną sytuację i udało mu się przyspieszyć takie przepisanie za pomocą AI? jak bardzo jest to realistyczne i jak bardzo może skrócić pracę? Zależy mi żeby to zrobić w taki sposób, żeby było to możliwe do dalszego rozwijania przez developerów.

Chciałbym poprawić projekt który zastałem w słabym stanie. Zrobiłem już sobie szkielet od nowa, ręcznie (podstawowy layout, walidacja formularzy, requesty do API, walidacja danych z API, tłumaczcenia). Widzę, że najwięcej roboty będzie z przepisywaniem stylowania i stricte UI-owej logiki i tu myślę sobie jakoś pomóc.

Pytanie, czy da się to sensownie zrobić, jak bardzo można sobie dzięki temu skrócić pracę i jakiego modelu najlepiej użyć?

hobbistycznie czy w pracy? masz kupionego agenta przez pracodawcę? takie agenty dobry kod pisza jak mają dobrze wymagania tylko trzeba promtować małymi kawałkami. jak powiesz : przepisz to spali wszystkie tokeny z limitu i tyle. pytasz się jak produkt owner mikrozarządzający, co trzeba zrobic przede wszystkim, użyj biblioteki X, tu w pliku masz standardy kodowania, a w agent.md dobre praktyki z https://github.com/dietrichgebert/ponytail i rób pierwszy krok

Przynajniej tak to wyglada u mnie

KamilAdam napisał(a):

hobbistycznie czy w pracy? masz kupionego agenta przez pracodawcę? takie agenty dobry kod pisza jak mają dobrze wymagania tylko trzeba promtować małymi kawałkami. jak powiesz : przepisz to spali wszystkie tokeny z limitu i tyle. pytasz się jak produkt owner mikrozarządzający, co trzeba zrobic przede wszystkim, użyj biblioteki X, tu w pliku masz standardy kodowania, a w agent.md dobre praktyki z https://github.com/dietrichgebert/ponytail i rób pierwszy krok

Przynajniej tak to wyglada u mnie

Do pracy.

Brak kupionego agenta, chciałem to przetestować najpierw samemu. Dało by się to jakoś na budżecie spróbować zrobić? Kupić trochę tokenów testowo do ClaudeCode-a uruchomić projekt i powiedzieć:

Przepisz komponent "FormSelect.tsx tak żeby używał komponentu z biblioteki 'X'. Zachowaj odpowiednie stylowanie" - i potem go ewentualnie naprowadzać delikatnie jeśli pominie jakąś customową logikę albo będzie miał z nią problem? Najbardziej mi na tym stylowaniu w sumie zależy żeby je przeniósł, czyli stylowanie CSSowe (czy tam z CSS modules) przeniósł na ShadCN-a / MaterialUI-a - mowa tu o pojedynczych komponentach ale też layout-ach strony, żeby tego nie trzeba odtwarzać.

AI na froncie jest turbo słabe - nie ogarnia tego, jaki jest stan i robi po prostu glupoty.

O ile skrypt SQL napisze i kod po stronie serwera jako tako to w przeglądarce nie ogarnia zupełnie.

Może macie inne doświadczenia...

Jak masz skonfigurowane skille, AGENTS.md, MCP serwery, pluginy, agenta i umiesz pisać prompty, to całkiem dobrze sobie radzi.

Za to kolega, któremu od roku nie chce się skonfigurować agenta, to produkuje takie g**no, że więcej tam boilerplatu niż faktycznego kodu. Różnica pomiędzy gołym agentem jest kolosalna. Idealnie mi to obrazuje scenariusz kiedy ktoś pisze głównie w innym języku, a w kolejnym z doskoku i to jeszcze z pomocą AI, którego kodu nie jest w stanie zweryfikować. Za parę lat na kolanach do nas przyjdą korposy XD

Ja używam OpenChamber (OpenCode), MCP: Figma, context7, seo-audit, chrome-webtools, webstorm-index. Pluginy: opencode-type-inject - daje dostęp do language serwera typescripta, więc agent ma więcej informacji o typach. supermemory - persistance memory/context ze wszystkich sesji, można dodatkowo wrzucać dokumenty, dokumentację. No i skille różne, które mogą się przydać. Niestety tylko licencje na GPT mamy. Model GPT 5.6 Terra, bo Sol za szybko limity zjada. Lepiej wziąć ciut gorszy model i ustawić wyższy reasoning, niż najlepszy i błyskawiczną odpowiedź.

I jeszcze ja już dawno zacząłem bardziej się tym bawić, niż kopiować kod z czata, jak jeszcze nie było Codexa na linuxa. Ostatnio wyszedł dopiero, więc nie wiem jak się sprawuje.

I to nie zagłębiałem się jakoś bardzo. Teraz ciężko odfiltrować co ma faktycznie jakąś wartość, bo teraz codziennie pojawiają się nowi agenci, tak jak kiedyś frameworki frontendowe. Coraz więcej hinduskiego slopu obiecującego różne trudne słowa mającego odmienić twój żywot.

Też ostatnio myślałem nad przepisaniem czegoś i pomyślałem, żeby właśnie wykorzystać memory layer (supermemeory, Mem0, cognee) i żeby agent przeanalizował dokładnie stary projekt, rozpisał diagramy zależności, przeprowadził event storming sam ze sobą, wypisał fragmenty budzące wątpliwości, ogólnie dokumentację zrobił i potem z taką wiedzą można zaczynać.

Jeszcze jak chcesz wypróbować różne modele, to na Openrouter masz dostępne wszystko co jest. Doładowujesz tyle ile chcesz, a w każdym modelu masz wypisane ceny od różnych providerów. Tylko dla modeli OpenAI i Anthropica jest to w ogóle nieopłacalne, bo ceny są kosmiczne. Jak Claude Sonnet albo GPT są po 10 - 15 dolarów za milion tokenów, to jeden prompt może zjeść kilka dolarów. Do tańszych modeli spoko.

1programmer napisał(a):

... żeby właśnie wykorzystać memory layer (supermemeory, Mem0, cognee) i żeby agent przeanalizował dokładnie stary projekt, rozpisał diagramy zależności, przeprowadził event storming sam ze sobą, wypisał fragmenty budzące wątpliwości, ogólnie dokumentację zrobił i potem z taką wiedzą można zaczynać.

Z ciekawosci zrobilem to o czym piszesz i przyznam szczerze, ze wyglada to calkiem przyzwoicie.

To jest ciekawe, bo jakby tak się zastanowić nad automatyzacją tworzenia kodu, to najtrudniejszą rzeczą jest implementacja rozumowania i generowania kodu. Reszta automatyzacji wydaje się przy tym dość trywialna. Przynajmniej częściowo to pierwsze jest zapewnione przez LLM-y. Jednocześnie nikt nie myśli (łącznie z LLM-em), by zautomatyzować ten proces i ludzie tracą czas na pałowanie się z konfiguracją. Czyli co tu jest słabym punktem? LLM czy vibe coder?

Do przepisywania trzeba po prostu testów. Jak testów nie ma (a wiemy jak jest w tym przypadku xd) to niech AI je napisze. Potem możesz odpalić agenta w pętli i niech robi swoje

Oczywiście takie rozwiązanie kosztuje dużo tokenów

Jeśli chodzi o zrozumienie zvibowanego kodu to IMO nie ma nic lepszego niż testy na najwyższym poziomie tj. testujemy API ze wszystkimi zależnościami na backendzie albo jakiś playwright na froncie.

Jeszcze lepszą opcją jest danie AI obi implementacje na raz (czyli zwykła regresja) tylko szczerze mówiąc nie wiem jak to działa dla testów widoku. Na backendzie jest to bardzo proste