Redesign

2018-05-06

Protože jsem našel dva volné dny bez důležitého programu, rozhodl jsem se, že že si zjednoduším budoucí práci.

Do teď jsem při přidání příspěvku musel otevřít daný .html soubor, zkopírovat strukturu a opravit cesty:

HTML

Nejdřív to člověku nevadí, protože si hýčká svůj nový výtvor, ale postupem času to začne otravovat. Připravil jsem si kachnu pro spoustu dotazů ohledně PHP a dal jsem se do toho.

Chtěl jsem, aby bylo vše pokud možno automatické a zároveň bezpečné, takže jsem se smířil s tím, že stejně budu muset otevírat FTP klient a přetáhnu tam soubor; to už ale bude všechno, o zbytek se postará server sám.

No, a způsob řešení byl nasnadě - markdown. Jednoduchý, přehledný markupový jazyk, který mi na občasné texty a obrázky bude vyhovovat. Na papír jsem si nakreslil návrh a potom ho přenesl do HTML.

Návrh

Instalace LAMP na Debianu Stretch proběhla bez problémů, krom oprávnění k zápisu do složky nebylo nic třeba nastavovat.

S PHP jsem měl nulové zkušenosti, ale se znalostí jiných programovacích jazyků (v mém případě hlavně C#) nebyla jiná syntaxe problémem. Výzvou se ukázala být nezkušenost se sestavováním webu z jednotlivých bloků. Nic jsem si k tomu nenačítal - a ukázalo se, že když se člověk chová ke stránkám jako k LEGO stavebnici, má celkem velkou šanci na úspěch.

Vím, že by šlo vše přepsat s tím, že by stará struktura zůstala, ale měl jsem nutkání zase zkusit něco nového. Opustil jsem úvodní stránku ve formě rozcestníku a vydal jsem se moderní cestou velké fotografie. Pokud se to neosvědčí, změním to.

Úvod starého webu Úvod nového webu

Příspěvky teď nejsou rozděleny do dvou samostatných kategorií, ale jsou vedle sebe a rozlišují se barvou.

Starý web Nový web

Příspěvky samotné jsou tedy samostatné markdown soubory, které bylo nutné nějak převést do podoby pro web. Projekt parsedown byl přesně to, co jsem potřeboval. Přes parametr postID v URL získávám adresu souboru - pokud existuje, načte se. Když je parametr prázdný, zobrazí se všechny zveřejněné příspěvky. Ve všech ostatních případech se prohlížeč přesměruje s chybovým kódem 404.

Příspěvek

Kontakt a licence mi trochu připadají graficky neladící vůči zbytku - nechtěl jsem je ale dělat jako speciální posty, protože by mě mrzelo, kdyby za sebou měly bílé pozadí.

Kontakt Licence

Grafickým středobodem se tak stala zelená, žlutá a tmavě šedá - podle titulní fotky. Jestli jsem spokojený se současným fontem (Roboto) nevím, ale kočky v ikonách si nechám určitě.

Chcete být informováni o nových příspěvcích?*