Vad du bygger
Du skapar din första helt anpassade webbkomponent – till exempel ett stilrent kontaktformulär eller en pristabell. Genom att fokusera på en byggsten i taget lär du dig grunden i det som kallas komponentstyrt byggande, vilket ger dig full kontroll över din blivande hemsida.
Innan du börjar
- Ett registrerat konto på v0 där du snabbt loggar in med Google eller GitHub.
- En idé om en specifik funktion du vill ha på din hemsida, till exempel en meny, en bildruta eller ett kontaktformulär.
- Inga förkunskaper i kodning krävs.
Steg för steg
- Öppna verktyget – Gå till v0 i din webbläsare och se till att du är inloggad så att dina skapelser sparas på ditt konto.
- Tänk som lego – Bestäm dig för en enda specifik del av din hemsida som du vill bygga först, istället för att försöka skapa en hel startsida direkt.
- Skriv din startprompt – Skriv en tydlig beskrivning av din komponent i textfältet mitt på skärmen och klicka på skicka-knappen.
Skapa ett modernt kontaktformulär med fält för namn, e-post och meddelande, samt en tydlig skicka-knapp längst ner.
- Granska ditt resultat – Titta på förhandsvisningen som genereras på skärmen och känn efter om grundstrukturen känns rätt.
- Finjustera detaljerna – Använd chattfältet igen för att ändra mindre detaljer som färger, runda hörn eller avstånd tills du är helt nöjd.
Gör knapparna mer rundade och ändra bakgrundsfärgen på skicka-knappen till en mjuk grön nyans.
- Spara din komponent – Klicka på knappen "Share" eller "Export" uppe i det högra hörnet för att spara din färdiga modul så att du kan använda den senare.
Byggloftets tips
- Vår maskot Bygge brukar säga att det är lättare att bära en isbit i taget än hela glaciären. Det stämmer även här. Dela upp din hemsida i logiska delar: en meny, en introduktion, tre puffar för dina tjänster och en fot. Bygg dem som helt separata projekt i v0.
- Använd knapparna för skärmstorlek högst upp i förhandsvisningen för att kontrollera att din komponent ser lika bra ut på en mobiltelefon som på en datorskärm.
Vanliga fel
- "Sidan blir för plottrig och rörig": Du har antagligen bett om för många saker samtidigt. Starta en ny chatt i v0 och fokusera på en enda sak i taget.
- "Jag vet inte hur jag ska få in koden på min sajt": Oroa dig inte för koden just nu. Det viktigaste i detta steg är att du lär dig att designa och spara de enskilda bitarna.
Du är klar när…
Du ser en färdig, fungerande komponent på skärmen som du kan klicka på och som ser ut precis som du har tänkt dig.


](https://ooxhuiexfcujmaxwipki.supabase.co/storage/v1/object/sign/lesson-illustrations/steps/vad-ar-v0-0.png?token=eyJraWQiOiJzdG9yYWdlLXVybC1zaWduaW5nLWtleV83NDc5Y2E4MC00OWVlLTQxMzAtODE4Yi00YjE3NjExZDY4OWMiLCJhbGciOiJIUzI1NiJ9.eyJ1cmwiOiJsZXNzb24taWxsdXN0cmF0aW9ucy9zdGVwcy92YWQtYXItdjAtMC5wbmciLCJzY29wZSI6ImRvd25sb2FkIiwiaWF0IjoxNzg2NDgwNjI4LCJleHAiOjE3ODcwODU0Mjh9.v1_ptYgLYHuHVf997G1ErBJbrQj0ZhWzevQkihQxDYw)

