
# Ahoj Czechity


# Představení

* Czechitas
* Aleš Růžička
* Jan Svěrák
* Mezi sebou - kontakty jsou důležité


# Certifikát

* Podmínky
* 80% účast
* plnění domácích úkolů


# Pořadavky

* Základní počítačová gramotnost
* Ovládnání počítače
* Souborový systém


# Plán 1/2

1. Úvod do HTML, VisualStudio code
2. Úvod do CSS, Github
3. Box model, DevTools, pseudotřídy, pokročilé selektory
4. Pozivování, Responsivní design
5. Flexbox úvod


# Plán 2/2

6. Flexbox prakticky, Grid úvod
7. CSS Animace
8. JavaScript úvod
9. JavaScript prakticky
10. Publikace webu prakticky (Netlify)


# Plán další možnosti

* HTML formuláře, tabulky
* CSS Frameworky a jejich role a využití - Boostrap
* JavaScript Frameworky a jejich role a využití - jQuery, moderní frameworky
* Jak funguje HTTP protokol (síťový protokole Webu)
* IT Bezpečnost pro správce webu
* Transformace webu a před publikací (SASS, etc.)
* Markdown


# Komunikace

Záznamy

[Web](https://czechitaswebcb2018.alesruzicka.eu/)

[Facebook skupina](https://www.facebook.com/groups/2253530994881739/)


# Průběh hodiny

* Přestávka 15 minut cca v polovině
* Ptáme se
* Prakticky zkoušíme - vše vypada jednoduše na papíře


# Motivace

Kdyby to bylo jedoduché, dělal by to každý


# Začínáme, co je Web?

* Web
* Http
* Webový prohlížeč
* HTML, CSS, JavaScript


# Instalace VS Code

* https://code.visualstudio.com/
* Plugin
    * Live HTML Previewer


# HTML

* Značkovací jazyk (tagy)
* Viditelná část webu


# HTML Tag

```
obsah
```


# Základní tagy

```
odstavec
nadpis první úrovně
```

* vzhled není důležitý
* důležitý je sémantický význam


# Úkol: Prázdný HTML soubor

1. Vytvoříme adresář
1. Otevřeme ve VS Code
1. Vytvoříme soubor `index.html`
1. Použijeme zkradku `html:5 + tab` k vytvoření souboru


# Nadpisy

1. Jsou osnova
1. 6 úrovní
1. `` zpravidla pouze jednou


# Odkazy

1. `text odkazu`
1. atributty - nezobrazované doplňkové informace k tagům
1. `Czechitas`
1. Co je Url?


# Obrázek

1. ``
1. nepárový tag, možno jako ``
1. `alt`
1. Co je Url?


# Domácí úkol

* vytvořit osobní vizitku se
    * jménem
    * krátkým odstavcem o sobě
    * odkazem na svůj profil
    * vlastní fotkou (aby vás lektoři poznali)
    * bonus: vložit odkaz na svůj e-mail
    * zabalit soubory do ZIP a poslat na e-mail (czechitaswebcb2018@alesruzicka.eu)


# Dneska Konec

# Uvidíme se příště