7 Precvičovací systém Stupeň prevedenia 3 - postavené na PHP OOP

practi$e v. 3

Rozsah PHP premenné, funkcie, OOP UI / Používateľské rozhranie HTML, CSS, globálne štýlovanie

Tretia verzia practi$e je finálnou verziou. Bežne pomôže so spracovaním od dokumentu až po video. Systém je plne prispôsobený a čo je dôležité – je rovnaký ohľadne prístupu k editácii a systému samému. Jednoduché pridávanie záznamov k už existujúcim v rovnakom tvare, ako predchádzajúce.

Vo svojej podstate je to jedna veľká kniha. Následne sa stromovo rozvetvuje na témy, kapitoly, pod kapitoly atď.

Poďme na to od konca. Text. Kľúčové slová – tie sa vkladajú pomocou kódu PHP – konkrétne kód objektu (OOP). Ten potom spája slovo s informáciou o danom slove. Potom základný text &ndash všeobecný text so svojimi špecifickými tagmi (</>) pre cudzojazyčné slová, typovo rovnaké premenné, dátové typy všeobecne, operátory a iné. Vybrané slová a výrazy tak preberajú farebné rozlíšenie (CSS) z globálnych prednastavení. Všetko so zámerom, aby bolo jasné, že tieto slová niečo znamenajú a ich význam je unikátny a ľahko identifikovateľný – jeden jazyk jedna farba. Všetky dátové typy jedna farba a pod.

Grafika – obrázok. Je umiestnený lokálne pri svojej kapitole. Jeho zobrazenie na stránke, sa riadi z globálneho adresára globálnymi parametrami. Ak poviem, že jedna téma môže obsahovať aj tisíc obrázkov – asi mi nebudete veriť. Ale je tomu tak.

Nadpis, podnadpis, informačný detail k zdroju. Zapisujú sa do externého súboru. Pridávam aj ďalšie informácie – pri videách celkový čas, názov a jeho veľkosť. Zo súboru sa potom dáta prenášajú do hlavného indexu témy, do obsahu témy, do konkrétnej stránky kapitoly, malého navigačného menu na stránke a nakoniec ku kapitole samotnej. V obsahu sa číselné dáta vyhodnocujú – celkový čas, obsadené miesto na disku a pod. Stále je však zachovaná základná filozofia – jedna web stránka je ucelená jedna kapitola, so všetkým, čo k nej patrí. Postupne sa k nej pridávajú ďalšie – rovnako, ako v knihe. Od obsahu úvodu titulky až po prílohy. Pridávané časti sa riadia číselne – nasledujúcim číslom v poradí. Preto, ak je potrebné zmeniť poradie, vložiť nové časti – postačí iba dokument prečíslovať. Až tak je to jednoduché, ako zakladanie nových listov do zakladača.

Nultá kapitola. Je to unikátnosť tohoto systému. Podchytil som ju pri knihách Linuxu. V nich ešte pred očíslovanou kapitolou bola neočíslovaná – neoznačená časť, pred kapitola kapitoly. V tejto verzii practi$e je to stránka označená ako 0. Aj tu ako programátor správne začínam vždy od 0. V tejto stránke môžeme voliť témy slov. Pre všetky témy je tu spočiatku aktivovaných päť základných tém. A následne, ak téma existuje – pripojí sa. Ak nie – vytvorí sa. Aktuálne je na výber viac ako 50 tém. Takto si z globálnych tém pripojím potrebné slová. Opäť, ako strom, ktorému pribúdajú ďalšie konáre a stále sa iba doplňujú ďalšie a ďalšie prvky. Predstavte si to tak, že spracováva napríklad tému – jazyk PHP a v texte určite bude použitý aj jazyk HTML, CSS, prípadne JS – a tie chcem mať tiež k dispozícii. V nultej kapitole okrem základu, pripojím PHP, ako hlavný zdroj slov a k nim pripojím aj ostatné slová z uvedených tém. Okrem slov je tu zobrazený prípojný kód na skopírovanie do tvoriaceho sa textu a aj informácie, ktoré so sebou nesie. Samozrejmosťou je aj skloňovanie slov. Stačí si len vybrať slovo a použiť ho. Jednoduché a zacielené na požiadavky.

