Malý repozitář pro WTL 3.I 2025/2026
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

4.0 KiB

📚 AI Extra Material - Doplňkové Studijní Materiály

🎯 Účel této složky

Tato složka obsahuje doplňkové studijní materiály pro hlubší pochopení pokročilých konceptů webového vývoje. Tyto materiály jsou navíc k základnímu učivu a slouží k samostudiu.

📂 Co složka obsahuje

🎓 AI Projekty (Základní verze v /AI složce)

Tato složka obsahuje duplikáty AI projektů z hlavní složky /AI. Jsou zde pro pohodlný přístup k materiálům.

  • ai_01_grid_responsive - CSS Grid & Responzivní Layout
  • ai_02_semantic_portfolio - Sémantické HTML5 & CSS Positioning
  • ai_03_form_validation - Pokročilá Validace Formulářů s JavaScript
  • ai_04_prep_bootstrap - Komplexní Bootstrap Prep Projekt

📋 Informační Soubory

  • AI_PROJEKTY_README.md - Přehled všech AI projektů
  • UCITEL_INFO.md - Informace pro učitele o projektech, hodnocení, harmonogramu
  • ISP_WTL_3I.md - Individuální studijní plán (ISP)
  • ISP_WTL_3I.txt - ISP v textové podobě

🚀 Bootstrap Doplňkové Projekty

18_form_validation_bootstrap

Ukázka validace formulářů s Bootstrap 5.

  • Bootstrap validační třídy
  • Custom validace s JavaScriptem
  • Visual feedback pro uživatele
  • Propojení s Bootstrap styly

Kdy použít: Pro pochopení, jak Bootstrap řeší validaci formulářů "out of the box".

18a_form_xss_demo

BEZPEČNOSTNÍ DEMO - ukázka XSS (Cross-Site Scripting) zranitelnosti.

  • Demonstrace nebezpečného kódu
  • Jak vznikají XSS útoky
  • Jak se bránit (sanitizace inputů)
  • Best practices pro bezpečnost

⚠️ VAROVÁNÍ: Tento kód je záměrně zranitelný pro výukové účely. NIKDY nepoužívejte tento přístup v produkčním kódu!

🎓 Jak pracovat s těmito materiály

Pro studenty:

  1. Nejdříve dokončete základní AI projekty v hlavní složce /AI
  2. Pokud chcete víc: Projděte si tyto doplňkové materiály
  3. Bootstrap validace: Po dokončení AI 03, prozkoumejte 18_form_validation_bootstrap
  4. Bezpečnost: Po práci s formuláři si prostudujte 18a_form_xss_demo

Pro učitele:

  • Přečtěte si UCITEL_INFO.md pro detailní informace o projektech
  • AI_PROJEKTY_README.md obsahuje přehled všech AI projektů
  • ISP soubory obsahují studijní plán

🔗 Návaznost na hlavní kurz

Základní kurz Extra Material Proč je užitečný
08_js_form 18_form_validation_bootstrap Ukáže Bootstrap přístup k validaci
AI 03 18a_form_xss_demo Bezpečnostní aspekty formulářů
13-17 Bootstrap AI projekty (duplikáty) Opakování před Bootstrapem

💡 Doporučené Pořadí Studia

  1. Základní kurz (01-20) - absolvujte nejdříve
  2. AI projekty v hlavní složce /AI - praktické projekty
  3. Bootstrap validace (18_form_validation_bootstrap) - po Bootstrap lekcích
  4. XSS Demo (18a_form_xss_demo) - pro pochopení bezpečnosti
  5. ISP materiály - pro samostudium dle potřeby

⚠️ Důležité poznámky

  • Tyto materiály jsou nepovinné - jsou navíc k základnímu kurzu
  • Projekty v této složce jsou duplikáty - hlavní verze jsou v /AI
  • ⚠️ XSS Demo je záměrně zranitelný - slouží pouze k výukovým účelům
  • 📚 UCITEL_INFO.md obsahuje hodnocení a harmonogram pro učitele

📖 Hlavní AI Projekty

POZOR: Hlavní verze AI projektů jsou v kořenové složce /AI!

Pro práci na projektech používejte soubory z /AI, ne z této složky. Tato složka slouží jako archiv a reference.

🎯 Cíle Extra Materiálů

Po prostudování těchto materiálů budete:

  • Rozumět Bootstrap validaci formulářů
  • Vědět, jak se bránit XSS útokům
  • Mít hlubší pochopení bezpečnosti webových aplikací
  • Umět propojit Bootstrap s custom validací

Hodně štěstí s dalším studiem! 📚

Tyto materiály rozšiřují základní kurz a poskytují hlubší vhled do pokročilých témat.