{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Pokročilejší dashboarding\n",
    "\n",
    "V předchodí části jsme velice efektivně vytvořili jednoduchý a přesto užitečný dashboard na vizualizaci dat. Teď se podíváme na trochu rozsáhlejší aplikaci: Vrátíme se zpět k rybám, tučňákům a strojovému učení."
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Fishboard\n",
    "\n",
    "Když jsme zkoumali možnosti strojového učení (regrese, klasifikace, klastrování atd.), měnili jsme metody, (hyper)parametry a dívali jsme se, jak dobře se stroj naučil odhadovat nějakou vlastnost z dat. To je rozhodně příležitost pro pěkný dashboard, který nám takovou práci usnadní.\n",
    "\n",
    "\n",
    "### První verze\n",
    "\n",
    "První verzi aplikace najdeš v Github repozitáři https://github.com/coobas/fishboard. K sobě si ji naklonuješ příkazem\n",
    "\n",
    "    git clone https://github.com/coobas/fishboard.git\n",
    "    \n",
    "Pro lokální vývoj takového dashboardu je rozumné vytvořit pro ni vlastní virtuální prostředí, aby se nemíchaly balíky z jiných projektů a aby tak chování aplikace bylo lokálně stejné jako na serveru. Můžeme postupovat takto:\n",
    "\n",
    "```\n",
    "cd fishboard\n",
    "python3 -m venv .venv\n",
    "```\n",
    "Tím jsme vytvořili virtuální prostředí v adresáři `.venv`. Aktivujeme ho na Linuxu / Mac OS pomocí\n",
    "\n",
    "    source .venv/bin/activate\n",
    "    \n",
    "nebo na Windows \n",
    "\n",
    "    .venv/bin/activate.bat\n",
    "    \n",
    "A teď nainstalujeme všechny potřebné balíky:\n",
    "\n",
    "    python -m pip install -r requirements.txt\n",
    "    \n",
    "Pak by měl jít fishboard spustit už známým způsobem:\n",
    "\n",
    "    streamlit run fishboard.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Přidáváme vizualizaci\n",
    "\n",
    "Jistě si všichni všimli, že fishboard umí pracovat jen s rybími daty a navíc je neumí ani vykreslit. Ještě že máme tuto část připravenou z předchozí části a nic nám nebrání ji použít.\n",
    "\n",
    "**Úkol:** Přidej do fishboardu naši předchozí aplikaci pro načítání a zobrazování dat. Asi bude potřeba někde místo `st.` použít `col1.`."
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Na co si dát pozor\n",
    "\n",
    "Streamlit aplikace je vlastně takový skript. Spouští se pořád dokola, jakmile uživatel něco zadá, někam klikne. Je to záměr, tento design přináší opravdu přímočarý způsob psaní užitečných webových aplikací. Za tuto přímočarost ale samozřejmě platíme některými omezeními.\n",
    "\n",
    "### Rychlost\n",
    "\n",
    "Od Streamlitu rozhodně nečekejte nejsvižnější uživatelské rozhraní, spíš naopak. Tím, že se aplikace spouští celá stále dokola, může docházet k menším i větším prodlevám (které ovšem nemusí zásadně vadit). Existují dva jednoduché způsoby, jak rychlost optimalizovat:\n",
    "\n",
    "1. Používat cache na pomalé funkce, tj. \"schovávat\" si výsledky těchto funkcí, a pokud se funkce zavolá s argumenty, pro které už je výsledek k dispozici, vytáhne se výsledek (rychle) z cache. Streamlit na to má velice užitečnou funkci `st.cache`, která se nejčastěji používá jako @dekorátor.\n",
    "2. Přidat tlačítko pro spuštění výpočtu, aby se drahé výpočty neprováděly po každé změně vstupu.\n",
    "\n",
    "### Složitost aplikace\n",
    "\n",
    "Programování ve Streamlitu je přímočaré a taková by měla být i aplikace, kterou vytváříme. Pokud potřebujeme nestandardní komponenty (widgety), detailní rozložení komponent na stránce nebo komplexní interakce mezi komponenty, je potřeba sáhnout jinam: Ve světě čistého Pythonu nám mohou posloužit [Dash](https://plotly.com/dash/) nebo [Panel](https://panel.holoviz.org/). Největší možnosti pak přináší rozdělení aplikace na backend a frontend. Backend napíšeme samozřejmě v Pythonu (pomůže nám např. [FastAPI](https://fastapi.tiangolo.com/)), frontend pak třeba v [TypeScript](https://www.typescriptlang.org/) a [React](https://reactjs.org/).\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Domácí projekt\n",
    "\n",
    "Přidej do fishboardu možnost klasifikace a / nebo klastrování (PCA). Aplikaci spusť na Heroku. Jako bonus můžeš dát svůj kód k dispozici na Githubu."
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.10.6"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}