Ako to funguje. Knihy, skriptá, proces inštalácie, vlastné postupy, videá z internetu – čokoľvek, z čoho je vhodné si robiť poznámky pre budúcnosť. Jeden dokument alebo celý kurz – princíp je rovnaký. Ako prvé si v nultej kapitole zapíšem nadpisy. Ak je zdroj pekne rozdelený, je to ľahšie. Ak je jedno tri hodiny trvajúce video a ešte som ho detailne nevidel, tak sa tiež nič nedeje. Dopíšem počas procesu spracovávania. Je na mne, ako si určiť delenie na menšie celky. Zadaním nadpisov sa priamo pred pripravuje delenie stránok. Potom už len vpisujem text a vkladám obrázky. Pokiaľ chcem vložiť slovo, vyberiem ho z nultej kapitoly. Pokiaľ chcem obrázok ihneď – urobím snímku, očíslujem a vložím do určeného adresára. Výsledok vidím priamo na vytvorenej web stránke. Celý systém je založený na opakovaní tých istých vzorov. Vytvorím jednu kapitolu a všetky ostatné budú principiálne rovnaké. Ak začínam úplne novú tému, stačí založiť nový adresár, skopírovať šesť súborov a môžem začať. Tak jednoduché a intuitívne to je. Ja som takto už vytvoril 17 veľkých tém a niekoľko menších. Napr. PHP a Python v sebe obsahujú rovnako po 8 pod tém. Pričom tých 8 z PHP predstavuje 10 rokov, od verzie PHP 5 až po PHP 8.

Nie je to len o prenášaní predlohy. Väčšinu toho, čo som spracoval ja, tvorí postup písania kódov programov. Napr. si vyberiem video o vytvorení nejakého efektu. Ten postup sledujem vo videu. Robím si poznámky. Zároveň krok po kroku ten efekt priamo vytváram. Vždy po nejakej ucelenej časti, dopísaniu niekoľkých riadkov – čo sa udialo, zaznamenám napr. obrázkom a postupujem ďalej. V budúcnosti, ak by som niečo z toho kódu potreboval, už nebudem prechádzať dlhé video. A ani na internet nemusím ísť – pretože to mám lokálne. Ten moment vo videu nájdem vo svojich poznámkach aj bez videa. Zároveň na obrázkoch uvidím konkrétne miesto a čo v kóde predchádzalo. Možno aj vlastný postreh typu, ak som zvolil takúto hodnotu, už to nefungovalo. A to sú presne tie veci o ktoré ide. Naviac si priamo v prostredí IDE viem poznačiť riadok – prípadne zvýrazniť konkrétne slovo. Nie je nutné prepisovať, stačí PrtSc.

Keď som tento systém vytváral, určite som nepomýšľal na to, že budem vypisovať úplne všetko, to vôbec nie. Tento systém umožňuje rýchle a všestranné vytváranie poznámok.

6 Precvičovací systém Stupeň prevedenia 2 - postavené na PHP funkciách

practi$e v. 2

Rozsah PHP premenné, funkcie UI / Používateľské rozhranie HTML, CSS, globálne štýlovanie na úrovni témy

Prvá verzia practi$e spracovávala jednu tému a to konkrétne jeden zdroj informácií o programovacom jazyku C – všetko v jednom prenositeľnom adresári. Je to logické s ohľadom na to, že sa jednalo o jednu knihu. V druhej verzii practi$e - jednu tému je možné spracovávať vo viacerých adresároch.

Jadro systému a jeho riadiace prvky sú na rovnakej úrovni a téma sa spracováva vo viacerých samostatných pod adresároch. Predpokladajme tému – jazyk PHP. Ide o to, že môžeme – a máme – viacero zdrojov. Napríklad od autora A, od autora B a ďalších. Každý teda bude mať vlastný pod adresár. Ale spoločne budú pojednávať o rovnakých slovách jazyka PHP a tie sú v nadradenej úrovni adresárov. Tu sa prejavuje efektivita vkladaných slov. Môžeme pridávať nové poznámky, napr. konkrétny autor odporúča už nepoužívať a pod. Je to vhodné hlavne s ohľadom na vývoj jazyka, ako takého a na to, že medzi autorom A a autorom B, môže byť odstup aj niekoľko rokov. Informácia sa zobrazí rovnako v starých, aj v nových textoch – a aj pri všetkých autoroch. Dobrým príkladom sú aj samotné elementy jazyka HTML, kde ich je už dosť zastaralých, nahradených, nových a pod.

