Náš blog

Často dnes vidíme tristný obraz detí, ako v tmavom kútiku v žiari displeja svojho mobilu, tabletu alebo počítača presedia celé hodiny a bavia sa na príbehoch svojich reálnych či virtuálnych kamarátov vo fiktívnych svetoch. Až sa zdá, že počítačové hry a multimédiá sú pre deti príťažlivejšie než čokoľvek iné. Prečo sa to deje? Podľa vedeckých výskumov sme to my sami, kto vedome či nevedome už v útlom veku, učíme deti spracovávať informácie odlišným spôsobom ako celé generácie pred nami. Silné podnety a rýchle tempo vnemov z elektronických médií povzbudzujú v mozgu vylučovanie hormónu odmeny dopamínu, a tým ovplyvňujú jeho kognitívne funkcie. Človek má sklony tieto zážitky opakovať, vyhľadávať nové a silnejšie podnety, čím sa roztáča "dopamínová špirála". V súčasnosti sa s týmto problémom borí množstvo rodičov a vychovávateľov. Ak chceme, aby naše deti urobili aj niečo vo svoj prospech a svoju budúcnosť, potrebujeme tieto silné podnety najprv "prebiť", a tak si získať ich pozornosť. Potom by sme však mali postupne zjemňovať ,,nátlak” a cibriť výdrž a vnímavosť.  Ponúkam vám niekoľko inšpirácií, ktoré majú potenciál deti zaujať a zabaviť – bez toho aby prehlbovali svoju závislosť na médiách. Naopak, získajú radosť, zvýšia kontakt s rovesníkmi, vycibria si vnímavosť aj pohybové zručnosti. Efektívne tiež znížia závislosť na lacných náhradách zo sveta zábavného priemyslu. [Image] 1. Dajte krídla kreativiteDnes je trendom konzumácia obsahu. Podobne ako pri jedení aj tu to môžeme uchopiť z opačnej strany a "uvariť si" niečo vlastné. Vďaka všadeprítomným technológiám máme veľa možností.  Nakrútiť mobilom vlastný krátky hraný, animovaný, prírodopisný film či televíznu reportáž? Na spracovanie materiálu a tvorbu hudby môžeme využiť voľne dostupné aplikácie v online obchodoch. Podobne vieme vyrobiť hudbu (napr. Chrome Music Lab) a ako bonus aj plagát na premiéru (Office), prípadne aj s vlastnoručne kreslenou grafikou (napr. Photopea). Môžeme tiež natočiť aj veselé video (s pokazenými zábermi) o tom, ako to celé vznikalo. A máme ideálny príspevok do rodinnej videotéky! 2. StavebniceStavebnice sú ideálny prostriedok na konštruktívnu hru a experimenty. Sú navrhnuté tak, že rešpektujú intelektuálne a fyzické schopnosti detí v jednotlivých vekových kategóriách. Napríklad elektronická stavebnica Boffin, v ktorej si aj menšie deti bez potreby mobilu či počítača bezpečne postavia zábavné elektrické obvody.  Veľmi vhodné sú stavebnice Lego Technic s názornými ozubenými prevodmi a ďalšími súčiastkami, ktoré demonštrujú mechanické princípy.  Ak sa vám zdajú tieto stavebnice pridrahé, skúste niektorú z online Lego požičovní, ktoré sa začínajú vynárať aj u nás. Vrcholom tejto skupiny je robotická stavebnica Mindstorms, ktorá okrem lego dielikov obsahuje aj senzory a riadiacu jednotku. S použitím vhodného kurzu vovedie vás i vaše deti do sveta robotiky. [Image] 3. Výzva: Naučte ich programovaťVyššia úroveň používania digitálnych technológií je naučiť sa ich ovládnuť ich cez programovanie. Nie je až také náročné začať, ak viete, za ktorý koniec to chytiť. Deti na kurzoch a v letných denných táboroch, ktoré organizujeme v Learn2Code, nás presviedčajú o tom, že keď sú správne motivované a pod dohľadom skúseného inštruktora, základy programovania zvládne každé z nich. Mnoho vecí sa však dnešní tínedžeri učia z video návodov. A nie je to náhoda. Video návod môže do veľkej miery osobný sprievod inštruktora nahradiť. Prvé experimenty môžu začať v Scratchi, pokračovať vlastnými mobilnými appkami v AppInventore alebo grafickými skicami v javascriptovom prostredí P5.js. 4. Meranie síl s rovesníkmiAj na Slovensku existuje množstvo súťaží pre deti, v ktorých si môžu merať sily s rovesníkmi. Výnimka nie je ani informatika. Ak vášho potomka zaujímajú hry a programovanie, môže vyskúšať súťaž v tvorbe hier Galaxiáda. Jej druhý ročník práve prebieha. 5. Doprajte pohyb celému teluKaždé dieťa, či už programátorské alebo nie, uvíta chvíľu veselého pohybu! Neveríte? V sprievode zábavnej počítačovej hry Stepmania prekoná(te) detskú lenivosť. Princíp hry spočíva v tom, že dotykom nôh po podložke za sprievodu populárnej hudby "zostreľujete" rýchle ubiehajúce šípky. Stepmania je k dispozícií zadarmo. Jediné, čo k nej potrebujeme, sú ovládače Dance Pad, ktoré sa však dajú v domácich či zahraničných internetových obchodoch kúpiť už od 10 eur za kus. Hra obsahuje niekoľko herných režimov, dá sa hrať samostatne, ale zábavnejšia je vo dvojici (potrebujete dve podložky), či dokonca na turnaji. (Na ten si účastníci nosia svoje vlastné podložky.) Vďaka týmto aktivitám vy a vaše deti zažijete radosť a pocit zmysluplného využitia času a moderných technológií v prospech spolupatričnosti a vnímavosti. Zároveň povzbudíte ich zdravú sebadôveru a získavanie takých zručností, ktoré určite využijú v budúcnosti. Autorom článku je Marián Staňo Marián je absolvent učiteľstva matematiky a informatiky na FMFI UK (2001). Od začiatku štúdia sa venoval experimentálnemu vyučovaniu informatiky na ZŠ a neskôr v škole pre deti so všeobecným intelektovým nadaním (ZŠ Košická Bratislava, Škola pre mimoriadne nadané deti a gymnázium v Bratislave, Inštruktor Letného denného tábora FMFI UK). Má dvadsaťročnú prax vo vzdelávaní detí ako lektor a autor vzdelávacích materiálov. Má rovnako skúsenosť ako facilitátor arteterapeutických skupín dospelých a hľadá prieniky medzi animovanou tvorbou a technológiami.

