Kódím.cz
2

Úvod do Gitu

Představíme si verzovací systém Git, který nám usnadní správu a sdílení zdrojových kódů.

2
Saturejka - vývoj

Vše máme připraveno a můžeme začít programovat.

  1. Ve složce projektu založte soubor index.html. Vložte to něj následující kód.

    <!DOCTYPE html>
    <html lang="cs">
      <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Saturejka</title>
      </head>
      <body>
        <h1>Naše nabídka</h1>
        <p>
          Vybraná jídla z našeho jarního menu přepravená našimi prvotřídními
          šefkuchaři.
        </p>
      </body>
    </html>
    
  2. Spusťte v terminálu npx serve. V prohlížeči na adrese http://localhost:3000 zkontrolujte, jak stránka vypadá.

  3. S gitem pracujte v druhém terminálu – npx serve si zabral terminál pro sebe.

  4. Přidejte soubor index.html do stage pomocí git add.

  5. Pomocí git status zkontrolujte, že je soubor index.html připraven ke commitu.

  6. Vytvořte nový commit pomocí git commit -m "…". Ke commitu napište zprávu „Základní HTML“

  7. Pomocí git log zkontrolujte, že se commit opravdu vytvořil. Výpis logu ukončíte klávesou q

  8. Pomocí git push publikujte nový commit na GitHub.

  9. Stejným postupem jako výše vytvořte soubor style.css s tímto obsahem

    @import url('https://fonts.googleapis.com/css?family=Open+Sans:300|Playfair+Display:700&display=swap&subset=latin-ext');
    
    html {
      font-family: 'Open Sans', sans-serif;
      font-size: 15px;
    }
    
    h1,
    h2 {
      font-family: 'Playfair Display', serif;
    }
    
  10. Soubor se styly správně nalinkujte do vašeho HTML a provedené změny opět commitněte stejným postupem jako výše.

Pokračujte ve tvorbě stránky vlastním tempem. Vždy, když dokončíte i třeba jen malou část, udělejte nový commit. Stránku rozhodně nemusíte dokončit. Cílem cvičení je především si vyzkoušet reálnou práci s Gitem.

Jakmile budete se svou stránkou spokojeni, publikujte ji pomocí GitHub Pages.