V tejto verzii 2 pribudlo v jadre okrem premenných a k funkciám aj trochu objektovo orientovaného programovania, čo nie je nič iné, len zoskupenie podobných funkcií pod jedno použitie. Vo výsledku prenositeľnosti, tu už neprenášam jedného autora, ale všetkých v danej téme. Posuňme sa k tretej verzii.

5 Precvičovací systém Prvý Stupeň prevedenia - postavené na PHP premenných

practi$e v. 1

Rozsah PHP premenné, funkcie UI / Používateľské rozhranie HTML, CSS, lokálne štýlovanie na úrovni témy

Vždy som si robil poznámky – - ukladal, triedil, zálohoval. Vysvetlená teória, praktická ukážka – kúsok tu, kúsok tam. Rôzne pohľady na jednu vec. Naskenované knihy, skriptá, dokumenty. Už som poznal HTML a aj PHP. Vedel som dokument na danú tému vyhľadať – www, ftp. Prevziať informácie v celku alebo stránky rozobrať a prevziať len to, čo je podstatné.

Informáciebolo treba zmysluplne poukladať. Tak som si povedal, že to urobím v duchu strojára. Správny strojár má veľa tabuliek – čo sú vlastne úhľadne zoradené konkrétne tabuľky dát. Nemusí však poznať ich obsah presne do posledného znaku. Čo je dôležité – má vedieť v ktorých tabuľkách danú informáciu nájde. A tu je presne analógia s databázami. Členenie od najvyššej úrovne po tú najnižšiu – najdetailnejšiu.

Rozhodol sa, že vytvorím vzorovú štruktúru pre opakované prvky – elementy a opakované použitie – celého bloku kódu. Povedané inými slovami – vytvorím jadro kódu a to budem kopírovať. Potom bude jedno akú tému budem spracovávať.

Premýšľal som, po čom siahnem – ako prvé. Do úvahy prichádzalo samo PHP až po Linux Documentation Project. Vybral som však Programovací jazyk C (1970+). O kúsok starší odo mňa. Takže sme spolu vyrastali a boli sme ďalej od jazykov – Fortran (1954) a COBOL (1959).

* Kniha Brian W. Kernigham and Denis M. Ritchie - The C Programming Language, 1978/1982/1988, alias K&R C

Otvoril som knihu a stránku po stránke som sa jazyk C učil - prekladal, riešil programy a zároveň som staval web na technológii PHP. Tieto knihy a im podobné – hlavne kolektívne. Majú veľa chýb – vhodných, vzácnych, aj zámerných chýb. A to je na nich to skvelé. Prenášaním informácií z knihy do vlastných stránok, som mal možnosť a nutnosť, každú chybu, program, tvrdenie, odskúšať, doplniť, do vysvetliť alebo opraviť. Vymyslieť a doplniť ďalšie programy na ukážku, doplniť obrázky, vlastné texty. Web stránka je na to ideálna, kedykoľvek, stačí len dopísať.

Takto od slova cez odstavec až po kapitolu som staval web stránku. Jedna kapitola – jedna web stránka. Pridal som hypertext   lokálny aj externe. Vytiahol som von slová jazyka, funkcie, dátové typy a mnohé ďalšie. Vznikali ucelené skupiny dát v externých súboroch. Technológia PHP mi ich za pomoci premenných – $ a funkcií, dovoľovala vkladať a opakovane používať, kde bolo treba. Nevkladal sa však iba obsah premennej ale aj ďalší tok informácií. Ak v texte nasledovalo slovo s významom – pomocou vnorenia PHP sa vložila funkcia nazvaná daným slovom – a tá vložila samotné slovo a ďalší kód. Na stránke sa to potom prejavilo tak, že nadídením kurzoru nad dané slovo, sa zobrazilo okno nad ním. V okne potom toto slovo bolo rozpracované ako manuál na použitie toho konkrétneho slova. Prečo takto? Pretože konkrétne slovo sa môže objaviť – a objaví sa – aj v iných miestach textu obohatené o ďalšie použitie, alebo súvislosti s inými dôležitými slovami. A tieto informácie sa potom zobrazujú všade tam, kde je slovo použité. Jednoduché a praktické. Je to ucelené filozofia. Prvky na pozadí sú rovnaké po celú štruktúru, editujú sa a pridávajú nové.