Tak. Rozhodol si sa naučiť programovať (na Skillmea si správne!). Je jedno, či chceš byť Web Developer (FrontEnd, BackEnd), chceš sa vzdelávať v konkrétnom jazyku (PHP, JavaScript, Java, C#), alebo si sa ešte nerozhodol, a chceš sa len naučiť programovať. Aj keď kniha má svoje čaro, môžeš ju čítať aj elektronicky, s videom to však ide najrýchlejšie. Tvoji rodičia si pri pohľade na Teba možno myslia, že mrháš časom, Ty však vieš, že investuješ do seba. Správne! Nad kurzami môžeš stráviť dlhé hodiny. Niektoré z nich majú aj viac modulov. Každý má však aj svoj koniec. Zámer autora kurzu predsa nebol získať sledovanosť pre jeho videá, ale chcel ťa niečo naučiť. Možno si sa už ocitol v tom začarovanom kruhu, kedy po ukončení jedného kurzu hľadáš hneď ďalší, ktorý ťa posunie na vyššiu úroveň. A potom ďalší a ďalší.. Na vyššiu úroveň však už tutoriály a prepisovanie kódu z obrazovky nestačí. Ani jednoduché zadania lektorov z video kurzov nie sú postačujúce. Na vyššiu úroveň treba prax, treba tvoriť, pracovať na projektoch, vytvárať portfólio. [Ak sa chceš naozaj posunúť v programovaní vpred, pusti sa do zaujímavého projektu.] Portfólio programátoraV zaujímavom CV nemusí byť veľa projektov. Ten, kto ho bude čítať vie, či Tvoje portfólio obsahuje zaujímavé projekty, kde si sa stretol s nejakými výzvami. Pri absolvovaní kurzov si možno vytvoril jednoduchú aplikáciu na správu poznámok v Markdown formáte. Alebo sociálnu sieť, Twitter podľa tvojej chuti. Všetko sú to však projekty, ktoré každý pozná a vie, že nájdeš kopec zdrojov ako takúto aplikáciu napísať a tvorba takéhoto projektu bola len akýmsi light fitness pre tvoju hlavu. Najdôležitejšie na tom však je, že tie projekty nie sú tvoje. Tvoj projekt predsa začína prázdnym priečinkom, možno vytvorením index.html súboru, pokračuje nekonečným Google hľadaním riešení tvojich front-end alebo back-end problémov, implementáciami tvojich vylepšení, tvojich riešení, testov a refactoringu tvojho kódu. V repozitári vidieť, ako dlho si na projekte pracoval a ako sa projekt vyvíjal. [Pri práci na projektoch nestojíš na jednom mieste, ale tvoríš, učíš sa a rastieš.] Na čom teda začať makať?Každý programátor si dobré nápady na aplikácie chráni. Návšteva programátorského fóra s otázkou typu “Nemáte náhodou nápad na nejaký zaujímavý projekt?” bude skôr cieľom posmechu ako zdrojom nápadov pre tvoje projekty. Nezúfaj, mám pre Teba niekoľko rád ako svoj mozog nenechať oddychovať príliš dlho. Projekty som nevymyslel sám, väčšinou sú to projekty inšpirované existujúcimi aplikáciami, alebo všeobecne známe zadania. Pridal som k nim však aj odkazy na dokumentáciu, aby si netrávil čas hľadaním kde a ako začať. Niektoré projekty možno nekorešpondujú s tvojou ideovou predstavou a môžu byť menej zaujímavé, keď sa však rozhodneš na ňom pracovať získaš hneď niekoľko výhod: • Nestojíš na jednom mieste, ale tvoríš, učíš sa, rastieš, • stretávaš sa s problémami (ver mi, bude ich čím ďalej tým menej), na ktoré hľadáš riešenia, • objavuješ nové spôsoby riešenia problémov, tvoje staré riešenia už nestačia, alebo sú neefektívne. Level 1 - jednoduché projektyLunch picker • Takáto appka už existuje, ale urob vlastnú verziu. Podstata je, že vždy keď sa nevieš rozhodnúť, kam s kamošmi pôjdeš na pivo, nechaj to na výpočtovú silu. • Zadanie môže mať dve úrovne: Prvá úroveň je, že databázu miest na "zábavu" si vytvoríš sám a appka náhodne vyberie niektorú z nich. Druhá úroveň by bola, ak použiješ niektoré existujúce API (Google Reviews), ktoré ťa vie lokalizovať a databázu získaš odtiaľ. Collection tracker • Publikuj svoju zbierku "čohokoľvek" vo forme katalógu. Premysli štruktúru kažej položky, skús ich kategorizovať, implementovať vyhľadávanie. Jednoduchý projektík o niečom, čo ťa skutočne baví. • Zadanie môže mať dve úrovne: Prvá vo forme jednoduchej MVC aplikácie s Bootstrapom, napísaná v Laraveli alebo RubyOnRails. Väčší skiller si môže trúfnuť navrhnúť API a dizajn implementovať v niektorej JS library - VueJS, React.  Spoiler blocker pre clanky • Poznáš to - píšeš recenziu niektorého obľúbeného filmu alebo knihy a nechceš čitateľa tvojho textu nepríjemne prekvapiť vyzradením deja, alebo kľúčovej informácie. Podobne ako fungujú "Zobraziť viac" odkazy, môžeš takúto informáciu ukryť aj pod "Spoiler alert" odkaz. Spoiler v texte môžeš oddeliť pomocou data atribútu pre tvoj <p> element: <p data-spoiler="true">Spoiler text...</p>. • Zadanie môže mať dve úrovne: Prvá vo forme jednoduchého inline javascriptu, ktorý spustíš niekde na konci svojho textu pomocou <script> tagu. Druhá úroveň vo forme malej knižnice s využitím Module Pattern, ktorú môže použiť vo svojom Wordpresse ktokoľvek. Tax forecaster • Aj keď politici sa nás snažia presvedčiť, že si zaslúžime istoty, jedinou istotou v živote sú dane. Navrhni nejakú jednoduchú appku, ktorá bude zbierať sumy tvojich freelance faktúr na základe vzorca, ktorý zistíš online (a naučíš sa pritom aj prečo platíš toľko na daniach). • Zadanie môže mať dve úrovne: Prvá úroveň je samotný jednoduchý výpočet - zadáš číslo a dostaneš hodnotu, ktorú zaplatíš štátu. Druhou úrovňou môže byť databáza s históriou tvojich FA a implementácia grafov, kde môžeš s pomocou knižnice D3.js vykresliť pekné reporty, koľko si zarobil a ako sa tvoj zárobok vyvíjal. Ak ťa vystrašila dokumentácia D3.js, môžeš sa skúsiť pohrabať v knižniciach, ktoré používanie D3js zjednodušujú. FlashCard generator • Ak si v štádiu učenia sa (čo by si mal byť neustále) a snažíš sa zapamätať si niektoré dôležité informácie, koncepty alebo čokoľvek, osvedčená technika pamätania si vecí sú FlashCards. Navrhni appku, ktorá si z databázy, alebo JSON objektu vyberie pole dvojíc, kde prvým prvkom dvojice bude nejaký stručný popis a druhým prvkom bude informácia, ktorú si máš zapamätať. Tu je inšpirácia. • Zadanie môže mať dve úrovne: Prvou je implementácia, akú použili v ThoughtBot - teda informácia, ktorú sa snažíš naučiť sa len objaví pod heslom. Druhou úrovňou môže byť využitie CSS na zaujímavú animáciu, aby to vizuálne vypadalo ako ozajstné "otočenie karty". Level 2 - stredne náročné projektyBring your umbrella • Ak nestíhaš ráno sledovať počasie, automatizuj to. Napíš appku (najviac sa asi hodí mobilná appka, ale užitočná môže byť aj webová aplikácia), ktorá ťa lokalizuje a s využitím API ti pripomenie, aby si si nezabudol zobrať zo sebou dáždnik - v okolí tvojej lokality bude totiž pršať. Webová appka ti môže poslať e-mail notifikáciu. • Zadanie môže mať dve úrovne: Prvou môže byť aplikácia bez grafického rozhrania. Druhou môže byť plnohodnotná weather appka prispôsobená tvojim potrebám a grafickým nárokom. Music suggestion app • Spotify má tiež svoje API. To môžeš použiť na vytvorenie zoznamu skladieb, ktorý budeš tvoriť na základe počúvaných skladieb, ich žánru a iných dostupných dát. Takto získaš dáta o skladbe, ktorú používateľ práve počúva. Tu je dokumentácia, ako pracovať s playlistom. Expense tracker • Vo forme mobilnej appky alebo webovej aplikácie môžeš vytvoriť aj svoj tracker príjmov a výdavkov. Ich kategorizácia a kreslenie grafov by malo byť samozrejmosťou. Ak sa ti podarí vyriešiť problém manuálneho zadávania bločkov, daj mi vedieť - do takej aplikácie rád zainvestujem. V Datamolino už vedia ako na to. • Najväčšou challenge pri tomto projekte je asi UI/UX - aplikácia by sa mohla učiť moje zvyky a inteligentne mi podsúvať dáta (kategorizáciu, tagy) podľa histórie mojich nákupov pri vytváraní jednotlivých položiek. Na základe týchto tagov a kategórií mi oznámiť, kde by som mohol nabudúce ušetriť.  Downtime tracker • Ak máš obľúbený web, alebo plánuješ niekoľko svojich projektov, môžeš testovať, či náhodou tvoje aplikácie nemajú nejaký problém. Jednoduchým scriptom pristúpiš na URL svojej aplikácie a ak skript nevráti HTTP Response 200, tak ťa tracker notifikuje emailom, že sa niečo deje. • Zadanie môže mať dve úrovne: Prvou úrovňou môže byť notifikácia emailom. Druhou úrovňou môže byť notifikácia pomocou SMS brány (Twilio), alebo web hook do tvojho Slacku - ak používaš slack. Level 3 - náročnejšie projektySlack bot • Ak poznáš Slack a inšpiruje ťa automatizácia, programovanie botov je teraz in. Niektoré vývojárske tímy denne absolvujú "standup" - odpovedia na jednoduché otázky týkajúce sa aktuálneho projektu/zadania (na čom pracujú, v akom sú štádiu, či sa na niečom zdržali a podobne). S pomocou Slack API môžeš vytvoriť jednoduchého bota, ktorý kontaktuje vývojárov z tvojho teamu a opýta sa ich zopár otázok. Ich odpovede môžeš zozbierať a vyhodnotiť v jednej správe, ktorú odošleš do #dev kanála.  Microlearning app • Denne by si mal venovať nejaký čas svojmu vzdelávaniu - aby si ako programátor rástol. Ak sa účíš napríklad React, alebo VueJS - môžeš skúsiť použiť (alebo napísať vlastný) web scrapper a získať tak jednotlivé sekcie dokumentácie. Denne ti tvoja microlearning aplikácia môže poslať jednu sekciu/stránku z tejto dokumentácie e-mailom na štúdium. Web scraper • Nájdi svoj obľúbený e-shop a skús vytvoriť vlastnú databázu jeho produktov, kategórií spolu s obrázkami. Web scraping je zaujímavou a nie jednoduchou témou pre programátorov, pretože ku každému webu, ktorý chceme scrapovať musíme pristupovať individuálne. • Hint: Pred tým, ako sa pustíš do scrapovania niektorej domény, skontroluj v nazov-domeny.sk/robots.txt, či náhodou doména nemá blokovaných niektorých botov. Quiz Maker • Ak sa nudíš, môžeš prispieť aj k efektivite nášho školstva. Keď som učil ja, učitelia používali Hot Potatoes ako ich testovaciu platformu. Alebo vytlačené testy s kolonkami. Vstupom do tvojej quiz platformy môže byť JSON, ktorý bude obsahovať vhodne zvolenú štruktúru testovacích otázok, možných odpovedí a označenia správnej odpovede. • Zadanie môže mať tri úrovne: Prvou môže byť vygenerovanie testu z holého .json súboru. Druhou môže byť vytvorenie adminstračného rozhrania, kde si testujúci otázky a možné odpovede vykliká vo formulári. Treťou úrovňou môže byť implementácia rôzneho typu testovacej otázky (jedna správna odpoveď, viac správnych odpovedí, dopísanie správnej odpovede, zoradenie do správneho poradia, vytvorenie správnych párov, ...) Browser extension • Naštuduj si ako pracujú browser pluginy a zvýš svoju produktivitu blogovaním distraktorov. Inšpiráciou ti môže byť BlockSite - výborný extension na blokovanie stránok. • Blokovanie stránok však nemusí byť jediný tip na doplnok do prehliadača. Doplnky sú fajn na zvýšenie produktivity, teda rôzne poznámkové doplnky, časovače (pomodoro), vytvorenie snímky z aktuálnej stránky a všeličo možné. Programátorské výzvy - algoritmické úlohyAk nehľadáš nápad na projekt, ale radšej by si sa zdokonalil v riešení algoritmických úloh, mám tu niečo aj pre Teba: 1. Advent of code • Adventný kalendár programátora (každý rok obsahuje nové zadania). Obsahuje 25 zadaní orientovaných na precvičovanie algoritmického myslenia. Ideálne na raňajšie prebudenie mozgu, niektoré úlohy však môžu zabrať viac času. Súčasťou je aj leaderboard, tam sa ja radšej ale nepozerám. • Zadania môžeš riešiť v ktoromkoľvek jazyku 2. Project Euler • Podobne ako Advent of Code, aj toto je zbierka zadaní, ktoré sú však už len archívom. To však neznamená, že neobsahuje dostatok zadaní - je ich tam takmer 650. Pri každom zadaní je uvedený aj počet ľudí, ktorí zadanie vyriešili. • Zadania môžeš riešiť v ktoromkoľvek jazyku 3. Daily Coding Problem • Toto je mailinglist, ktorý ti každý deň pošle jeden programátorský problém, ktorý môžeš rozlúsknuť. Problémy z tejto banky pochádzajú z pracovných pohovorov vo firmách, ako sú Google, AirBnB, Facebook, Apple a rôzne iné. Ich obtiažnosť je preto niekedy dosť vysoká. Ak sa ale pripravuješ na pracovný pohovor, tieto úlohy ti môžu pomôcť. • Nevýhodou je, že k riešeniam sa dostaneš až ak si ich predplatíš. Aby sme to zhrnuli. Hodnota každého programátora sa ukrýva v jeho portfóliu. Sú to práve tvoje vlastné projekty, ktoré ťa budú reprezentovať na pohovore, ktoré ťa odlíšia od konkurencie. V článku sme ti poskytli tipy na zaujímavé projekty, ktoré obohatia tvoje CV, ale predovšetkým posunú ťa ďalej, postavia pred nové výzvy a prekážky. A to ako dobrý programátor určite potrebuješ.

JPA je java persistence api špecifikácia. Na to, aby si mohol používať JPA v skutočnej aplikácii, potrebuješ implementáciu JPA. Buď použiješ servery, ktoré už ponúkajú implementáciu JPA, ako napríklad GlassFish, alebo použiješ implementáciu, ktorú ti poskytuje framework Hibernate alebo EclipseLink. Ak používame JPA štandardy, tak je v budúcnosti úplne jedno, akú implementáciu JPA budeme používať. Pri programovaní budeme používať JPA anotácie, ktoré pochádzajú z balíka javax.persistence. V budúcnosti môžeš nasadiť aplikáciu na GlassFish, ktorý pozná javax.persistence a vie s tým pracovať alebo na Tomcat s použitím Hibernate, ktorý tiež pozná javax.persistence a vie s tým pracovať.  Čo je Persistence?Ak vytvoríš hocijaký jednoduchý objekt, čo sa stane? Napríklad objekt Adresa? Vytvorí sa v halde – v pamäti. Objekt môže mať nasetované nejaké dáta – informácie. Ak sa ale stratí referencia v javovskom kóde na tento objekt v halde – tak sa zmaže.  Ak si chceme uchovať tieto informácie, tak ich môžeme uložiť do databázy a najlepšie, aby po vytiahnutí z databázy mali tieto dáta tú istú formu – teda formu objektu Adresa.  Tomuto sa hovorí, že persistujeme (uchováme stálosť) objekt do databázy. Akoby tento objekt existoval aj mimo java programu. Tento objekt sa uchová v úložisku a znovu sa vytvorí, ak bude treba.  Čo je ORM?Klasické databázy ako Oracle, MySql a podobne sú relačné databázy, ktoré majú dáta uložené vo forme tabuliek. V jave ukladáme dáta vo forme objektov, v databáze vo forme tabuliek. Ale čo majú podobné? V relačnej databáze máme stĺpce, ktoré majú názvy a v riadkoch máme hodnoty. Niečo ako klúč hodnota – to isté platí aj pre objekty v jave – tam máme názov premennej a hodnotu v nej uloženú.  Tu prichádza pod ruku ORM – teda object relational mapping. Je to niečo ako objektovo relačné mapovanie. My naše java objekty namapujeme na tabuľky relačnej databázy. Aby sme vedeli, že tento field v javovskom objekte patrí do tohto stĺpca.   Objekty v jave sú medzi sebou prepojené pomocou uloženia referencie na daný objekt. Napríklad človek má field Adresa, kde je uložená referencia na objekt Adresa.  Relačné tabuľky majú medzi sebou tiež väzby. Buď máme v tabuľke pre človeka stĺpec adresa, kde bude uložený identifikátor adresy a na základe tohto identifikátora nájdeme danú adresu. Alebo existuje špeciálna tabuľka, kde budú dva stĺpce jeden pre identifikátor adresy a druhý pre identifikátor človeka. My potom vieme nájsť, aké adresy má človek nastavené, alebo pre akého človeka je nastavená daná adresa.[Image] Problém s JDBC prístupom – výhoda ORMV kurze Java pre pokročilých, ak si tento kurz videl, sme si ukazovali prístup k databáze cez JDBC. Čo sme spravili? Otvorili sme konekciu na databázu, napísali sme sql príkaz, ktorý sme následne poslali do databázy na vykonanie. Databáza nám vrátila výsledok vo forme result setu.  Predstav si, že máš len 5 až 10 tabuliek. Nad každou tabuľkou máš napríklad 4 rôzne sql príkazy – to máme približne 20 – 40 sql príkazov. Ak sa ti stane, že musíš zmeniť databázu – napríklad zmeníš názov stĺpca v tabuľke? Čo musíš spraviť? Musíš prepísať názov tohto stĺpcu na xy miestach – na 20 až 40 miestach – a to sme len v malej aplikácii – čo ak by to bolo na 100 miestach?.  Bol by v tom neporiadok a mohli by nastať problémy.  Ak ale použijeme ORM, tak v jave pracujeme s naším kódom, tak ako bežne. Vytvoríme si objekty typu Clovek, nastavíme mu nejaké hodnoty. Ďalej si vytvoríme kolekciu Adries pre daného človeka. Nakoniec v ORM frameworku povieme len persistni mi tento objekt. ORM sa potom postará o všetko uloženie týchto objektov do databázy na základe mapovania, ktoré mu poskytneme.  Clovek clovek = new Clovek(); clovek.setMeno("Jaro"); clovek.setPriezvisko("Beno"); Adresa adresa1 = new Adresa(); adresa1.setUlica("Nejaka 5"); adresa1.setPSC("94404"); Adresa adresa2 = new Adresa(); adresa2 = new Adresa(); adresa2.setUlica("Nejaka 5"); adresa2.setPSC("94404"); List<Adresa> adresaList = Arrays.asList(adresa1, adresa2); clovek.setAdresaList(adresaList); orm.persist(clovek); Ak by sme nepoužili ORM, sami by sme museli napísať metódu, ktorá nám otvorí konekciu na databázu, museli by sme napísať INSERT SQL príkaz pre človeka a potom aj pre jeho adresy a museli by sme zabezpečiť, aby sme nastavili všade dáta tam kde majú byť a musíme sa postarať aj o prepojenia medzi týmito dvoma objektami.  Ak ale použijeme ORM, tak sa nemusíme starať o tento balast kódu, ale sústrediť sa najmä na to, čo predáva a to je business logika aplikácie.  Nevýhody JDBC prístupu sú teda, že máme príliš veľa SQL príkazov, veľmi veľa kópie kódu, ručne sa musíme postarať o nastavenie dát do správnych stĺpcov.  Výhodou ORM je, že nemusíme robiť tieto veci z predchádzajúcej vety. ORM nám umožní používať java objekty na reprezentáciu relačnej databázy. ORM sa nám postará aj o prepojenie závislostí. ORM spojí výhody relačnej databázy a objektového modelu v jave plus schová všetku komplexitu SQL príkazov.  Čo je Hibernate? Hibernate je ORM – object relational mapping framework, ktorý slúži na mapovanie java objektov na tabuľky relačných databáz.  Java programátori sú zvyknutí písať kód v objektoch, prečo teda potrebujú ďalší jazyk – sql – na získanie dát z databázy? Hibernate na pozadí sám vytvára sql príkazy nad databázou a preto nemusíme písať sql príkazy my.  Ak chceme uložiť mapu objektov, napríklad Cloveka, ktorý ma Adresu, alebo aj viac objektov typu Adries, tak nemusíme písať všetky sql príkazy. Stačí, ak zavoláme jednoduchú metódu na uloženie objektu do databázy a hibernate sa postará o zvyšok.  Hibernate je aj implementácia JPA. [Image] Čo je JPA?Skratka JPA je Java Persistence API. Čo to znamená? V jednoduchosti povedané – je to štandard. Trošku zložitejšie povedané – je to špecifikácia pre OR mapovanie a je súčasťou Java EE, ale môžeme ju používať aj v Java SE projektoch.  Niektoré servery poskytujú vlastnú implementáciu JPA a niektoré nie – v tom prípade použijeme napríklad Hibernate implementáciu.  Predstav si, že celý tvoj kód používa veci z JPA. Teraz je na tebe, kam nasadíš svoju aplikáciu. Ak ju nasadíš na Glassfish nemusíš prerábať svoj kód, ktorý používa JPA – Glassfish ho pozná. Ak svoju aplikáciu nasadíš na Tomcat, tak mu prihodíš Hibernate, ktorý tiež pozná JPA. Potom tvoj kód bude fungovať všade – lebo používa štandardy JPA.  Je možné aby sme používali len Hibernate – teda by sme nepoužívali nič zo štandardov. Žiadne anotácie z javax.persistence a podobne – to ale neodporúčam.  Pýtal som saNapadlo mi, že by nebolo od veci spýtať sa kolegov developerov, čo si myslia o JPA a Hibernate. Ak by si si chcel prečítať ich názory, nech sa páči – bez cenzúry, citujem:  Tak toto je náročná téma a navyše zložitá.  JPA resp. ORM všeobecne (a teda aj Hibernate) sú vždy zložitejšie, než si používatelia (t.j. vývojári) uvedomujú. Výsledkom sú často nenápadné chybičky, lazy load exceptions, ktoré vedú k anti-patternom ako je OSIV (open session in view) alebo k výkonovým problémom (n+1 problem).  Týchto problémov je typicky o to viacej, o čo zložitejšie je mapovanie – a pritom práve na riešenie zložitého mapovania bolo ORM vymyslené. Aby sme mohli namapovať doménu do DB. Na to, sa často používajú aj “mimojazykové” triky ako reflection na private polia, takže objekty sú implicitne zviazané s ORM riešením, aj keď napr. mapovanie je oddelené do XML namiesto anotácii, čo samo o sebe je tiež nepraktické.  Okrem toho majú obe hlavne implementácie dosť bugov na to, aby na ne človek narazil, aj keď postupuje v súlade so špecifikáciou – stačí len chcieť trosku viacej a na nejaký bug určite narazíte. Takže potom to je kľučkovanie medzi bugmi a často komplikovaná možnosť vymeniť ORM providera.  Čo sa mi na ORM páči je lepšie mapovanie typov, možnosť customizovať mapovanie a podobne. Preto používam JPA aj na jednoduché mapovačky namiesto JDBC.  Navyše s JPA používam rad Querydsl, ktoré je lepšie/intuitívnejšie, než JPA štandardné Criteria API.  Hibernate používam dlho ale pravdu povediac nikdy som sa veľmi nezamýšľal nad výhodami. Zatiaľ som nemal výraznejší problém, ktorý by som nevedel vyriešiť, prípadne nejako obísť.  Plusy:  - ľahko sa robí mapovanie do DB s anotáciami aj pre začiatočníka bez veľkých znalostí databázy, zároveň ale bez znalosti DB môže byť mapovanie neefektívne  - je open source, takže ak potrebujem, viem pozrieť zdrojáky ako funguje  Mínus:  - asociácia OneToOne fetch=lazy nefunguje  Na používaní Hibernate/JPA (celkovo ORM vrstve) sa mi páči:  A) Abstrakcia od fyzického dátového modelu. Vývoj nad doménovým/logickým (entitno-relačným dátovým modelom) - bližšie k biznis vrstve. Čiže zjednodušené práca s objektami namiesto tabuliek.  B) Možnosť využívať rôzne pokročilejšie techniky získavania dát (napr. Spring Data JPA, ale aj zjednodušujúce Hibernate Query by example)  C) Agnostické od konkrétnej databázovej technológie (Oracle, MySql, ...)  D) Cachovanie a optimalizácia (napr. lazy loading)     Nevýhody:  A) Niekedy náročný (až nemožný) performance tuning.  B) Pri niektorých technológiách pomalšia krivka učenia.  C) Aj napriek používaniu JPA/Hibernate, je takmer nevyhnutné, aby developer poznal aj (native) SQL jazyk a jeho použitie.  ZáverPodarilo sa ti nazrieť do problematiky objektovo relačného prístupu k databáze a pochopil si, čo to znamená. Ak sa však chceš dostať ešte o level ďalej, pripravili sme pre teba samostatný kurz Java persistence – JPA a Hibernate. Ak chceš ešte viac, tak klikaj:👍 Viac o mne: http://www.jaroslavbeno.sk/  👍 Kurzy (java, git, maven, bootstrap, Asp .Net,): Learn2Code moje kurzy 👍 Free kurzy: YouTube kanál JaroslavBeno

