Plant Dashboard

W tym przykładzie użyjemy Craft do zarządzania kolekcją wszystkich Twoich roślin i ich potrzeb, a Lovable do stworzenia pięknego panelu, który pozwoli nam na pierwszy rzut oka zobaczyć, które rośliny wymagają uwagi.

Step 1 — Create Your Doc

Nasze rośliny są przechowywane w Kolekcji w dokumencie Craft. Dla każdej rośliny dodajemy informacje o jej typie, w którym pokoju się znajduje, jak często trzeba ją podlewać i kiedy była ostatnio podlana. Oczywiście możesz dostosować kolekcję i dodać pola dla wszystkiego, co chcesz śledzić w przypadku swoich roślin.

Użyj szablonu, aby utworzyć nowy dokument z kolekcją dla swojego panelu roślin:

Plant Dashboard

Preview Template

Use This Template

Step 2 — Enable API Access

Włącz dostęp API dla swojego dokumentu, aby uzyskać unikalny adres URL, który umożliwia odczyt i dodawanie treści do dokumentu.

Step 1

Open the “Connections” tab

Step 2

Click “Add Your First API Connection”

Step 3

Skonfiguruj swoje połączenie API, nadając mu nazwę.

Step 4

Kliknij „Add Document” i wybierz swój dokument Plant Dashboard.

Step 5

Adres URL API, który będzie używany do interakcji z Twoim dokumentem, jest teraz wyświetlany na górze

Step 6

Kliknij przycisk „Download AI Bundle”. Spowoduje to pobranie folderu zawierającego dokumentację API oraz treść Twojego dokumentu.

Step 3 — Build on Lovable

Teraz przejdźmy dalej i zbudujmy właściwą stronę internetową dla naszego panelu w Lovable. Do stworzenia przykładowej strony pokazanej powyżej użyliśmy tego promptu:

Przejdź do Lovable i wklej prompt w pole tekstowe. Upewnij się, że załączasz AI Bundle dla swojego dokumentu, który właśnie pobraliśmy.

Lovable zabiera się do pracy, analizując zawartość pakietu, aby zrozumieć strukturę dokumentu i sposób korzystania z API. Następnie zaczyna budować stronę zgodnie z naszym promptem.

Teraz mamy piękną stronę, która wyświetla nasze rośliny i ich stan zdrowia, a także pozwala oznaczać je jako podlane bezpośrednio z panelu!