
Dlaczego akurat klon Booksy?
Chcę sprawdzić w miarę realny projekt, który posiada kluczowe funkcje: role użytkowników, rezerwacje, płatności, kalendarz i powiadomienia.
Zobaczymy jak to wyjdzie w praktyce. Większość osób, które używają Vibe Codingu – tworzy proste Landing Page. Zobaczmy czy faktycznie da się zbudować coś działającego i praktycznego ?
Na cele naszego eksperymentu stworzyłem prosty prompt – którego użyjemy do tworzenia aplikacji.
W tym przypadku do generowania użyłem gotowego GPTs’a dostępnego w OpenAI. Polecam przetestować – działa całkiem fajnie. Oczywiście trzeba go ładnie nakierować na to co chcemy zrobić.
UWAGA: Zauważcie, że celowo prosiłem o to aby dodał tabele bazy danych wraz z polami. W naszym teście będziemy łączyli Lovable z Supabase. Bez tego mówienie o prawdziwej aplikacji – to tak jak mówienie o tym, że Fiat 500 to w praktyce Ferrari.
GPT dla OpenAI:

Wygenerowany prompt - użyjemy tego samego w Lovable i Bubble :)
I want to create a booking platform for beauty and wellness services with Supabase backend. It should include:
Secure Supabase Auth with separate sign-up flows for customers and service providers, role-based access, and encrypted personal data (passwords stored only in Supabase Auth).
Database tables: users (id UUID from Auth, name, email, role, created_at), providers (id, user_id, business_name, address, phone), provider_amenities (id, provider_id, amenity_type ENUM['free_parking','credit_cards','pets_allowed','wifi','wheelchair_access'], value boolean), workers (id, provider_id, name, specialization, photo_url), services (id, provider_id, worker_id, name, price, duration, description), service_photos (id, service_id, photo_url), appointments (id, customer_id, service_id, datetime, status), reviews (id, appointment_id, rating, comment).
Customer functions: browse and search providers, filter by amenities, view provider profiles with workers and services, book appointments, manage bookings (reschedule/cancel), upload review with rating and comment, manage own profile and settings.
Service provider functions: manage business profile and amenities, add/edit/remove workers, create and edit services (assign to workers), upload service photos, set availability calendar, view and manage appointment requests (approve/decline/mark complete), respond to reviews, manage own profile and settings.
Startujemy. Odpalamy stronę: https://lovable.dev/
Wpisujemy nasz prompt:

Lovable poprosi nas o podłączenie bazy Supabase – robimy to i tworzymy projekt:

Po podłączeniu możemy się wziąć do prawdziwej pracy. Nasz ekran powinien wyglądać mniej więcej tak:

Najpierw prosimy Lovable o stworzenie struktury Bazy danych. Nie wiem czy domyślnie zrobiłby to sam – ja poprosiłem go wprost: “Ok can we create first version of my application. And prepare structure for that app in supabase ?“

Następnie klikamy Approve i możemy sprawdzić czy w naszej tabeli w Supabase pojawiły się jakieś tabele:
UWAGA: Tak wiem to już wymaga trochę wiedzy o tym jak działają Aplikacje. Zwykły kowalski może nawet nie wiedzieć co to baza danych i jak działa.
Super – coś udało się nam stworzyć – czy dobrze, zobaczymy przecież to Vibe Coding – nie nam oceniać.

Czas na aplikację – poprosiłem Lovable aby zajął się tym od A do Z – przecież on jest specjalistą: “Great – now can we prepare first version of app with all the views and functionalities ?”
Po chwili mamy pierwszą wersję aplikacji. Wygląda .. schludnie.
Zobaczmy więc co potrafi i czy działa. No i mamy pierwszy błąd przy logowaniu.

Po kilku próbach – udało się naprawić błąd.

Problem: Niestety logowanie nie działa – nie potwierdziliśmy adresu e-mail. Lovable nie jest jednak jeszcze zintegrowane z żadnym systemem do wysyłki maili – co wg. mnie powinno być zrealizowane domyślnie aby myśleć o tworzeniu jakichkolwiek systemów.
Na potrzeby testów w Supabase – wyłączmy konieczność potwierdzania adresu e-mail:

Po ustawieniu tego parametru – udało nam się zalogować. Aplikacja prawie gotowa – ale nie mamy miejsca gdzie Usługodawcy mogli by dodawać swoje usługi.

Dodajmy więc opcję stania się Providerem:
Niestety walidacje i bezpieczeństwo – nie jest domyślne w Lovable – a szkoda.