Žiaci základných škôl a prvého stupňa 8-ročných gymnázií si môžu zmerať sily na jednej z najatraktívnejších slovenských súťaží. Schopnosť vymýšľať algoritmy a naprogramovať počítačovú hru dá vášmu dieťaťu viac ako len nové zručnosti a vedomosti. ,,Programovanie zlepšuje kritické myslenie dieťaťa. Aj keď sa z neho v budúcnosti nestane IT odborník, zručnosti nadobudnuté programovaním využije v práci ako aj v praktickom živote,“ hovorí Marián Kristeľ z Learn2Code, spoluautor súťaže Galaxiáda. Galaxiáda sa skladá z dvoch kategóriíTvorba hier je súťaž v tvorbe počítačových hier, ktoré vytvorí žiak jednotlivo alebo v tíme. Táto kategória je určená pre žiakov 2. stupňa základných škôl a prvých 4 ročníkov 8-ročných gymnázií. Hry môžu byť vytvorené v ľubovoľnom vývojárskom prostredí ako Scratch, JavaScript, Unity3D, Game Maker, Python. Žiaci môžu svoju hru prihlásiť na webe do 14. apríla 2019, následne bude prebiehať verejné i odborné hlasovanie.[Image]  Kategória Programovanie v GalaxyCodr sa skladá z dvoch kôl. V prvom kole (ktoré sa uskutoční 20. marca 2019) budú žiaci súťažiť v desiatich programovacích úrovniach hry GalaxyCodr priamo na pôde vlastnej školy. Do druhého kola sa prebojuje dvadsať najlepších z celého Slovenska, ktorí najrýchlejšie vyriešia jednotlivé zadania.[Image]  Metodik a učiteľ Ľuboš Jaroš vidí prínos Galaxiády v tom, že súťaž nabáda deti, aby splnili nielen didaktické ciele, ale si aj vyskúšali riešiť nepovinné bonusové úrovne. Program Galaxycodr tak v prvom rade vzbudzuje v deťoch pocit, že sa ,,len“ hrajú hru. ,,Táto hra je útok na mozog, “ aj tak prejavili nadšenie deti, s ktorými sa GalaxyCodr venuje dlhodobejšie. ,,Oceňujú vizuálnu atraktívnosť prostredia a to, že samotné programovanie úloh je prezentované ako zábava,” pokračuje Jaroš.  Autori najlepších projektov a najrýchlejší riešitelia úloh v GalaxyCodr získajú digitálne vybavenie pre seba a pre školy a čaká na nich zaujímavý sprievodný program na slávnostnom vyhlásení výsledkov v máji v Žiline. Všetky ďalšie informácie nájdete na našom webe: www.galaxiada.sk

Rád si v detstve všetko rozoberal, špekuloval a škodoradosť hrala v divadle tvojich ranných emócií prím? Si tu správne. Pretože presne to sú hlavné črty testera. Len opatrne s tou škodoradosťou 😉 Manuálne testovanie nie je hanba!Neexistuje nič horšie, ako robiť stále to isté dookola. Našťastie, o tom manuálne testovanie nie je. Ale pekne postupne. Nepoznám krajší pocit v práci (okrem piatkového fajrontu) ako keď ja, človek, ktorý študoval dojivosť kráv a hektárový výnos pšenice, nachytá programátora s nejakou chybou. Manuálne testovanie znamená zobrať novú časť aplikácie, usúdiť či zodpovedá tomu, čo si zákazník želal a popri tom nachytať programátorov. Pri testovaní postupuj rovnako ako pri boji s mafiou. Najskôr ideš po veľkých rybách - chybách, ktoré spravia najviac škody, malé si nevšímaš alebo ich preskočíš, pretože nie je čas. Nech narobíš programátorom dosť roboty. Potom ideš po tých menších, dizajnových vychytávkach, pretože majú rovnakú váhu ako predvčerajšia instastory každej druhej makeup artistky . Vymýšľaš, čo si ešte nevymyslel a ideš po chodníčkoch aplikácie, kadiaľ by sa normálny používateľ nikdy nevydal. Ale Jožo Pročko hovoril 20 rokov dozadu, že nikdy nehovor nikdy. Ako tester to nehovor ani ty. Rozum maká zozačiatku viac ako ruky, a to je fajn. Fajn to byť prestane, keď sa karta obráti a nedajboh, aby si musel dvakrát robiť to isté. Alebo 3-krát. Alebo 4-krát. Alebo furt. Si odsúdený na večnosť regresne testovať celú aplikáciu. Pretože ak sa zmení kód, je potrebné to celé preklikať. A v tento moment mozog vypínaš a pracujú len ruky. Spomínaš si, keď ti ako malému povedali, že ak sa nebudeš učiť, budeš kopať kanále? Toto je to isté, akurát sedíš v bizniscentre s ďalšími korporátnymi kopačmi. Našťastie tú robotu môžeš prenechať počítaču, pretože na rad prichádza... Automatizované testovanie je programovanie!Nechaj zase mozog makať a ruky oddychovať. Automatizované testovanie je o tom, že ty naprogramuješ robota, aby chodil po určitej dráhe, cestičke v aplikácii a on to bude robiť vždy, keď mu prikážeš. Nepredstavuj si robota ako terminátora, ktorý za teba sedí v kancli. A ani takto to nevyzerá:[Image] Ty vidíš, že stránka sa otvorí, ale kliká po nej robot na pozadí, ktorého NIEKTO naprogramoval. A tým niekým si TY. Si programátor so všetkou tou pompou a slávou, píšeš kód napr. v JAVA a vyvíjaš si vlastnú aplikáciu, logiku, ktorá testuje softvér namiesto teba. Zo začiatku je to trošku ťažkopádne ako štartovanie V3S-ky, ale keď tú mašinu raz rozbehneš, práca ti neúmerne až zázračne klesá. A o tom je automatizované testovanie. Robotu, ktorá sa tebe nechce nenecháš na kolegu, ktorý sa vrátil z dovolenky. Ani ju nenaučíš masturbovať, aby sa spravila sama. (cit. Vtipnejší vyhráva 09/1994) Ale prenecháš ju počítaču. A on sa nepomýli, nevynadá ti, nezoberie sa o 16:00 domov a neochorie, keď polovica kancelárie zalieva zázvor vriacou vodou. Nevýhodou však je, že počítač vidí len toľko, koľko ho ty naučíš. Nie je inteligentný a nevidí veci v súvislostiach. Nevie si niečo všimnúť. Povieš mu slová František a Lászlo a on sa nezasmeje. Ani ty sa dúfam nesmeješ. A ešte si dávaj pozor, ako píšeš kód, aby si ho nemusel po sebe 30x opravovať, ak sa na stránke niečo zmení. Pretože to je tiež bolesť, neustále dohľadávať chyby v testoch. Poďme si porovnať manuál a automat. Výhody, nevýhody, kedy ktoré použiť.Manuálne testovanie+ hľadanie nových chýb v aplikácii, exploratory testing + objavenie dizajnových prešľapov + rýchla odpoveď na stav softvéru + improvizácia - nákladné - nevhodné na regresné testovanie - časovo náročné - nespoľahlivé (časový stres, prehliadneš chyby) - ako aplikácia rastie, rastú aj náklady na manuálne testovanie Automatizované testovanie+ regresné testovanie (pred vydaním do produkcie, po každej zmene) + rýchle + spoľahlivé + práca ti postupne ubúda - vyššie vstupné náklady (kým spustíš prvý test) - robot nové chyby nenájde - musíš vedieť programovať - údržba ZáverManuálne testovanie nemôže byť nahradené automatizovaným. Ak si manuálny tester, kľudne si vydýchni. A vydýchni si znovu, pretože ťa viem odbremeniť od tortúry, ktorú ti spôsobuje testovanie po každej jednej zmene. Naučím ťa programovať robota. Základy programovania a automatizovaného testovania ťa naučím v kurze s Batmanom: http://bit.ly/batmanKurz Ako písať efektívny kód, vedieť si postaviť Maven projekt, rozbehať jenkins, to ťa naučím v tomto kurze: http://bit.ly/jokerKurz A ako ten kód pekne zabaliť do jagavého pozlátka, aby mu každý rozumel ťa naučím v kurze s uhorkou: http://bit.ly/cucumberKurz Autorom blogu je Martin "Furby" Škarbala. Keď ťa zaujíma oblasť testovania softvéru, určite daj lajk na jeho Facebook stránku.