Čo sa tu vlastne deje pri používaní practi$e? Deje sa to, že učením sa novej témy – zároveň prebieha aj učenie, alebo precvičovanie na pozadí v kóde. Neustále doplňovanie kódu o nové slová, je zároveň neustále písanie a rozširovanie kódov v PHP, HTML a tiež aj v CSS. Takto vznikla prvá podoba systému practi$e. Preto som vybral názov z anglického slova practise - britský pravopisný tvar slovesa, ktorý znamená cvičiť, trénovať alebo uplatňovať niečo v praxi. A to sa tu deje. A to písmeno s premenené na $ priamo odvoláva na technológiu PHP. Jednoznačne jazyk PHP by mal ovládať každý technicky zdatný človek. Aj keby neovládal žiaden z programovacích jazykov.

4 Mix predchádzajúcich

práva dočasná

Typ záznamu Administrácia – Autentifikácia

Od localhostu k zabezpečeniu. Vaše webové stránky sú hotové. Na lokálnom počítači všetko funguje skvele. Ak však chcete zdieľať stránky so svetom – presuniete ich na webhosting pod vlastnú doménu. Tým získate prístup k dátam odkiaľkoľvek. Ak je váš obsah verejný, musíte sa oň starať. Návštevníci totiž očakávajú aktuálne informácie. Čo ak ale chcete, aby stránky zostali súkromné? V tom prípade musíte do kódu doplniť funkciu, ktorá obmedzí prístup verejnosti.

Riešením je takzvaná dočasná správa. Ide o administráciu, ktorá určuje, kto na web môže vstúpiť. Tejto kontrole podliehate vy aj bežný návštevník. Výraz dočasná vyjadruje, že platí iba po dobu strávenú na stránkach.

Pri klasickom riešení vytvoríte v databáze tabuľku. Do nej uložíte prístupové meno a hašované heslo. Na web pridáte prihlasovací formulár. Všetky ostatné podstránky zasa doplníte o kód, ktorý overuje prihlásenie pri prechode webom. Pre vlastné potreby netreba hneď programovať registráciu. Údaje stačí zapísať priamo do databázy. Vhodné je pridať už len tlačidlo na odhlásenie a chybovú stránku.

Základná administrácia má presné pravidlá. Musí spĺňať bezpečnostné predpoklady. To vám však nebráni experimentovať. Najčastejšou zraniteľnosťou je neošetrené vstupné pole. Sám som do formulára pridával skryté prvky. Tie mi prezradili, že sa niekto pokúša o neoprávnený vstup. Následne som zapojil fantáziu a hravosť. Ponúkol som útočníkovi viacero vstupných polí. Samotné prihlásenie sa nezmenilo. Vytvoril som však ilúziu zložitej autorizácie. Neželaný návštevník to rýchlo vzdal a dal stránke pokoj. Vyskúšal som aj techniku úplne bielej stránky. Prihlásenie bolo skryté za neviditeľný element na konkrétnom mieste. Kto však používa klávesové skratky, tento trik odhalí. Pozostatok týchto šibalstiev nájdete aj v spodnej časti tohto webu. Uhádnete, na čo kliknúť, aby sa vám zobrazil kontakt?

Trik s PHP bez databázy. Ak sa vám nechce kvôli autorizácii budovať databázu, spoľahnite sa čisto na PHP. Skombinujte prihlasovací formulár s prijímacou stránkou, ktorá overí správnosť údajov a následne povolí vstup. Toto je môj obľúbený trik. Do PHP kódu zvonku nikto nevidí, keďže sa spracováva priamo na serveri.

Prijímacia stránka má dve dôležité úlohy. Najskôr zistí, či prichádzajú očakávané dáta. Ak áno, posunie ich na vyhodnotenie. Správny používateľ nič nepostrehne a hneď pokračuje ďalej.