Dalsza praca z Lovable to w zasadzie powtarzanie promptów i udoskonalanie aplikacji.
Tworzenie aplikacji bez Płatnego planu – niestety raczej nie ma sensu, gdyż macie 5 darmowych tokenów na dzień. Płatny plan – nie jest tani. Efekt końcowy – nie jest gwarantowany.
Tym bardziej, że mało jest naprawdę rozbudowanych aplikacji stworzonych w Lovable.
Oczywiście – jest to możliwe lista aplikacji dostępna jest na stronę Lovable: https://launched.lovable.dev/
W większości są to proste jednozadaniowe aplikacje z płatną subskrypcją jak np: https://kidartlive.lovable.app/pricing lub https://resumetransform-ai.lovable.app/#how-it-works
Dla mnie ciągle Lovable to bardziej platforma do szybkiego makietowania niż “programowania”. Może okazać się szybkim startem – jeżeli chcemy przygotować PoC wizualny projektu – wygenerować kod do Gitlab, a następnie oddać w ręce programistów.
W mojej opinii możemy włożyć między bajki informacje, że AI zastąpi programistów. W mojej ocenie jeszcze bardzo długo to nie nastąpi. Pamiętajmy, że tutaj testowaliśmy najprostszy możliwy przykład aplikacji – gdzie AI jeszcze nie jest w pełni gotowe aby realizować je poprawnie. Jak więc możemy myśleć, że kiedyś ktoś powiedzmy AI pisanie aplikacji bankowych, systemów bezpieczeństwa czy zaawansowanych systemów ERP.
Przechodzimy do strony Bubble: https://bubble.io/
Obecnie bubble ma także generator AI – zobaczmy jak działa w porównaniu do tego z Lovable. Skorzystajmy z niego.

Bubble na start proponuje nam 14 dniowy Trial. Nie jest nam do potrzebne. Więc klikamy Start With Basic Features.
W bubble bardzo fajne jest to, że płatny plan jest nam w zasadzie potrzebny dopiero przy uruchamianiu aplikacji. Do tego momentu – możemy tworzyć za darmo – w przeciwieństwie do Lovable.

Wpisujemy nasz prompt:

Bubble – czyta nasz prompt i przygotowuje … no właśnie tutaj kolejna różnica. W bubble nie dostajemy od razu aplikacji – ale zestaw wymagań funkcjonalnych – które możemy sprawdzić i rozszerzyć jeszcze przed uruchomieniem aplikacji.
W przypadku Lovable – została pominięta całkowicie funkcjonalność dla Usługodawców. Tutaj możemy to łatwo sprawdzić i dodać:

Na ten moment nie zmieniamy tutaj nic – chcemy aby test był sprawiedliwy i klikamy Generate. Proces tworzenia aplikacji potrwa około 10 min.
Po wygenerowaniu Bubble przenosi nas do widoku Edytora:

Mamy w konsoli 16 błędów – dużo ale nie przejmujmy się nimi. Uruchamiamy naszą aplikację za pomocą przycisku Preview i zobaczmy co otrzymaliśmy:

Strona jest gotowa – może nazbyt różowa – ale to kwestia gustu.

Sprawdźmy ścieżkę logowania i rejestracji.

Po kliknięciu Sign Up – następuje zalogowanie. Zaletą Bubble jest to, że obsługa uprawnień użytkowników, logowania i wysyłki maili jest w standardzie.
Na screenach widzimy, że Bubble przygotował dla nas kilka już działających widoków – zobaczmy jak to działa.

Bubble przygotował dla nas widok dodawania usług.

Niestety – ze względu na błedy – po zapisaniu uslugi się nie wyświetlają – mimo, że poprawnie zapisują się w bazie danych.
Dodatkowo Bubble – stworzył też kilka rekordów, podczas tworzenia aplikacji.

Tutaj – niestety magia się kończy. Bubble obecnie nie ma jeszcze możliwości poprawy aplikacji z AI. Wymagana jest znajomość platformy. Dla jednych – będzie to duży minus. Dla drugich – jak ja plus – dlatego, że mam większa kontrolę nad aplikacją. Wiem jak działa – ale nie muszę umieć programować.
Zobaczmy czy uda nam się szybko naprawić błędy i jak wtedy będzie wyglądała nasza aplikacja. Po kilku zmianach okazało się, ze błędu dotyczyły filtrowania danych. Po naprawie mamy listę naszych Placówek i Usług:

Gdzie możemy umówić się na daną usługę:

Oczywiście – aplikacja nadal wymaga sporo pracy aby nadawała się do “użytku”. Z tym, że to już kwestia na osobny materiał.
Co wybrać kiedy?
Lovable
Do szybkich prototypów, makiet, prostych Landing Page – nada się znakomicie.
Bubble
Do aplikacji wymagających kontroli nad bezpieczeństwem logiką oraz z bardziej zaawansowanymi integracjami.
O ile aplikacje typu Bolt i Lovable mają ładny marketing i opakowanie o tyle platformy typu NoCode pozwalają faktycznie na dostarczenie pełnoprawnych aplikacji – nawet tych bardziej zaawansowanych.
W przypadku takich rozwiązań mamy wbudowane mechanizmy monitoringu oraz bezpieczeństwa danych użytkowników – co jest wielkim plusem.
Bubble pozwala też w łatwy sposób podłączyć się z dowolnym API – posiada też wiele wbudowanych wtyczek do automatycznej integracji.
Wadą jest to, że budowanie aplikacji w praktyce wygląda jak programowanie – z tym, że nie piszemy kodu – ale układamy klocki. Musimy tez znać REST API aby swobodnie móc integrować się z innymi aplikacjami.