V prvom kvartáli 2019 pre teba chystáme viacero nových online kurzov. V tomto blogposte predstavíme tie najdôležitejšie novinky, na ktoré sa určite môžeš tešiť. Chystáme niečo z programovania, dizajnu, ale aj strihu videa. Java pre junior programátorovZavŕšenie trilógie kurzov zameraných na Javu od lektora Jara Beňa. Po online kurze zadarmo Java pre začiatočníkov sme sa pozreli na zúbok Jave pre pokročilých a v tomto treťom Java kurze sa naučíš všetko potrebné, aby si mohol začať pracovať ako junior Java programátor.[Image] UI dizajn v SketchiV tomto kurze nadviažeme na kurz Dizajn pre obrazovky a budeme sa už detailnejšie venovať UI dizajnu v parádnej aplikácii Sketch. Zistíš, čo všetko v Sketchi vieš robiť, aké má výhody oproti konkurenčným produktom od Adobe, ako navrhneš vlastný web alebo aplikáciu a zistíš, ako efektívne pracovať v Sketchi.[Image] Linux pre začiatočníkov IIMôžeš sa tešiť aj na pokračovanie kurzu Linux pre začiatočníkov. Pokročilejšie techniky a práca v Linuxe už bude pre teba malina. Plánujeme pre teba nachystať aj ďalší kurz na tému Linux, konkrétne Scriptovanie v Linuxe.[Image] Spring a Spring BootCieľom týchto online kurzov je poskytnúť základný prehľad o možnostiach frameworku Spring, s dôrazom na vývoj webových a REST-ful aplikácií. Spring je rokmi odskúšaná a overená alternatíva k JEE. Poskytuje jednoduchý, ale flexibilný programovací model, ktorý umožňuje efektívne vyvýjať robustné aplikácie v Jave. Kurz je ideálnym štartom pre tých, ktorí chcú začať využívať Spring vo svojich projektoch. [Image] Adobe Premiere RushAdobe Premiere Rush je cross-device aplikácia, pomocou ktorej vieš editovať videá. Pomocou Adobe Rush vieš nahrávať videá, upravovať ich, upravovať ich farbu, nahrávať a upravovať zvuk, pridať animované titulky a publikovať na sociálnych sieťach. Okrem desktopovej verzie aplikácie je k dispozícii aj mobilná verzia, v kurze vysvetlíme oboje. [Image] Adobe After EffectsPre začiatočníkov chystáme online kurz zameraný na Adobe After Effects, v ktorom ťa naučíme efektívne pracovať. Osvojíš si prácu s používateľským prostredím a jeho nástrojmi, naučíš sa animovať text a pracovať s hudbou, ovládaním vrstiev a módami prelínania.[Image] Ak ťa zaujímajú nejaké otázky na dané kurzy, smelo ich napíš do komentára. Budeme vďační aj za tipy na kurzy, ktoré by si na Learn2Code chcel vidieť.  A pokiaľ chceš nejaký online kurz s nami vytvoriť, určite nás neváhaj kontaktovať. Tešíme sa na teba!

Milanovi učaroval frontend a išiel tvrdo za svojim cieľom. Makal na sebe, vzdelával sa, absolvoval viacero online kurzov. Išiel s kožou na trh a hľadal si prácu ako frontend programátor a aj sa mu to podarilo. Aktuálne zarezáva v digitálnej agentúre z Liptovského Mikuláša a robí to, čo ho baví. Prinášame ti rozhovor s Milanom a veríme, že jeho príbeh ťa inšpiruje. Čítaj ďalej. Ahoj Milan, začnime tvojou aktuálnou prácou. Čo presne robíš, aká je tvoja pozícia?Ahoj, tak že momentálne pracujem na pozícií Front-end developer vo firme Webidentity, ale pomaly sa snažím vnárať do Back-endu, a to tak, že nasadzujem šablóny do CMS systému drupal, alebo ak ide o eshopy, tak do systému Prestashop.[Image] Milan Blaško - začínajúci frontenďák Ako si sa k tejto pozícii dostal? Keďže pred letom som skončil v bývalej robote, pretože som sa chcel posunúť zase ďalej, našiel som si robotu v Bratislave. No na konci leta som objavil ponuku práce v skupine Webrebeli od firmy Webidentity. Okamžite sme sa kontaktovali a nakoniec som tam aj začal pracovať. Potešilo ma to hlavne preto, lebo som mohol ostať v Liptovskom Mikuláši. Máš nejaký vzor, ktorý ťa inšpiruje? Osobu, ktorá je pre teba motivátorom?Určite môžem povedať, že vážnejšie k tvorbe webových stránok ma doviedol Yablko so svojím kurzom Webrebel HTML/CSS. Ale tak isto je vzorom aj môj šéf Juraj, ktorý ovláda tvorbu a programovanie stránok na vysokej úrovni. Kde berieš inšpiráciu pre svoju prácu? Máš nejaké tipy a hacky, ktoré zaručene fungujú?Inšpiráciu beriem všade po internete alebo od svojich spolupracovníkov. Zaručené hacky nemám, pretože stále narážam na niečo nové, čiže nič konkrétne nemám. :D V tejto oblasti je potrebné sledovať aktuálne trendy, inovácie. Ako si na tom ty? Stíhaš to všetko popri práci?Musím povedať, že odkedy pracujem, tak už je toho času menej, teraz sa skôr učím konkrétne veci ktoré využívam, respektíve ak narazím na nejaký problém tak sa to snažím riešiť buď so šéfom alebo hľadám riešenia na internete. Určite sa v najbližšom čase chcem viac venovať kurzom JavaScriptu, hlavne novému kurzu VUE.js.[Image] Milan už pracoval na projektoch pre viacero zaujímavých klientov Čím všetkým si si musel prejsť, pokiaľ si sa vypracoval na túto pozíciu?Musím priznať, že na začiatku to nebolo vôbec jednoduché, keďže som sa programovať učil popri vysokej škole. Hlavný problém bol, že som si chcel začať privyrobiť popri škole a chcel som to riešiť diaľkovo, no Front-endistu bez relevantých referencií ťažko niekde príjmu, nie to formou home-office. Nakoniec v poslednom ročníku sa mi podarilo na živnosť nájsť si prácu pre jednu firmu z Prahy. Čo ťa najviac baví na tvojej práci? Máš nejaký obľúbený task, ktorý robíš najradšej?Najviac ma na tejto práci báví sloboda. Hlavne, že môžem robiť z domu, z chaty alebo v kancli. Toto bolo pre mňa vždy dôležité. Ale určite aj rôznorodosť práce. Naozaj, človek sa tu učí projekt za projektom a väčšinou vždy robí niečo nové, čiže tá práce nie je stále jednotvárna. Ale ináč vždy som mal rád čisto Front-end, čiže kódovanie šablón.[Image] Milan vo voľnom čase rád varí pivo Dnes je obrovský dopyt po programátoroch a dizajnéroch. Čo by si poradil všetkým, ktorí nemajú žiadne skúsenosti, ale chceli by nejako začať?Určite odporúčam začať s kurzami, tie dajú dobrý základ a uvedú do problematiky. Potom hlavne skúšať písať reálny kód. Veľakrát som niečomu nechápal, veľakrát som urobil robotu zle, hlavne na začiatku, ale človek sa učí na vlastných chybách a čím dlhšie človek niečo robí, tým viac získava skúseností. Poradil by som aj ľuďom, aby si, čo najskôr začali hľadať stáže alebo prácu, pretože človek sa programovať najviac naučí pri reálnej robote, hlavne tam má skúsenejších kolegov, ktorí určite vždy radi pomôžu a posunú ho o poriadny kus ďalej. Čo je podľa teba najväčšou výhodou práce v IT odvetví?Ako som spomenul vyššie, predovšetkým je to sloboda v práci a že vždy človek robí niečo nové. Mal si niekedy pocit, že to nezvládneš? Bolo obdobie, kedy si chcel skončiť a robiť niečo úplne iné?Áno, bolo to hlavne pri kurzoch, často som si myslel, že som asi naozaj hlúpy, že veľa vecí jednoducho nechápem. Veľakrát som to chcel vzdať. Aj začiatky v zamestnaní boli ťažké, tiež som robil chyby. Ale po čase sa človek z vlastných chýb učí. Čím viac som tvoril webstránky, tým viac som všetkému začal rozumieť. Je to vždy o tom, že človek sa nemôže hneď vzdať a musí stále skúšať a byť vytrvalý v tom, čo robí. Aké sú tvoje plány do budúcnosti?Myslím, že jediný plán je zdokonaľovať sa v tom, čo aktuálne robím. Určite sa chcem stať senior Front-end developerom. Všetko ostatné už ukáže čas, čize nič konrétne v pláne nemám :) Máš nejakú radu, ktorú by si chcel zdieľať so študentami, ktorí len začínajú s dizajnom, tvorbou web stránok a programovaním alebo so svojím vzdelávaním v IT oblasti?Určite pokračovať v tom, čo začali. Učiť sa postupne veci, najlepšie prejsť všetko od základov, krok za krokom, neučiť sa všetko naraz a hlavne nenechať sa odradiť neúspechom. Všetko má svoj čas. Veľakrát sa mi stalo, že som si povedal, že na toto ja hlavu nemám, neviem sa to naučiť. Začal som pracovať, pozeral som si riešenia na internete a čo raz viac sa mi to dostaválo do hlavy. Hlavné je zotrvať. Ak máš na Milana nejakú otázku, smelo ju napíš do komentára k článku. Ďalšie úspešné príbehý absolventov Learn2Code kurzov si prečítaj v ďalších článkoch na našom blogu.