Nesprávneho návštevníka však filtre odhalia a zastavia ešte predtým, než vôbec začne overovanie hesla. Tento medzi krok výrazne zvyšuje bezpečnosť celého webu. Preto tento trik dôrazne odporúčam implementovať, aj keď používate klasické databázové riešenie.

3 Mix predchádzajúcich

práva prevzatá

Typ záznamu Externé zdroje - csv, editovateľné súbory

Keď sa pustíte do tvorby vlastnej webstránky alebo aplikácie, nemusíte všetky informácie pracne vymýšľať alebo od nuly manuálne prepisovať. Sme v štádiu, kedy už možno máte svoje prvé údaje prehľadne usporiadané vo vlastných premenných či databázach, no teraz nastáva moment, kedy by ste k nim radi pridali externé dáta. Teda tie, ktoré už niekde existujú a môžete ich poľahky prevziať.

Pre lepšiu predstavu som vybral vzorový príklad z verejnej dopravy. Chcete si napríklad vytvoriť vlastný prehľad spojov pre vašu trasu, ktorou denne cestujete. Výhodou je, že dizajn stránky plne prispôsobíte svojim potrebám a informácie o odchodoch máte kedykoľvek pri sebe, bez zbytočného vyhľadávania. Ako prvé vám napadne zapísať si názvy zastávok a časy odchodov manuálne do vlastných polí. Moja rada znie: touto cestou radšej nechoďte. Problémom je totiž trvanlivosť takýchto dát. Cestovné poriadky sa raz či dvakrát do roka menia, spoje sa rušia a časy posúvajú. Čakalo by vás naozaj obrovské množstvo úmorného prepisovania.

Situácia však nie je stratená, pretože poskytovatelia dát ich často ponúkajú v rôznych dostupných formátoch. Najpohodlnejším riešením je napojenie sa na ich API, vďaka čomu sa dáta na vašej stránke aktualizujú úplne samé. Veľmi často sa však stretnete s organizovanými súbormi typu CSV alebo Excel. Z nich môžete dáta čítať priamo, alebo ich hromadným príkazom transformovať do štruktúrovaných polí alebo databázových tabuliek, s ktorými už viete programovo pracovať. Dokonca aj zdanlivo nepraktický Excel sa dá rýchlo spracovať – stačí si dokument rozdeliť na menšie časti, očistiť ho od zbytočného balastu, vyexportovať ako čisté CSV a doplniť stĺpcom správne hlavičky. Najtvrdším orieškom býva formát PDF, no ak ide o pravidelné a opakujúce sa spoje – vlakové grafikony, prepíšete ich rýchlo.

Tento princíp spracovania externých prevzatých súborov funguje univerzálne. Úplne rovnako viete do svojho systému nasadiť pripravené kalendáre – mien a sviatkov, astronomické fázy mesiaca, prípadne zložitejšie štatistické alebo geografické údaje. Čokoľvek, čo vás zaujíma a je technicky možné z internetu vyťažiť. Predtým, než začnete písať samotný kód, si však dostupné súbory vždy dobre preskúmajte a navrhnite si ich automatické spracovanie tak, aby systém pracoval za vás. Toto bol teda môj špecifický pohľad a efektívny postup, tak to robím ja.

2 Tabuľkové zapisovanie - riadky a stĺpce

práva s obrázkami

Typ záznamu Tabuľky s pevnou štruktúrou

Prvú skupinu ukladania dát máme za sebou. Je na vás, či údaje zatiaľ necháte v lokálnych poliach, alebo ich zveríte databáze. Ak máte dáta dobre upratané, k tvorbe databázových tabuliek je to už len krok. Preľakli ste sa, že budete musieť všetko prepisovať ručne? Nemusíte sa báť, kód to spraví za vás.

Pred prácou s databázou stačí pochopiť štyri základné operácie: C.R.U.D. (vytvoriť, čítať, aktualizovať a vymazať). Keďže sme stále vo svete HTML a PHP, stačí si vytvoriť jednoduchý dokument, prepojiť vaše polia s databázovými príkazmi a dáta odošlete na jeden klik. PHP vám navyše umožní dáta pred odoslaním kontrolovať, overovať ich typ alebo opravovať chyby za pochodu. Ak si tento postup overovania osvojíte, položíte pevný základný – stavebný kameň a smer tam aj späť budete mať plne pod kontrolou.

