Skip to content

Latest commit

 

History

History
62 lines (50 loc) · 3.22 KB

README.md

File metadata and controls

62 lines (50 loc) · 3.22 KB
Raw

bbb - basic building block web

Manažerské shrnutí

bbb je web řešení na bázi jamstack. Přoč je tento směr budoucností a jaké přináší výhody oproti tradičním se píše např. zde. Základní myšlenky udržitelného systému pro správu webu:

  • maximální oddělení:
    • visualní styl (S) (CSS)
    • template (T) = jaký HTML kód se bude generovat
    • data (D) = struktura komponent tvořících jednotlivé stránky a jejich texty
  • data v textových souborech, aby se dali verzovat a rychle servírovat přes CDN.
  • web jako JS aplikace konzumujici data z ruznych zdroju
  • možnost generovat statický web pro uživatele s vypnutým JS nebo crawlery

web jako lepidlo open dat z ruznych zdroju, ktere ty data hezky vyrenderuje.

Znamená to, že moderní web se aktualizuje sám díky tomu, že prostě pouze vykresluje otevřená data, která v jiných systémech už beztak vznikají.

Web data - slozka statickych textovych souboru

Pro příklad web OM

  • data (D) - jednotlive stranky jsou ve forme yaml souboru - nejuspornejsi a nejjednossi zpusob, jak definovat hierarchickou strukturu. Kazdy yaml soubore = 1 stranka. Jeho path na webu odpovida path ve strome slozky. Kazdy ma:
    • zakladni meta-atributy (title, desc, ...)
    • layout: jaky layout se pro stranku pouzije
    • children = pole komponent, ze kterych se sklada (ty se mohou opet skladat pomoci buildin componentu composition jako napr. zde).
  • templates (T) + style (S): v extra podslozce _service:
    • layouts: vue.js template jak se vyrenderuje stranka
    • components: vue.js komponenty, ktere obsahuji jak template, tak mohou obsahovat slozitejsi logiku (nacitani dat, filtrace, ...). Specialni component composition je pro komplexnejsi kompozice. Atribut class muze obsahovat znaky ">" ktere zpusobi vyrenderovani zanorenych div elementu. Tedy napr. container>columns vyrenderuje:
    <div class="container">
  <div class="columns">
    children ... 
  </div>
</div>
    • style: sass based custom style (momentalne bootstrap a bulma.io). Main soubor je custom.scss ktery importuje vse potrebne pro cely styl webu.

V repositari nejsou zadne assety. Ty jsou v udrzitelnem reseni hostovany mimo (CDN) a web na ne pouze odkazuje.

Backend

Backend je volitelna soucast, Web ho nutne nepotrebuje. Je potreba jako nastroj pro editaci, nebo pro automaticke pregenerovavani generovanych soucasti (napr. stylu). Vice v repozitari.

Development

Run dev mode:

DATA_FOLDER=/path/to/your/bbb-web npm start