Od verzie 9 bude java vychádzať v pravidelných intervaloch. Každých 6 mesiacov nová java. Takže môžeme očakávať nové funkcionality častejšie, ale v menších dávkach. Najpoužívanejšia Java v súčasnosti je java 8 – vyšla v roku 2014. Java 9 prvýkrát vyšla v septembri 2017, neskôr boli opravené kritické chyby a dalo by sa povedať, že taká lepšia verzia vyšla v januári 2018. Java 10 vyšla v marci 2018, Java 11 v septembri 2018. Takže rýchly posun vo verziách, ale nie drastický posun vo funkcionalite.  Čo je lepšie? Naraz a veľa alebo menej a postupne? Záleží od toho, čo robíš. Ak používaš veľa frameworkov a knižníc tretích strán, tvoja práca po zvýšení javy môže byť ovplyvnená.  Prvým míľnikom je java 11, ktorá je označená ako LTS, teda long term support. Táto verzia javy bude dlhodobo opravovaná a bude o ňu postarané na najbližšie roky. Čo to znamená? Že je pravdepodobnejšie, že firmy poskočia z javy 8 skôr na javu 11, lebo budú mať istotu, že táto java bude v budúcnosti opravovaná – ak by sa našla nejaká kritická chyba.  V tomto článku sa zameriame hlavne na výpis zmien, čo je nové. Nebudeme sa zaoberať jednotlivými zmenami podrobne. To si necháme do budúcna.  InštaláciaNajprv si musíš stiahnuť a nainštalovať najnovšiu javu jdk. V čase písania článku je to Java 11. Nastav si premennú prostredia JAVA_HOME na novú javu – na root, nie na bin priečinok. Potom do PATH premennej nastav cestu práve na bin priečinok novo nainštalovanej javy.  Spusti príkazový riadok a zadaj príkaz: java – version  Ak sa ti objavila verzia, všetko je v poriadku. [Image] Ak je nejaká chyba, alebo ukazuje staršiu verziu, tak sa uisti, že v PATH je cesta bin novej javy nastavený na začiatku. Je možné, že v PATH máš nastavené aj C:\ProgramData\Oracle\Java\javapath. Ak áno, tak to musí byť až za cestou na najnovšiu javu.  ModulyV jave 9 je najskloňovanejšia zmena projekt Jigsaw – ale stačí, ak si zapamätáme, že ide o modularitu – rozdelenie veľkého monolitu – teda celá aplikácia v jednom balíčku na menšie celky – moduly. Moduly potom povedia, čo zverejňujú do sveta a čo požadujú pre svoju správnu funkcionalitu.  Každý modul obsahuje module-info.java súbor a aspoň jeden balík. Modul-info.java v sebe obsahuje popis závislostí, ktoré modul potrebuje. Každý modul je nezávislý v ponímaní, že ak obsahuje obrázky, alebo konfiguračné súbory, tak modul si ich manažuje sám. Všetko, čo je v module je privátne pre modul, ak nepovieme inak.  Existujú 4 typy modulov. System moduly – Java SE a JDK moduly – ak si všimneš, tak v nainštalovanom jdk pre novšiu javu chýba priečinok jre. Teraz tam je jmods. Tu máme umiestnené všetky už default poskytované moduly. [Image] Aplikačné moduly sú moduly, ktoré chceme vytvárať, keď sa rozhodneme, že chceme používať moduly.  Automatické moduly sa vytvoria, keď pridávame JAR súbory na path modulu. Názov modulu sa preberie z názvu jar súboru. Tieto automatické moduly majú plný prístup na čítanie do všetkých ostatných modulov načítaných na path.  Nepomenovaný modul = ak sa na path – nie na module path – načítajú nejaké triedy alebo jar súbory, tak tieto triedy a jar súbory sú automaticky pridané do tohto nepomenovaného modulu. Slúži na spätnú kompatibilitu s predchádzajúcim starším javovským kódom.  DistribúciaModul má byť zbalený ako jar súbor – jeden jar súbor má obsahovať max jeden modul. Keď robíme build projektu, musíme si dať pozor, aby sme zabalili každý modul v našom projekte ako samostatný jar.  Základné modulyVraveli sme si, že jdk má novú štruktúru, ktorá má v sebe jmodules. Tu sú základné moduly. Tieto moduly si vieme vypísať pomocou príkazového riadku ak zadáme príkaz <b>java --list-modules</b>. [Image] Každý modul, ktorý vytvoríme, bude používať implicitne java.base modul. Použitie iných modulov bude dostupné po konfigurácii.  Vytvorenie moduluModul v podstate vznikne, ak zadefinujeme v roote zdrojového kódu modulu súbor module-info.java.  Týmto momentom sa pracuje so zdrojovým kódom ako s modulom. Moduly sa navzájom nevidia – nemajú prístup jeden do druhého a do tretieho a tak ďalej. Podľa toho koľko modulov používame.  Ak chceš používať niečo z vonku, alebo chceš, aby vnútro tvojho modulu, alebo čas vnútra tvojho modulu bolo viditeľné, musíš to zadefinovať.  Majme projekt, do ktorého si zadefinujeme nový modul. V module máme src priečinok, do ktorého budeme dávať všetok zdrojový kód. Vo vnútri si zadefinujeme balíček sk.jaro.demo a v ňom ešte external a internal. Vytvoríme si jednoduché triedy, ktoré len niečo vypíšu na konzolu. [Image] package sk.jaro.demo.external; public class HelloMainModuleExternal { public void doAction() { System.out.println ("Hello main module HelloMainModuleExternal"); } }package sk.jaro.demo.internal; public class HelloMainModuleInternal { public void doAction() { System.out.println("Hello main module HelloMainModuleInternal"); } }Tieto triedy sú odlišné len v názve a výpise na konzolu. Internal si neskôr nastavíme, aby bola viditeľná len v module main. External si neskôr nastavíme, aby bola viditeľná aj mimo modulu main. V src tohto modulu si vytvor súbor module-info.java. Vnútro súboru má syntax, kde je najprv kľúčové slovo modul, potom názov modulu – vieš používať aj bodky a potom sú kučeravé zátvorky: modul nazovmodulu{ }. Chceme, aby balíček external bol dostupný aj pre iné moduly – musíme nastaviť aby sa exportoval. module main { exports sk.jaro.demo.external; }Teraz si vytvoríme nový modul v tom istom projekte s názvom utils. Vo vnútri budeme mať jednu triedu, v ktorej sa budeme snažiť použiť HelloMainModuleExternal triedu z modulu main. [Image] Module-info.java musí teraz obsahovať, že v tomto module vyžadujeme modul main – pretože používame funkcionalitu z tohto modulu.  module utils { requires main; }Teraz môžeme použiť triedy, ktoré boli exportnuté z main modulu:  package sk.jaro.demo; import sk.jaro.demo.external.HelloMainModuleExternal; public class UseSomethingFromMainModule { public static void main(String[] args) { HelloMainModuleExternal helloMainModuleExternal = new HelloMainModuleExternal(); helloMainModuleExternal.doAction(); } }ZáverNa záver by si sa mohol teraz s tým kúsok pohrať. Skús použiť triedu, ktorá nie je exportnutá z modulu main.  O moduloch by sa dalo písať a hovoriť viac, ale dúfam, že si porozumel princípu modularizácie. Mne v priebehu študovania tejto témy vybehlo pár otázok, na ktoré som si ešte neodpovedal. Napríklad: Maven s java modularizáciou? Frameworky a modularizácia?  Ak sa ti článok páčil, tak napíš niečo do komentárov, poteší ma to.  Zaujímaš sa o Javu? Skús jeden z kurzov na túto tému na https://skillmea.sk.  Ak sa chceš o mne dozvedieť viacej sleduj môj web www.jaroslavbeno.sk.  Jaro Zdrojové kódy na stiahnutie.

Ľudovít Nastišin a Michal Gazdík spoločne vytvorili náš nový grafický online kurz zameraný na Adobe InDesign. V tomto kurze sa naučíš robiť rôzne dokumenty ako napríklad plagáty, brožúry, vizitky a mnoho ďalšieho.  Ľudo sa grafickému dizajnu venuje už viac ako 10 rokov ako freelancer. Nazbieral mnoho skúseností s tvorbou obalového dizajnu, printov, digitálnych bannerov či animácií. Svoje skúsenosti ti môže odovzdať aj na prezenčnom kurze Visual Design v Košiciach. Okrem samotnej grafiky sa rád podelí aj o skúsenosti z oblasti komunikácie s klientom, freelancerskou prácou na diaľku či jeho pohľadom na to, ako sa v grafickom dizajne kontinuálne vzdelávať a napredovať. Michal sa grafickému dizajnu začal venovať počas gymnázia, keďže ho to tam veľmi nebavilo. Začínal s úpravou fotiek svojich spolužiakov a následne sa mu zapáčila myšlienka a možnosť, že vie upraviť akýkoľvek obrázok, podľa vlastných predstáv. Týchto dvoch chalanov sme vyspovedali a ty si práve teraz môžeš prečítať rozhovor s nimi. Na začiatok najskôr začnime vašou prácou. Čo presne robíte?Ľ.N. (Ľudovíť Nastišin): Už dlhé roky sa venujem grafickému dizajnu ako freelancer a súčasne pôsobím aj na Prešovskej univerzite na Katedre marketingu a medzinárodného obchodu. Oba tieto svety sa vzájomne veľmi dobre dopĺňajú, často dokážem využiť v jednej oblasti práve pohľad na vec aj z tej druhej, čo moju prácu obohacuje.   M.G. (Michal Gazdík): Momentálne sa nachádzam v Manchestri a pracujem taktiež na voľnej nohe. Venujem sa grafickému dizajnu a tvorbe webstránok a snažím sa nájsť si svoju cestu v živote.[Ľudovíť a Michal, lektori Learn2Code] Na akých projektoch ste pracovali?Ľ.N.: Niekoľko rokov som spolupracoval s firmou Powerlogy a Dušanom Plichtom, ktorého mnohí biohackeri či vyznávači kvalitnej stravy a kávy určite poznajú. Riešili sme široké spektrum vecí od packagingu produktov, bannerov, brožúr a celkovú vizuálnu identitu. Uplynulé leto som spolupracoval zhodou okolností aj s KOCR Severovýchod Slovenska na ich kampani “Kraj kultúrnych pamiatok”, to je také najčerstvejšie. Nemôžem nespomenúť aj moju účasť na budovaní portálu sketcher.sk pod skupinou Startitup, kde som niekoľko rokov stál na jeho čele a riešil tam asi úplne všetko, čo sa vyskytlo. A samozrejme je tu ešte niekoľko menších klientov, s ktorými pracujem na pravidelnej báze, no nie sú to žiadne megalomanské projekty, skôr riešenie bežných zadaní, ktoré neznejú až tak sexi, no musia sa jednoducho urobiť .).  M.G.: Pracoval som už na viacerých projektoch, ale asi najväčší projekt doteraz je kurz InDesignu, ktorý sme pripravili spolu s Ľudom. A ako ste sa k dizajnovaniu a grafike vôbec dostali?Ľ.N.: Môj prvý kontakt s Photoshopom bol viac ako 15 rokov dozadu, kedy som môjho suseda videl robiť si covery na CD-čka. Čmáral si tam s brushom a niekoľkými farbami a nakoniec na to dal efekt “Twirl”. Nič iné v tom asi ani nevedel, no pre mňa to bolo v tej dobe wau. Potom som skúšal tutoriály, pokus omyl, no keď som narazil na čaro YouTube, už to išlo samo.  M.G.: Ku grafike som sa dostal kvôli potrebe upravovať fotky spolužiakov na strednej škole. Snažil som sa vytvoriť nejaké zábavné meme, ktoré by ich pobavilo. Zistil som, že to nie je až také náročné a tak som sa začal učiť sám po škole. Prečo ste sa rozhodli robiť lektorov v Learn2Code?Ľ.N.: U mňa to bol prirodzený vývoj udalostí. Grafiku som riešil už dlho, potom sa pridala univerzita, kde som začal aj učiť. Prišlo mi to ako logické spojenie toho, že mi učenie (myslím si) celkom ide a grafiku taktiež ovládam. Tak som to teda skúsil. M.G.: Videl som príležitosť nabrať nové skúsenosti a taktiež možnosť sa zviditeľniť. Taktiež som si už aj zopár kurzov od Learn2Code pozrel a chcel som aj ja prispieť nejako do komunity učenia chtivých ľudí. Čo všetko sa človek naučí vo vašom kurze Adobe InDesign? Kde nájde po kurze s týmito novými vedomosťami uplatnenie?M.G.: Človek sa naučí ako používať veľa základných nástrojov, na čo slúžia a ako ich využiť v praxi. Dozvie sa aj ako si vytvárať rôzne objekty, rýchlejšie techniky robenia niektorých vecí a aj to ako manipulovať s objektami a šetriť čas pri práci s InDesignom. Taktiež odporúčam preto, lebo keď si človek zapne InDesign alebo akýkoľvek iný program, môže to naňho pôsobiť odstrašujúco. Toľko tlačidiel? Na čo všetky slúžia? Po pozretí kurzu, bude človek istejší v prostredí a bude vedieť čo kde nájde a čo na čo slúži. Kde berieš inšpiráciu pre svoju prácu? Máš nejaké tipy, ktoré zaručene fungujú?Ľ.N.: Inšpiráciu najviac čerpám na Behance či Dribbble, no často krát ma niečo osloví aj na tých najneočakávanejších miestach. Môžem sedieť v kaviarni a zrazu si všimnem na stene krásny retro plagát či niečo podobné, ihneď to cvakám do mobilu.  Zaručené tipy nemám, každému podľa mňa funguje niečo iné. Treba sa ale pripraviť na to, že niekedy vás to “kopne” ihneď, niekedy budete dva týždne hľadať a skúšať, kým budete spokojní. Treba si ale vždy pýtať feedback, od klienta alebo aspoň od vášho spolubývajúceho. Niekedy totiž, keď na grafiku pozerám hodiny, už ju nevidím tak, ako ten, čo sa na ňu pozrie prvý krát. Vtedy treba dať pauzu, ísť na iný projekt alebo robiť niečo iné a vrátiť sa k tomu s odstupom času. To pomáha.  M.G.: Niekedy je náročné vytvoriť niečo len tak z hlavy a preto okamžite bežím na internet. Je tam neskutočné množstvo informácii a preto ich treba využívať. Pri nejakom zadaní alebo probléme si urobím taký “brainstorming.” Napíšem niekoľko modifikácii kľúčového slova do Googlu a otvorím si 15-20 rôznych stránok, ktoré mi vyhodí a potom začínam scrollovať každú jednu z nich a triediť, čo sa mi páči. Na konci mám jasnejšie myšlienky v tom, čo chcem vytvoriť a vďaka tomu sa viem hýbať ďalej. Je v tejto oblasti dizajnu potrebné sledovať aktuálne trendy a inovácie? Ako si na tom ty?Ľ.N.: Určite je dobré sledovať trendy. Snažiť sa zakomponovať ich do svojej práce, ak práve na také niečo nie si zvyknutý a robíš si zakaždým len “svoj štýl” môže byť obohacujúce a núti to človeka rozvíjať sa. Bez toho bude tvoja práca časom neatraktívna a to nechce nikto. Netvrdím, že tie trendy sú nejaká mantra, ktorú treba slepo nasledovať. Je ale dobré minimálne o nich vedieť a následne aspoň zhodnotiť, či je to niečo pre teba, či ťa to viem niekam posunúť, alebo tvoju prácu. M.G.: Samozrejme je to potrebné. Ak ti zákazník povie, že minulý týždeň videl nejaký super dizajn a presne taký chce aj on, ty následne vieš o čo ide a dokážeš uspokojiť jeho potreby. Takisto ako aj v prírode. Čo sa nehýbe, umiera. Treba sledovať trendy a posúvať sa ďalej, lebo inak je to pre grafika ťažšie.  Čo ťa najviac baví na tvojej práci? Máš nejaký obľúbený task, ktorý robíš najradšej?Ľ.N.: Obľúbený task je - Save As “ProjectName_Final.psd” :)  . Aj keď všetci vieme, že to slovo Final je často krát len ilúzia a aj tak to ešte 4 krát upravujem. Na práci ma najviac baví práve variabilita zadaní, nerád robím stále ten istý typ výstupu. M.G.: Najradšej na tejto práci mám to, že nie som viazaný na jedno miesto, ale keď človek pracuje ako freelancer môže chodiť kam chce. Toto sa mi na tom najviac páči a neviem si to vynachváliť. Pracovný čas nie je 9-5. Ale môže byť úplne iný. Som chorý? Okej. Ostanem dnes ležať v posteli :D[Ľudovítova prednáška] V čom vidíš výhodu svojej práce? Je v niečom výhodnejšia ako iné zamestnania?Ľ.N.: Grafiku potrebuje človek takmer vo všetkom. Ak má človek aspoň nejaké základy, drvivú väčšinu projektov si vo svojej firme vie urobiť aj sám. A tom šetrí čas aj náklady. Takže vedieť to je naozaj výhoda. V mojom prípade je to ale najmä o tom, že ako freelancer robím z domu a podľa seba. Keď sa mi nechce ráno, tak to nerobím. Deadline je svätý, ale to, ako sa k nemu dostanem je len na mne a to je veľká výhoda (avšak aj zodpovednosť, na to nezabúdať). Môžem sa venovať iným veciam, rodine, čomukoľvek, pretože to mám v rukách. M.G.: Taktiež ako som už aj vyššie spomenul. Je to voľnosť rozhodnúť sa. To si myslím, že je veľmi dôležité pre dnešných mladých ľudí. Nebyť za pásom, ale tvoriť hýbať sa a spoznávať nové veci. Čo by si poradil všetkým, ktorí nemajú žiadne skúsenosti s dizajnom a grafikou, ale chceli by začať?Ľ.N.: Na základy si nájdite nejaký kurz, alebo osobu čo vám to dokáže vysvetliť. Ušetríte mnoho času a energie, pretože práve v absolútnych začiatkoch sa viete v grafike skutočne stratiť. Takto vás tým niekto prevedie.  Akonáhle máte zvládnuté základy a chápete, o čom ten ktorý softvér je, už to dokážete aj sami, mne sa najviac osvedčilo opakovať si tutoriály z youtube, skúsiť si prevytvoriť nejaký plagát, čo sa vám páčil a pod. Potom je to už ako snehová guľa, každý ďalší krok je jednoduchší, pretože vaše poznanie softvéru je stále lepšie.  M.G.: Dôležité je začať. Je jedno ako. Najlepšie je si pozrieť nejaký kurz alebo YouTube videá. Potom už len skúšať. Opýtať sa uja, ktorý má firmu, či nepotrebuje nové logo alebo plagát a pomaly to už pôjde. Skúšať a neprestávať.[Ľudove mudrovačky] Aké máš plány do budúcnosti?Ľ.N.: Konkrétne plány nemám, momentálne som spokojný s tým, ako to u mňa vyzerá, no chcem si trochu rozšíriť znalosti do 3D, vyjsť z komfortnej zóny, napredovať. Možno práve to u mňa vzbudí nejaký plán, ktovie. M.G.: Plány sú veľké a momentálne na nich pracujem. Je to dlhý proces, takže o nich budem hovoriť až keď budú splnené. Samozrejme, chcem sa držať grafiky. Krátky odkaz všetkým čitateľom na záverĽ.N.: Grafika sa hodí vždy, táto investícia sa určite vráti. Treba k tomu ale pristupovať zodpovedne a výsledky sa dostavia.  P.S. Ak by si sa chcel ohľadom dizajnovo grafických vecí spýtať, napíš mi do diskusie pod kurzom na Learn2Code. Ak budem vedieť, rád odpoviem niečo múdre. Čau. M.G.: Najlepší čas pre zasadenie stromu bol pred tridsiatimi rokmi. Druhý najlepší čas je teraz! Máš na chalanov nejaké otázky? Neváhaj ich napísať do komentára.

