Skapa en hero image

En hero image visas oftast på startsidan på en webbplats och innehåller någon typ av info som ska fånga användarens intresse 👀, se till vår startsida 👉. Utmaningen blir att du skapa din egna hero image med en bakgrundsbild, rubrik och en underrubrik. Varför inte lägga till en knapp och lite extra styling? 🎨 Du bestämmer!

Skapa en hero image till din hemsida, eller skapa starten till din egna portfolio.

Få hjälp

Gå med i vår Slack kanal och få hjälp av hela vårt community och hjälp coacher. Gå med här.

Häng med på Code along den 15:e april 12:00-12:30 med vår praktikant Sara, hon kommer att visa sin take på kodutmaningen live.

ANMÄL DIG TILL CODE ALONGEN

1. Såhär startar du

De 20 första får feedback på sin kod (inlämnat innan 22:e april), för att delta i detta behöver du gå in på vår Github här , sedan trycker du på uppe till höger. Nu har du kopierat koden över till din användare på Github. För att ladda ned koden på din dator och starta utmaningen trycker du sedan på och download zip. Färdig!

Vill du endast ladda ned kodfilerna, kan du göra det här.

Vi rekommenderar att du använder Visual studio code som editor. Det är gratis och går att ladda ned👉 här . Inuti filerna finner du några kommentarer som kan hjälpa dig på vägen till att lösa utmaningen. Du kan även läsa nedan för tips och trix!

2. Tips & trix

Läs om grunderna för Hero Image på w3Schools här.
Kolla in hur andra har byggt sina Hero Images här, möjligheterna är verkligen oändliga!
Om du vill hitta gratis bilder att använda kan du hitta det på www.pixabay.com eller www.unsplash.com bland andra.

3. Inspiration

"För ett år sedan hade jag ingen aning om vad jag ville göra."

Matilda jobbar idag som kod-coach på Technigo, men för ungefär ett år sedan hade hon inte skrivit en enda rad kod. Från att ha studerat ekonomi, genusstudier, didaktik och lingvistik - till att slutligen hitta programmering. Läs mer om Matildas resa och hur hon fann vägen dit i hennes blogginlägg.

Läs om Matildas resa här

4. Få feedback på din kod

Lämnar du in din kod innan den 22:e april och är en av de 20 första kan du få feedback på din kod av utvecklare från Technigo.För att få feedback krävs det att du lägger upp din lösning på Github. Men det är inte så krångligt som du tror, kolla igenom denna videon eller gå igenom stegen nedan.

1. Gå in på ditt konto i GitHub och välj fliken "repositories". Leta upp utmaningen som du en gång forkade och klicka in på den.

2. Väl inne på utmaningen på GitHub, på ditt konto - dra kodfilerna från din dator och släpp de i detta fönster (var som helst).

3. Filerna laddas nu upp på din GitHub, skrollar du ned finner du en ruta med rubriken "Commit changes". Skriv någon kommentar om du vill, tryck sedan den gröna knappen "commit changes".

4. Tryck sedan "New pull request". Då ser du vilka ändringar du har gjort i koden. Tryck "Create pull request" två gånger i rad. Tadaaa, färdig!

Har du lyckats bli en av de 20 första att lämna in kodutmaningen kommer du att bli notifierad om det i GitHub 👏.

5. Visa världen din lösning!

Självklart vill vi se din lösning, dela den gärna på vår Instagram under hashtaggen #kodutmaningen eller i vår Slack-kanal här.

Och du, passa på att utmana din vän - dela kodutmaningen 💪.