Predstavte si, že databáza už funguje a poslušne si vymieňa čísla a texty. Čo však robiť, ak vaša stránka potrebuje obrázky, ikonky či grafiku? V základoch sa často používa trik: namiesto samotného obrázka sa do databázy uloží iba textová cesta k tomu, kde sa nachádza na disku.

Ja som však išiel inou, bleskovou cestou, kde databázu na obrázky vôbec nepotrebujem. Vytvoril som jednoduchú PHP funkciu, ktorú zavolám priamo v kóde stránky tam, kde chcem mať vizuál – konkrétny obrázok. Odovzdám jej iba názov súboru a popisný text. Funkcia sama vygeneruje správne HTML značky a postará sa aj o vizuálne okolie. Ak navyše dodržíte logické číselné označovanie súborov s pomlčkami, je to rýchle ako samotné písanie. Nemusíte neustále otvárať databázové prostredie, všetko manažujete priamo v textovom editore - IDE. Na záver jedna rada: ak rovnaký obrázok potrebujete neskôr v inej kapitole, radšej ho skopírujte pod novým názvom. Ak totiž na druhý deň nájdete lepší obrázok, prepíšete iba jeden konkrétny lokálny súbor a nezbúrate si vizuál v predchádzajúcich kapitolách. Úpravy sa tak pre vás stanú hračkou.

1 Znaky, čísla, texty - indexované zapisovanie

práva polí a zoznamov

Typ záznamu Štruktúrované zoznamy typu pole, typu list

Namiesto vymenúvania konkrétnych databáz a ich funkcií začneme inak. Pozrieme sa postupne na štyri skupiny ukladania dát – od najjednoduchšej po najkomplexnejšiu.

Databáza je organizovaný súbor štruktúrovaných údajov. Usporiadané a zoradené. Čo je však jej najmenším stavebným prvkom? Obyčajné slovo – konkrétne znak po znaku na ktorých postupne budujeme zoznamy.

Predstavte si, že si robíte poznámky z nejakého diela – knihy, ako jednoduché PHP a HTML. Knihu ešte nepoznáte, no počas čítania si na jedno miesto ukladáte názvy kapitol a na druhé kľúčové slová s ich významom. Týmto spôsobom za pochodu organizujete a štruktúrujete údaje. Neskôr pridáte úrovne nadpisov alebo rozdelíte kľúčové slová na dôležité a zaujímavé. Celá štruktúra vyplynie z textu sama.

Aby ste tieto dáta mohli v poznámkach zobraziť, vytvoríte si databázu bez databázy. Na začiatku projektu je to ten najlepší prístup. Z údajov vytvoríte obyčajné polia (v Pythone známe ako List). Pole je zoradený zoznam, ktorý má množstvo vlastností a skvelo reprezentuje databázovú tabuľku. Polia sa síce iba tvária ako databáza, no pracovať s nimi budete veľmi podobne.

Z týchto rozrastajúcich sa polí potom dáta jednoducho vyberáte. Potrebujete obsah? Vypíšete celé pole kapitol. Potrebujete nadpis stránky? Vytiahnete konkrétny prvok. Názov zapíšete iba raz a ak ho neskôr v poli zmeníte, upraví sa automaticky všade. Pri kľúčových slovách môžete ísť ešte ďalej – pomocou CSS im zmeníte farbu alebo pridáte vyskakovacie okno s vysvetlením. Ak neskôr zistíte, že vám nejaké dáta chýbajú, vďaka poliam ich iba jednoducho dopíšete do zoznamu.

O čo teda ide? Keď začínate s dátami, začnite s poľami. Pomôžu vám spoznať rozsah a typ vašich údajov. Keď sa štruktúra utrasie, máte hotový základ pre reálnu databázu. Tá však nie je vždy nutná. Ak pracujete v ohraničenom priestore (napr. jeden web) a dát nie je veľa, polia plne postačia. Bez problémov zvládnu aj 5 000 záznamov a navyše vám zabezpečia skvelú prenositeľnosť kódu do iných projektov.