V tomto článku sa spolu pozrieme na základy práce s číslami a znakmi v programovacom jazyku Java.  Čísla[Image] Prečo používať Numbers a nie primitívne dátové typy? Ak nejaká metóda príjma ako parameter Object, tak jej neviem podsunúť primitívny dátový typ. Môžeš použiť konštanty, ako napríklad MIN_VALUE alebo MAX_VALUE. Môžeme používať metódy na konverziu do a z primitívnych dátových typov ako aj zo String.  Byte b = 127; Byte b2 = 128; //error Byte len do 127Pre všetky typy máme metódy, ktoré z textu vedia vyloviť daný typ. Tu si treba dať pozor, lebo ak chcem zo Stringu dostať Integer – ale zadám tam text, tak to bude chyba. String decimal = "2.5"; double d1 = Double.parseDouble(decimal); decimal = "2.5a"; double d; d = Double.parseDouble(decimal); //chyba Keď hovoríme o číslach, tak nemôžme nespomenúť modulo. Plus, mínus poznáme, ale modulo by nám mohlo robiť problém. private static void modulo() { for(int i = 0; i < 32; i++){ rozdajHracoviKartu(i%4,i); } } private static void rozdajHracoviKartu(int hrac, int karta) { System.out.println("rozdavam hracovi "+hrac+", kartu cislo "+karta); }V tomto príklade výsledok modula nebude nikdy viac ako 3 a menej ako 0. Teda sa karty rozdajú medzi všetkých hráčov v hre. Skús si to pomeniť sám.  Matematické operácie Pre veľa matematických operácií máme triedu Math, ktorá obsahuje množstvo statických metód. Názvy sú samo vysvetľujúce, alebo si pozri nižšie komentáre: System.out.println("a "+a+" abs "+ Math.abs(a)); //absolútna hodnota System.out.println("b "+b+" ceil "+Math.ceil(b)); //zaokrúhli nahor System.out.println("b "+b+" floor "+Math.floor(b)); //zaokrúhli nadol System.out.println("b "+b+" rint "+Math.rint(b)); //klasicke zaokruhovanie zmen b ... vracia double hodnotu intu System.out.println("b "+b+" round "+Math.round(b)); //klasicke zaokruhovanie zmen b ... vracia int alebo long ... int round(float f) System.out.println("c "+c+" a d "+d+" max "+Math.max(c, d)); System.out.println("c "+c+" a d "+d+" min "+Math.min(c, d)); Náhodné číslo V Math triede máme metódu random. Vracia hodnotu od 0.0 po 1.0 . Krátením vieš zvätsit a musíš pretypovať na int ak chceš celé čísla. private static void randomNumbers() { int number = (int)(Math.random() * 100); System.out.println(number); }ZnakyPrimitívny dátový typ char sa používa na uchovanie jedného znaku. Pri char máme tak isto možnosť použiť jeho alternatívu objektovú a to Character V jave existujú escape sekvencie. To sú znaky, teda char, pred ktorým je spätné lomítko. Tieto sekvencie majú pre kompilátor zvláštny zmysel. Neberú sa ako nejaký jednoduchý text.  \t    -  vloží tab  \b   -   vloží backspace  \n   -   vloží nový riadok  \r    -   vloží carriage return  \f    -   vloží formfeed  \'    -    vloží jednu uvodzovku  \"    -   vloží dvojitú uvodzovku  \\    -   vloží spätné lomítko  Máme množstvo pomocných metód: Character ch3 = 'a'; System.out.println("char "+ch); System.out.println("isLetter "+Character.isLetter(ch)); System.out.println("isDigit "+Character.isDigit(ch)); System.out.println("isWhitespace "+Character.isWhitespace(ch)); System.out.println("isUpperCase "+Character.isUpperCase(ch)); System.out.println("isLowerCase "+Character.isLowerCase(ch)); System.out.println("toUpperCase "+Character.toUpperCase(ch)); System.out.println("toLowerCase "+Character.toLowerCase(ch)); System.out.println("toString "+Character.toString(ch));Takýmto spôsobom vieš vložiť aj špeciálne znaky z hora:System.out.println("Some \t nice text. tab"); System.out.println("Some \t\b nice text. backspace"); System.out.println("Some \n nice text. new line"); // je to niečo ako na starom písacom stroji kedy si sa presunul na začiatok riadku //ak nedáš ale nový riadok, tak ti prepíše to čo tam už máš napísané System.out.println("Some \r nice text. carriage return"); System.out.println("Some \r\n nice text. carriage return a new line"); System.out.println("Some \' nice text. "); Ak chceš zadať špeciálnu hodnotu, tak musíš zadať pred daný špeciálny znak lomítko. char uvodzovka = '''; //error char uvodzovka = '\''; System.out.println("Some " nice text."); //error System.out.println("Some \" nice text."); System.out.println("Some \ nice text."); //error System.out.println("Some \\ nice text.");ZáverAk ťa zaujíma Java, tak si tu na https://skillmea.sk pohľadaj kurzy, ktoré sa venujú programovaniu v Jave a nauč sa viac. Ja som Jaro a dúfam sa vidíme pri ďalšom článku alebo videu.

