
Dnes si mnoho programátorů klade otázku: Jaká je budoucnost programování v době, kdy AI (např. Copilot) přebírá většinu rutinních úloh? Budou programátoři za pár let vůbec potřeba? A jak se můžeme odlišit, když většinu kódu vygeneruje umělá inteligence?
Klíčové je pochopit, že AI zvládá hlavně rutinu – tedy úkoly podle naučených vzorů. Pokud chcete být žádaný (a dobře placený) vývojář, nemůžete postupovat stejně. AI totiž rutinu zvládá lépe než my. Odlišit se můžeme jen tím, co AI neumí. A to je kreativita.
Knih o kreativitě (i v programování) najdete spoustu. Většina je ale velmi teoretická. Já věřím jinému přístupu: pokud chcete kreativní programování učit, musíte ho umět i předvést. Proto kromě teorie v tomto blogu najdete i desítky zcela nových, originálních, dosud nepublikovaných programátorských konstrukcí. A protože jsem hlavně fullstack vývojář, budou převážně z PHP, JS a CSS.
čisté CSS bez JS
Jakými kreativními příklady začít?
Začneme u CSS, přesněji u jeho podmnožiny CSS 3D. Proč právě tady? Protože 3D scéna na stránce zaujme na první pohled. Jenže: dnešní prohlížeče nemají nativní podporu pro 3D formáty jako FBX, OBJ, 3MF nebo STL. A pokud je chceme zobrazit, musíme natahovat objemné JS knihovny. Já se pokusím tuto podporu doplnit čistě pomocí CSS.
Na první pohled to zní jako úkol pro vývojáře prohlížečů. Ale ukážeme si, že to jde zvládnout bez zásahů do prohlížeče – pouhou konverzí 3D scény do CSS.
První cíl je jednoduchý: vytvořit převodník, který vygeneruje zobrazitelný soubor s 3D scénou, tak aby se dal vložit do stránky stejně snadno jako obrázek nebo video. A hlavně: scénu bude možné otáčet bez použití JavaScriptu. Takový HTML fragment půjde vložit třeba přes TinyMCE, poslat mailem, nebo publikovat jako běžný článek.
Zní to složitě – a taky je. Za více než 10 let existence CSS 3D nikdo nic podobného neudělal. A pokud CSS dobře znáte, hned vás napadne proč: jak v CSS umístit libovolný polygon do 3D prostoru? A jak v CSS uložit stav – například rotaci scény kolem osy, kterou pak zkombinujete s další rotací?
Tohle jsou otevřené problémy, na kterých se kreativita opravdu pozná.
čisté CSS, bez JS
Pokusil se někdo o něco podobného?
Na GitHubu existuje malý scriptík obj-to-html, který převádí 3D objekty do HTML. Podporuje ale jen trojúhelníkové sítě. Navíc mám pocit, že sám autor svému projektu příliš nevěří.
Připraveni na kreativní programování?
Bude převod z *.OBJ do .CSS to jediné, čím se budeme v tomto blogu zabývat? Rozhodně ne. Ještě zajímavější přístupy si ukážeme v PHP a JS – jazycích, kterými toto CSS vygenerujeme.
Pokud vás téma zaujalo, přihlaste se k odběru a těšte se na další kapitoly. Krok za krokem budeme objevovat nové techniky a postupy, až se vám tento přístup stane vlastní a stanete se skutečně kreativním programátorem!