Keďže Darček roka od Learn2Code je tu vôbec prvýkrát, prinášame ti jednoduchý prehľad toho, čo o Darčeku roka potrebuješ vedieť. V tomto článku nájdeš všetky odpovede, ktoré by ťa mohli zaujímať. V skratke, Darček roka je kombinácia týchto 3 vecí:  • predplatné Learn2Code online kurzov (prístup do 31.12.2019), • benefity od partnerov (v hodnote viac ako 200 Eur), • súťaž od Apple zariadenia (iPhone Xs, iPad, Apple Watch). Predplatné online kurzovV prípade, ak sa rozhodneš kúpiť si Darček roka, tak získaš neobmedzený prístup do všetkých online kurzov a to nielen tých súčasných, ale aj pripravovaných až do 31.12.2019. Aktuálne nájdeš na našom webe takmer 60 online kurzov, ktoré obsahujú viac ako 500 hodín videomateriálu (videotutoriálov). To je poriadna nálož informácií, vedomostí a know-how. Ber to ako investíciu do seba a do svojho rozvoja. Pomocou týchto kurzov sa môžeš naučiť robiť webstránky, programovať, robiť dizajn a ovládať grafický software, zvládneš online marketing, prácu s fotoaparátom či videom, alebo MS Office. Následne sa môžeš uchytiť v rôznych IT firmách alebo rozbehnúť vlastný online či offline biznis. Načo čakať? Začni už dnes 💪[Naše online kurzy] Benefity od partnerovOkrem kvalitných online kurzov získavaš aj lákavé benefity od našich top partnerov. Poďme si o nich povedať trochu viac. SuperFaktúra  Pokiaľ sa chystáš na podnikanie, alebo už podnikáš, kvalitná služba na vystavovanie faktúr, ktorá sa dá prepojiť s účtovníctvom je nutnosť. SuperFaktúra je jednoduchá a prehľadná a pri tom ponúka množstvo funkcií pre živnostníkov a firmy. V rámci benefitov máš 3 mesiace prémium členstva v SuperFaktúre od Learn2Code zadarmo. Firmáreň.sk Založiť si živnosť, firmu, občianske združenie sa dá pohodlne, online a bez starostí. Portál na zakladanie firiem firmaren.sk je nástroj, vďaka ktorému si dokážeš firmu založiť už za 15 minút. Všetko cez internet a bez rád drahých právnikov. V rámci benefitov v Darčeku roka získavaš kupón na 15 Eur. WebSupport Líder slovenského webhostingového trhu, ktorý na trhu pôsobí od roku 2002 a aktívne sa podieľa na vytváraní zdravého podnikateľského prostredia, podporuje startupy, neziskovky a je tak neoddeliteľnou súčasťou slovenskej IT komunity. Tvoj web musí byť niekde uložený a my ti dávame hosting The Hosting 3 GB na 3 mesiace zadarmo. ESET ESET už vyše 30 rokov vyvíja popredný bezpečnostný softvér pre firmy i domácich používateľov na celom svete. V ESETe veria v technológie a chcú zabezpečiť, aby si ich užívatelia mohli vychutnávať bezpečne. Maj svoje dáta v bezpečí s 30% zľavou na produkty Eset Internet Security alebo Eset Smart Security Premium. Profit Inšpiratívny magazín pre aktívnych ľudí, ktorí chcú žiť naplno a meniť svet. Profit je mesačník, v ktorom nájdeš informácie o nových trendoch, výrazných osobnostiach, inspirujúce príbehy, osobné financie či zaujímavé investície. S Darčekom roka získavaš ročné predplatné so zľavou 50%. Bux.sk Internetové kníhkupectvo Bux.sk ponúka tisíce kníh skladom, novinky svetových aj domácich autorov. Nakúp knihy pre seba alebo blízkych v internetovom knižnom eshope bux.sk a získaj zľavu 10 Eur. Powerlogy Inovatívne produkty pre aktívnych ľudí, zdravé potraviny, káva a ďalšie produkty, ktoré ti už aj v malom množstve dodajú zdravú energiu na každý deň. Od Learn2Code získavaš 20% zľavu na nákup. Forbes Návod na úspech nájdeš v celosvetovo známom magazíne Forbes. Ak hľadáš inšpiráciu na celý rok, Forbes predplatné musíš mať. Okrem tlačeného magazínu získaš aj jeho elektronickú verziu a môžeš teda Forbes čítať v tablete alebo mobile. V rámci Darček roka od nás dostávaš zľavu 25% na nákup ročného predplatného.[Naši Partneri pre Darček roka] Súťaž o Apple produktyKaždý, kto si objedná Darček roka, je automaticky zaradený do súťaže o Apple produkty od partnera akcie Darček roka spoločnosti iStores. Konkrétne môžeš vyhrať nový iPhone Xs, iPad 2018 alebo Apple Watch series 3 GPS. Výhercov budeme žrebovať 1.1.2019 o 20:00 v livestreame na našom Facebooku a ich mená zverejníme aj na webe v sekcii súťaž.[Spoločnosť iStores] [Vyhraj iPhone, iPad alebo Apple Watch] Tip na darčekNevieš, čím obdarovať seba alebo svojich blízkych na Vianoce? Máme pre teba super tip - Darček roka od Learn2Code. Vzdelávanie je tá najlepšia investícia do budúcnosti pre teba alebo tvojich blízkych. A preto nám napíš email a vystavíme ti darčekový poukaz.

Ahoj, naposledy sme hovorili o websocketoch vo flasku. Používali sme knižnicu flask-socketio a prešli sme si základnú funkcionalitu. Táto knižnica používa koncept miestností alebo rooms, ktorý slúži na to, aby sme vedeli adresovať klientov v nejakých skupinách. Tento koncept sa používa v chatových aplikáciách, kde používatelia vidia správy len v miestnosti, v ktorej sa nachádzajú. Nedostanú správy zo žiadnej inej. Pozrieme sa teda na tento koncept a aby sme spravili aj nejaký reálny príklad, spravíme vlastnú chatovaciu appku. Používatelia sa budú môcť pridať do existujúcej miestnosti, chatovať s ostatnými, vytvárať nové miestnosti a podobne. Bude to veľmi jednoduchý message board.[Image] Základ projektuZačne tým, že si vytvoríme virtualenv! Bez toho sa ani nepohneme. $ mkdir websockets_message_board $ cd websockets_message_board $ virtualenv venv $ . venv/bin/activateInštalujeme závislosti. Budeme používať to isté, čo v predchádzajúcom článku (venv)$ pip install flask, flask-socketioIdeme na boilerplate pre našu appku. Štruktúra vyzerá asi takto: ▾ websockets_message_board/ ▾ static/ ▾ css/ main.css ▾ js/ main.js ▾ templates/ board.jinja ▸ venv/ server.pySúbory main.css a main.js sú zatiaľ prázdne, slúžia len ako placeholder. Pokračujeme teda so súborom server.py a ideme ho naplniť kódom. from flask import Flask from flask import render_template from flask import redirect from flask import url_for from flask_socketio import SocketIO app = Flask(__name__) app.config['SECRET_KEY'] = '\xfe\x060|\xfb\xf3\xe9F\x0c\x93\x95\xc4\xbfJ\x12gu\xf1\x0cP\xd8\n\xd5' socketio = SocketIO(app) ### WEB CONTROLLER @app.route("/") def index(): return redirect(url_for("view_board")) @app.route("/board/") def view_board(): return render_template("board.jinja") if __name__ == '__main__': socketio.run(app, debug=True)Rozdiel oproti minimálnej flask appke je ten, že ju inak spúšťame. Nepoužijeme if __name__ == '__main__': app.run()ale budeme ju spúšťať cez socketIO. if __name__ == '__main__': socketio.run(app, debug=True)To preto, aby aplikácia vedela spustiť viacero vlákien pre každého používateľa. Tak isto je dobré vedieť, že deployment na produkčný server takejto aplikácie je trošku komplikovanejší ako keď máme klasickú flask appku. Obsah základného templejtu board.jinja (aj jediného, ktorý budeme používať) je nasledovný: <!DOCTYPE HTML> <html> <head> <title>Short Term Memory Message Board</title> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.5/socket.io.min.js"></script> <script type="text/javascript" src="{{ url_for("static", filename="js/main.js")}}"></script> <link rel="stylesheet" type="text/css" href={{url_for("static", filename="css/main.css")}}> </head> <body> Hello </body> </html>máme tam zopár dôležitých importov ako socket.io, jquery a tak isto aj css a js súbory našej appky. Takýto jednoduchý základ môžeme spustiť a uvidíme, či všetko šlape ako má $(venv) python server.py WebSocket transport not available. Install eventlet or gevent and gevent-websocket for improved performance. * Serving Flask app "server" (lazy loading) * Environment: production WARNING: Do not use the development server in a production environment. Use a production WSGI server instead. * Debug mode: on * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit) * Restarting with stat WebSocket transport not available. Install eventlet or gevent and gevent-websocket for improved performance. * Debugger is active! * Debugger PIN: 112-998-522FaceliftTento krok nie je vôbec potrebný, ale keďže všetci majú radi pekné veci, nainštalujeme si css framework zvaný semantic-ui. Je to fajn framework, mám s ním dobré skúsenosti. Dokumentácia je možno trošku tažšia na pochopenie, ale okrem toho to funguje a hlavne vyzerá veľmi pekne. [Image] Stačí stiahnuť toto zipko a integrovať do svojho projektu. Je to veľmi jednoduché. Zip rozbalíme a prekopírujeme nasledovné súbory • themes -> websockets_message_board/static/css/ • semantic.min.css -> websockets_message_board/static/css/ • semantic.min.js -> websockets_message_board/static/js/ Súbory semantic.min.js a semantic.min.css musím includnuť na svoju stránku, takže bežím do board.jinja a prihodím do hlavičky ďalšie riadky: <head> <title>Short Term Memory Message Board</title> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.5/socket.io.min.js"></script> <script type="text/javascript" src="{{ url_for("static", filename="js/semantic.min.js")}}"></script> <script type="text/javascript" src="{{ url_for("static", filename="js/main.js")}}"></script> <link rel="stylesheet" type="text/css" href={{url_for("static", filename="css/semantic.min.css")}}> <link rel="stylesheet" type="text/css" href={{url_for("static", filename="css/main.css")}}> </head>Je dôležité dať si pozor, aby sme najprv pridali jquery a až potom semantic.min.js, inak sa mi semantic-ui bude sťažovať, že nevie nájsť jquery knižnicu. V priečinku themes sú hlavne ikony a nejaké obrázky, ktoré semantic-uiposkytuje. Po inštalácií css frameworku môžem hneď vidieť zmenu v podobe iného fontu na mojej smutnej stránke. Nič iné tam ešte nieje. UISpravíme teraz približný náčrt UI, aby som vedel, ako appka asi bude vyzerať a aké funkcie jej vlastne spravíme. Nebude to nič svetoborné. Budeme mať jednu stránku ktorú rozdelím na 3 sekcie. Hlavná bude obsahovať správy, takže to bude môj message board. Bočný panel bude obsahovať zoznam miestností, do ktorých sa budem vedieť prepínať. No a na spodnej lište bude input pre moju správu.[Image] Zhmotním túto svoju predstavu do kódu. Otvorím board.jinja a nahádžem tam nejaké <div> elementy. Keďže používame semnatic-ui ako náš css framework, budem rovno používať triedy v html. Použijeme grid systém, ktorý nám zjednoduší prácu pri ukladaní ui elementov. <body class="ui container"> <div class="ui grid"> <div class="ten wide column"> message board </div> {# end ten wide column #} <div class="six wide column"> rooms </div> {# end six wide column #} </div> {# end grid #} <footer> text input </footer> </body>Môžem skúsiť naplniť tieto časti aj nejakým obsahom. Len tak zo zvedavosti, ako to bude vyzerať. Všetko bude zatiaľ len tak naoko (prototypovanie). Začneme tým najhlavnejším: message boardom <div class="ten wide column"> <h1 id="room_heading" class="ui header">Johny @ Music room</h1> <div id="msg_board"> <div class="ui mini icon message"> <i class="comment icon"></i> <div class="content"> <div class="header">Johny</div> <p>Hello there</p> </div> </div> <div class="ui mini icon message"> <i class="comment icon"></i> <div class="content"> <div class="header">Tommy</div> <p>Hi!</p> </div> </div> <div class="ui mini icon message"> <i class="comment icon"></i> <div class="content"> <div class="header">Tommy</div> <p>What's up?</p> </div> </div> </div> {# end msg board #} </div> {# end ten wide column #}Všetky správy som obalil do div s id msg_board aby som potom jednoducho vedel pridávať nové správy do tohto elementu.[Image] Spravíme to isté pre zoznam miestností. Rozhodol som sa, že do tohto bočného panelu strčíme aj formulár na zmenu mena používateľa. Ten by mal mať možnosť zmeniť svoje meno. Bude to vyzerať asi takto: <div class="six wide column"> <h4 class="ui dividing header">Change username</h4> <form id="choose_username" class="ui form" method="post"> <div class="field"> <div class="ui action input"> <input type="text" id="user_name" placeholder="username..."> <button class="ui button">Change</button> </div> </div> </form> <h4 class="ui dividing header">Rooms</h4> <form id="choose_room" class="ui form" method="post"> <div class="grouped fields"> <label for="fruit">Select available room:</label> <div id="room_list"> <div class="field"> <div class="ui radio checkbox"> <input type="radio" name="room" class="hidden" value="Lobby"> <label>Lobby</label> </div> </div> <div class="field"> <div class="ui radio checkbox"> <input type="radio" name="room" class="hidden" value="Music"> <label>Music</label> </div> </div> <div class="field"> <div class="ui radio checkbox"> <input type="radio" name="room" class="hidden" value="Movies"> <label>Movies</label> </div> </div> </div> <div class="field"> <input type="text" id="new_room" placeholder="create new room"> </div> <button class="ui button"> Change Room</button> </div> </form> </div> {# end six wide column #}[Image] Tak isto som pridal aj <input /> na vytváranie nových miestností. Myslím, že takúto možnosť by používateľ mohol mať. Poslednou skladačkou bude input pre naše správy. <footer> <form id="send_msg_to_room" class="ui form" method="post"> <div class="field"> <div class="ui fluid action input"> <input type="text" id="msg_input" placeholder="message..."/> <button class="ui button" value="send">send</button> </div> </div> </form> </footer>[Image] Momentálne mi nebudú fungovať radio buttony, pretože semantic-ui potrebuje tieto inicializovať v javascripte. Pome teda na to. Otvoríme main.js a píšeme $(document).ready(function(){ // UI HANDLERS $('.ui.radio.checkbox').checkbox(); });Tak isto môžeme rovno vybaviť iniciálne spojenie cez websockety medzi klientom a serverom. $(document).ready(function(){ var url = location.protocol + "//" + document.domain + ":" + location.port; socket = io.connect(url); // UI HANDLERS $('.ui.radio.checkbox').checkbox(); });Posielanie správ môžem rovno aj vyskúšať v konzole prehliadača. Stačí otvoriť developer tools, prejsť na záložku console a tam už môžeme písať socket.emit("test", "hello there")[Image] Avšak, nič sa nedeje, pretože môj backend ešte nie je vôbec pripravený. Vrhneme sa teda na server side a implementujeme miestnosti - room. RoomsPresunieme sa do súboru server.py a pridáme handler pre základné eventy ktoré budeme používať: join, leave, msg_board, username_change ... from flask_socketio import send, emit from flask_socketio import join_room, leave_room ... ### WEB CONTROLLER @app.route("/") def index(): return redirect(url_for("view_board")) @app.route("/board/") def view_board(): return render_template("board.jinja") ## SOCKET CONTROLLER @socketio.on("join") def on_join(data): username = data["user_name"] room = data["room_name"] join_room(room) send("{} has entered the room: {}".format(username, room), room=room) @socketio.on("leave") def on_leave(data): username = data["user_name"] room = data["room_name"] leave_room(room) send("{} has left the room: {}".format(username, room), room=room) @socketio.on("msg_board") def handle_messages(msg_data): emit("msg_board", msg_data, room=msg_data["room_name"]) @socketio.on("username_change") def username_change(data): msg = "user \"{}\" changed name to \"{}\"".format( data["old_name"], data["new_name"]) send(msg, broadcast=True) ...Eventy join, leave a username_change fungujú veľmi jednoducho. Zakaždým sa pozriem na dáta, ktoré mi prišli (premenná data) a vytvorím jednoduchú správu, ktorú potom broadcastujem na všetkých používateľov v tej danej miestnosti. Ak si už poriadne nepamätáš, čo robil ten broadcast, pospomínaj z minulého blogu. Dôležité je použitie funkcií join_room a leave_room. Tieto pochádzajú z knižnice flask-socketio, ktorú sme inštalovali na začiatku. Slúžia na to aby sme priradili danú session do nejakej miestnosti. Potom, keď pošlem správu do miestnosti, dostanú ju všetci v tej miestnosti. Je to fajn mechanizmus ako kontaktovať iných klientov a usporiadať si ich do nejakých kategórií. rooms nemusím nevyhnutne používať len na chatovú funkcionalitu. Môžem to použiť na to, aby som si zoradil používateľov do nejakej spoločnej skupiny, ktorej posielam barsjaké dáta. Dajme tomu, že by som mal appku o počasí, a nejaká skupina používateľov by mala záujem o notifikácie, či bude pršať. Tak týchto by som hodil do spoločnej skupiny - miestnosti - a notifikácie by som posielal len im. Využitie je teda všakovaké. JavaScriptBackend bol v tomto prípade celkom jednoduchý a nepotrebovali sme toho veľa implementovať. Správy sa od nášho backendu len odrážajú ako od relátka, ktorý ich ďalej rozposiela klientom. Na strane klienta toho bude trošku viacej. Pokračujeme v súbore main.js. Teraz sa pokúsime implementovať posielanie správy a zobrazenie prichádzajúcej správy na messageboard. $(document).ready(function() { ... // generate random user name if needed setRandomNameAndRoom(); // join default room joinRoom(socket); // UI HANDLERS $('.ui.radio.checkbox').checkbox(); // send message $("form#send_msg_to_room").submit(function(event) { userName = sessionStorage.getItem("userName"); roomName = sessionStorage.getItem("roomName"); msg = $("#msg_input").val(); sendMessage(socket, userName, roomName, msg); this.reset(); return false; }); // handle new message socket.on("msg_board", function(data){ msg = '<div class="ui mini icon message">'; msg += '<i class="comment icon"></i>'; msg += '<div class="content">'; msg += '<div class="header">'+data["user_name"]+'</div>'; msg += '<p>' + data["msg"] + '</p>'; msg += '</div>'; msg += '</div>'; $("#msg_board").append(msg); }); }); // HELPERS function setRandomNameAndRoom(){ if (sessionStorage.getItem("userName") == null){ randomName = "user" + Math.floor((Math.random() * 100) + 1); sessionStorage.setItem("userName", randomName); sessionStorage.setItem("roomName", "Lobby"); }; }; function joinRoom(socket){ data = { "room_name" : sessionStorage.getItem("roomName"), "user_name" : sessionStorage.getItem("userName") }; socket.emit("join", data); }; function sendMessage(socket, userName, roomName, message){ data = { "user_name" : userName, "room_name" : roomName, "msg" : msg }; socket.emit("msg_board", data); }; Na začiatok vytvoríme nejaké random meno používateľa a zvolíme default miestnosť "Lobby". To aby sme s týmto nemali starosti zatiaľ. Používame na to pomocné funkcie, ktoré si implementujeme bokom, aby nám nezavadzali. Meno používateľa a názov aktuálnej miestnosti si udržiavam v sessionStorage, čo je fajn dočasné úložisko v prehliadači. Prežije aj reload stránky a navyše sa mi tento spôsob viacej páči ako udržiavať informáciu v cookies. Keď máme potrebné dáta, môžeme sa hneď na začiatku buchnúť do nejakej miestnosti. V javascripte používame knižnicu socket.io, ktorá ale žiadny koncept miestností nepozná. Ak sa pozrieš do dokumentácie (pozor! otvor si client api), zistíš, že nič také ako rooms sa tam nespomína. Takže to je vecička knižnice flask-socketio. Použijeme teda klasický emit na handler join, ktorý existuje na servery. Tento riadok $("form#send_msg_to_room").submit( sa pomocou jquery napichne na formulár a zachytí odoslanie formuláru. Potom môžem robiť čo sa mi zachce a nakoniec vrátim false, takže formulár sa reálne ani neodošle. Odoslanie správy je priamočiare. Zistím UserName, zistím RoomName, vytiahnem si text správy a všetko pošlem do funkcie sendMessage. Táto už zabezpečí zabalanie informácií do jsonu a posielam pomocou funkcie emit. Posielam na handler msg_board, ktorý som si spravil pred chvíľkou. Ostáva mi vyriešiť prijatie správy. To robím pomocou funkcie socket.on, kde dám kód, ktorý sa vykoná pri prijatí správy. Tu si jednoducho (ale zato strašne škaredo) pozliepam kus HTML, ktoré potom strčím na koniec elementu s id msg_board. Predtým, ako to budeš skúšať, je fajn si ešte vymazať tie fejkové správy, ktoré sme tam dali natvrdo do HTML. Takže mažeme tieto riadky <div class="ten wide column"> <h1 id="room_heading" class="ui header">Johny @ Music room</h1> <div id="msg_board"> ---> <div class="ui mini icon message"> ---> <i class="comment icon"></i> ---> <div class="content"> ---> <div class="header">Johny</div> ---> <p>Hello there</p> ---> </div> ---> </div> ---> <div class="ui mini icon message"> ---> <i class="comment icon"></i> ---> <div class="content"> ---> <div class="header">Tommy</div> ---> <p>Hi!</p> ---> </div> ---> </div> ---> <div class="ui mini icon message"> ---> <i class="comment icon"></i> ---> <div class="content"> ---> <div class="header">Tommy</div> ---> <p>What's up?</p> ---> </div> ---> </div> </div> {# end msg board #} </div> {# end ten wide column #}Pome teda ako ďalšiu vec vybaviť zmenu používateľského mena. $(document).ready(function(){ ... // set heading updateHeading(); // set user name handler $("form#choose_username").submit(function(event){ // get old and new name var oldName = sessionStorage.getItem("userName"); var newName = $("#user_name").val(); //save username to local storage sessionStorage.setItem("userName", newName); // change ui updateHeading(); // notify others notifyNameChange(socket, oldName, newName); //clear form this.reset(); return false }); }); function updateHeading(){ roomName = sessionStorage.getItem("roomName"); userName = sessionStorage.getItem("userName"); $("#room_heading").text(userName + " @ " + roomName); }; function notifyNameChange(socket, oldName, newName){ data = { "old_name" : oldName, "new_name" : newName } socket.emit("username_change", data); };Tak ako pri posielaní správy, napichnem sa na HTML formulár a spracujem ho ešte pred odoslaním. Zmeny uložím do sessionStorage. Pridal som ešte 2 vychytávky. • funkcia updateHeading nastaví aktuálny názov miestnosti a používateľa ako hlavičku stránky, • notifyNameChange dá všetkým používateľom vedieť, že si niekto zmenil meno. Meno si už môžem meniť, ale notifikáciu o zmene som nedostal. Na to ešte musíme doplniť jeden event handler na message $(document).ready(function(){ ... // system message socket.on("message", function(data){ msg = '<div class="ui mini icon info message">'; msg += '<i class="bell icon"></i>'; msg += '<div class="content">'; msg += '<p>' + data + '</p>'; msg += '</div>'; msg += '</div>'; $("#msg_board").append(msg); }); }); ...Teraz sa nám začnú zobrazovať aj systémové notifikácie o tom, čo sa deje. Kto vošiel do miestnosti, kto ju opustil alebo kto si zmenil meno. Poslednou vecou, ktorú musíme spraviť, je selekcia miestností. Toto bude vyžadovať trošku viacej práce. Zoznam existujúcich miestností si musíme udržiavať na backende. Ani na klientskej časti ani na backende z knižnice flask-socketio neviem získať zoznam všetkých miestností. Musím si ho teda udržiavať sám. from flask import g ... DEFAULT_ROOMS = ["Lobby"] ... @app.route("/board/") def view_board(): all_rooms = getattr(g, "rooms", DEFAULT_ROOMS) return render_template("board.jinja", rooms=all_rooms) ... ### SOCKET CONTROLLER @socketio.on("join") def on_join(data): username = data["user_name"] room = data["room_name"] all_rooms = getattr(g, "rooms", DEFAULT_ROOMS) if room not in all_rooms: all_rooms.append(room) emit("handle_new_room", {"room_name" : room}, broadcast=True) join_room(room) send("{} has entered the room: {}".format(username, room), room=room)Do templejtu board.jinja som si začal posielať nejaké dáta. Vyhodím teda tie fejkové, ktoré sú tam natvrdo, a spravíme loop, v ktorom pridám všetky existujúce miestnosti. <div id="room_list"> {% for room in rooms %} <div class="field"> <div class="ui radio checkbox"> <input type="radio" name="room" class="hidden" value="{{room}}"> <label>{{room}}</label> </div> </div> {% endfor %} </div>Pokračujem v súbore main.js, kde si vytvorím funkcie, ktoré sa postarajú o zmenu miestnosti + ak bola vytvorená nová, tak ju pridám do zoznamu. $(document).ready(function(){ ... // set room name heading selectCurrentRoom(); updateHeading(); ... // set room handler $("form#choose_room").submit(function(event){ newRoom = getRoomName(); // first leave current room leaveRoom(socket); // set new room sessionStorage.setItem("roomName", newRoom); updateHeading(); // join new room joinRoom(socket); //clear input newRoom = $("#new_room").val(""); //clear message board $("#msg_board").text(""); return false; }); socket.on("handle_new_room", function(data){ item = '<div class="field">'; item += '<div class="ui radio checkbox">'; item += '<input type="radio" name="room" class="hidden" value="'+ data["room_name"] + '">'; item += '<label>' + data["room_name"] + '</label>'; item += '</div>' item += '</div>' $("div#room_list").append(item); selectCurrentRoom(); }); }); ... function leaveRoom(socket){ data = { "room_name" : sessionStorage.getItem("roomName"), "user_name" : sessionStorage.getItem("userName") }; socket.emit("leave", data); }; function selectCurrentRoom(){ currentRoom = sessionStorage.getItem("roomName") $(".ui.radio.checkbox").checkbox().each(function(){ var value = $(this).find("input").val(); if (value == currentRoom){ $(this).checkbox("set checked"); }; }); }; function getRoomName(){ roomName = $("#new_room").val(); if (roomName == ""){ roomName = $("input[type='radio'][name='room']:checked").val(); }; return roomName; };Je tu viacero pomocných funkcií, ktoré mi pomáhajú pri výbere miestnosti alebo pri vytváraní novej. Problematické časti nastávajú práve v tedy, keď chcem miestnosť aj vytvárať. V podstate ale nejde o žiadne komplikované veci. Funkcia selectCurrentRoom mi pomôže prehodiť radio button pri zmene miestnosti. Tým, že používame semantic-ui tak sa nám to tiež trošku skomplikovalo, ale výsledok stojí za to.[Image] ZáverPostavili sme takzvaný proof of concept, spravili sme chatovaciu appku len pomocou websocketov. Nie je to dokonalé a určite je tam veľa múch, to nám však nebránilo pochopiť ako fungujú websockety. Všetky správy žijú len v prehliadači používateľa a nie sú uložené na žiadnom serveri. Niekto to môže považovať za chybu, niekto za fičúru. To už nechám na vás. Celý projekt sa dá stiahnuť tu. Onedlho sa opäť vrhneme na nejakú zaujímavú tému ;)