abclinuxu.cz AbcLinuxu.cz itbiz.cz ITBiz.cz HDmag.cz HDmag.cz abcprace.cz AbcPráce.cz
AbcLinuxu hledá autory!
Inzerujte na AbcPráce.cz od 950 Kč
Rozšířené hledání
×
    včera 17:33 | Pozvánky

    Spolek OpenAlt zve příznivce otevřených řešení a přístupu na 211. sraz, který proběhne v pátek 19. září od 18:00 ve Studentském klubu U Kachničky na Fakultě informačních technologií Vysokého učení technického na adrese Božetěchova 2/1. Na srazu proběhne přednáška Jiřího Eischmanna o nové verzi prostředí GNOME 49. Nemáte-li možnost se zúčastnit osobně, přednáškový blok bude opět streamován živě na server VHSky.cz a následně i zpřístupněn záznam.

    Ladislav Hagara | Komentářů: 0
    včera 01:33 | IT novinky

    Microsoft se vyhnul pokutě od Evropské komise za zneužívání svého dominantního postavení na trhu v souvislosti s aplikací Teams. S komisí se dohodl na závazcích, které slíbil splnit. Unijní exekutivě se nelíbilo, že firma svazuje svůj nástroj pro chatování a videohovory Teams se sadou kancelářských programů Office. Microsoft nyní slíbil jasné oddělení aplikace od kancelářských nástrojů, jako jsou Word, Excel a Outlook. Na Microsoft si

    … více »
    Ladislav Hagara | Komentářů: 3
    12.9. 14:00 | Nová verze

    Samba (Wikipedie), svobodná implementace SMB a Active Directory, byla vydána ve verzi 4.23.0. Počínaje verzí Samba 4.23 jsou unixová rozšíření SMB3 ve výchozím nastavení povolena. Přidána byla podpora SMB3 přes QUIC. Nová utilita smb_prometheus_endpoint exportuje metriky ve formátu Prometheus.

    Ladislav Hagara | Komentářů: 0
    12.9. 12:00 | Zajímavý článek

    Správcovský tým repozitáře F-Droid pro Android sdílí doporučení, jak řešit žádosti o odstranění nelegálního obsahu. Základem je mít nastavené formální procesy, vyhrazenou e-mailovou adresu a být transparentní. Zdůrazňují také důležitost volby jurisdikce (F-Droid je v Nizozemsku).

    🇵🇸 | Komentářů: 20
    12.9. 05:33 | Bezpečnostní upozornění

    Byly publikovány informace o další zranitelnosti v procesorech. Nejnovější zranitelnost byla pojmenována VMScape (CVE-2025-40300, GitHub) a v upstream Linuxech je již opravena. Jedná se o variantu Spectre. KVM host může číst data z uživatelského prostoru hypervizoru, např. QEMU.

    Ladislav Hagara | Komentářů: 0
    11.9. 22:00 | Komunita

    V červenci loňského roku organizace Apache Software Foundation (ASF) oznámila, že se částečně přestane dopouštět kulturní apropriace a změní své logo. Dnes bylo nové logo představeno. "Indiánské pírko" bylo nahrazeno dubovým listem a text Apache Software Foundation zkratkou ASF. Slovo Apache se bude "zatím" dál používat. Oficiální název organizace zůstává Apache Software Foundation, stejně jako názvy projektů, například Apache HTTP Server.

    Ladislav Hagara | Komentářů: 16
    11.9. 17:33 | Nová verze

    Byla vydána (𝕏) srpnová aktualizace aneb nová verze 1.104 editoru zdrojových kódů Visual Studio Code (Wikipedie). Přehled novinek i s náhledy a videi v poznámkách k vydání. Ve verzi 1.104 vyjde také VSCodium, tj. komunitní sestavení Visual Studia Code bez telemetrie a licenčních podmínek Microsoftu.

    Ladislav Hagara | Komentářů: 1
    11.9. 15:33 | IT novinky

    Spotify spustilo přehrávání v bezztrátové kvalitě. V předplatném Spotify Premium.

    Ladislav Hagara | Komentářů: 0
    11.9. 15:00 | IT novinky

    Spoluzakladatel a předseda správní rady americké softwarové společnosti Oracle Larry Ellison vystřídal spoluzakladatele automobilky Tesla a dalších firem Elona Muska na postu nejbohatšího člověka světa. Hodnota Ellisonova majetku díky dnešnímu prudkému posílení ceny akcií Oraclu odpoledne vykazovala nárůst o více než 100 miliard dolarů a dosáhla 393 miliard USD (zhruba 8,2 bilionu Kč). Hodnota Muskova majetku činila zhruba 385 miliard dolarů.

    Ladislav Hagara | Komentářů: 7
    10.9. 21:22 | Nová verze

    Bylo vydáno Eclipse IDE 2025-09 aneb Eclipse 4.37. Představení novinek tohoto integrovaného vývojového prostředí také na YouTube.

    Ladislav Hagara | Komentářů: 0
    Pro otevření více webových stránek ve webovém prohlížečí používám
     (81%)
     (7%)
     (3%)
     (3%)
     (4%)
     (2%)
    Celkem 175 hlasů
     Komentářů: 12, poslední 10.9. 13:00
    Rozcestník

    React.js a JSX na localhostu

    6.3.2018 10:23 | Přečteno: 3226× | To jsem vážně jediný? | Výběrový blog | poslední úprava: 6.3.2018 10:23

    Když jsem byl loni konce léta na svatbě našich přátel, obrátil se tam na mne s dětskou důvěrou kamarádův jedenáctiletý syn – začal se zajímat o to jak se dělají webové stránky a tak chtěl vysvětlit jak to všechno funguje. S hrůzou jsem si uvědomil kolik jsem toho za ty roky zapoměl. Ovšem takové zapomínání není úplně na škodu, protože se tím zbavíte i zažitých postupů, které už jsou dávno obsolete. Každopádně mne tím přinutil abych se zase po nějakém čase podíval na věci kolem webu a javascriptu. A to jsem netušil, jak brzy se mi to bude hodit.

    V prosinci jsem konečně dostal do použitelné podoby djvutool shellový tool pro práci s DjVu soubory, když moji pozornost upoutal DjVu.js Podle všeho v rámci tohoto repozitáře oprášil Nikolaj Suchanov svůj původní javascriptový kód pro čtení obrazové informace DjVu souborů z r. 2014 a přepsal ho do ECMA6.

    Tím ovšem defakto vyřešil můj základní problém, který stál v mé cestě za dlouhodobým cílem – mít k dispozici multiplatformní nástroj pro práci s DjVu soubory. Javascriptový editor pro úpravy textové vrstvy DjVu souborů už totiž existuje – WebDjVuTextEd. Má však jednu zásadní vadu – je závislý na nástrojích DjVuLibre, stejně jako ten můj shellový skript.

    Skloubením těchto dvou aplikací však lze vytvořit aplikaci zcela multiplatformní, použitelnou bez ohledu na OS. Pěkná myšlenka, není-liž pravda? Ti co se o věc zajímají vědí, že ani komerční nástroje pro práci s DjVu soubory (které už dávno nejsou k dispozici) nikdy neměly tak komfortní možnosti úpravy textové vrstvy. O metadatech ani nemluvě.

    Vyhrabal jsem tedy z hloubi duše trosky a pustil se do studia kódu DjVu.js To pro mne znamenalo především se dokopat k podrobnějšímu seznámení s využitím javascriptových konzolí a debuggerů, co nabízejí moderní weboví prohlížeče. Tyjo, mít takový luxus na zkoumání kódu v oněch dřevních dobách, to by byla jiná káva. No nic.

    Především jsem zjistil, že autor DjVu.js začal přepracovávat svůj původní, víceméně nezávislý kód způsobem, který se mi moc nelíbí. Chápu jeho pohnutky, ale nevidím nejmenší důvod, proč bych měl kvůli dvou tří víceméně statických knihoven stahovat dalších 250MB dat. Následující text tedy nebude o mém zápolení s javascriptem, ale o tom jak se tomu vyhnout.

    Původní kód DjVu.js pracoval s knihovnou jQuery (v2.1.1). Současná verze používala verzi novější, ale autor se rozhodl místo ní použít React.js

    Nic proti, React.js je rozhodně správná volba, ale přiznám se, že jsem tím nadšen nebyl, protože tím pádem přestaly fungovat starší části jeho kódu, které řešily věci, které jsem potřeboval. A s postupem spojeným s instalací npm jsem k rozumnému výsledku nedošel. Problém totiž spočíval v tom, že svůj DjVu prohlížeč dělá primárně k webovému nasazení, kdežto mým záměrem je aby aplikace fungovala i bez toho že by byla závislá na webovém připojení.

    Vrátil jsem se tedy nejprve ke starší verzi jeho kódu, kde byla k dispozici knihovna jquery-3.2.1.min.js abych mohl zjistit na čem kód DjVu.js havaruje. Což se mi podařilo. A když už jsem byl v tom, dopsal jsem si i věci, které mu chybí - především jde o třídy pro zpracování skryté textové vrstvy a metadat.

    Pak přišel na řadu druhý krok. Klíčovou výhodou pro nasazení React.js je skutečnost, že umožňuje dynamicky přegenerovat dílčí nody DOM modelu stránky přímo javascriptem, aniž by při tom bylo nutné pokaždé znovu načítat celý DOM objekt. U původní stránky to bylo řešeno tak, že se měnilo javascriptem nastavení atributu viditelnosti u div elementů.

    Ovšem jak to udělat, aniž by bylo nutné instalovat to zpropadené Node.js?

    Odpověď na mou otázku mi dal blogpost, který před dvěma lety napsal Shing Lyu. Až dodatečně jsem pak zjistil, že ani ne před měsícem publikoval jeho aktualizovanou verzi. Nechci tady uvádět tupý překlad jeho blogpostu, takže se omezím pouze na detail.

    Shing Lyu ve svém blogpostu uvádí, jak přilinkovat potřebné knihovny tak, aby nebylo nutné používat npm. Já osobně jsem si raději potřebné knihovny stáhnul rovnou do prepozitáře, abych nebyl závislý na připojení, když chci na kódu pracovat offline. Navíc zkušenost s aplikací WebDjVuTextEd mě poučila, že je lepší mít všechny potřebné kódy pohromadě, než spoléhat na to, že budou ke stažení z původní lokace navždy.

    Stáhnul jsem si tedy jak verze development, se kterými se lépe pracuje při trasování kódu, tak verze komprimované – pro budoucí finální použití.

    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Test</title>
        <script type="text/javascript" src="app/react.development.js"></script>
        <script type="text/javascript" src="app/react-dom.development.js"></script>
        <script type="text/javascript" src="app/babel.js"></script>
    </head>
    
    <body>
    <div id='root'>
    <script type="text/babel">
    function tick() {
      const element = (
        <div>
          <h1>Hello, world!</h1>
          <h2>It is {new Date().toLocaleTimeString()}.</h2>
        </div>
      );
      ReactDOM.render(element, document.getElementById('root'));
    }
    
    setInterval(tick, 1000);
    </script>
    </div>
    </body>
    </html>
    
    Upozorňuji na zvýrazněnou část kódu - bez ní JSX syntaxe (kterou zpracovává babel.js) fungovat nebude.        

    Hodnocení: 100 %

            špatnédobré        

    Tiskni Sdílej: Linkuj Jaggni to Vybrali.sme.sk Google Del.icio.us Facebook

    Komentáře

    Vložit další komentář

    6.3.2018 21:34 Aleš
    Rozbalit Rozbalit vše Re: React.js a JSX na localhostu
    Ahoj, Posílám ti lepší variantu. Určitě bych stále nezahazoval celou React inicializaci, ale použil state v rámci React komponenty.

    Příklad zde:

    https://codepen.io/anon/pen/rJXMBb?editors=1010
    6.3.2018 22:04 Want
    Rozbalit Rozbalit vše Re: React.js a JSX na localhostu
    To byl jen narychlo plácnutý příklad. Ke konkrétnímu řešení se dostanu až bude chvíli čas. Navíc budu muset v prvé řadě přepsat část původního kódu pro ty DjVu dokumenty. Autor kupř. vůbec nepočítal s náhledy. Navíc je zbytečné zpracovávat celý dokument najednou. A některé funkcionality v těch třídách chybí zcela. Ale určitě díky za každý zajímavý tip.
    =^..^= AmigaPower® avatar 7.3.2018 11:26 =^..^= AmigaPower® | skóre: 30 | blog: BLB | Praha
    Rozbalit Rozbalit vše Re: React.js a JSX na localhostu
    Jo jo, člověk zapomíná kurevsky rychle, já chtěl nedávno něco předělat na webu a zkončil jsem u<head> :-D Když jsem si otevřel jakpsatweb.cz, tak mi to sice začlo všechno zas docházet, ale stejně jsem se musel koukat na každej atribut jak se píše, protože to dělám v KWrite a ten validitu nemá jak zkontrolovat :-D
    ISSN 1214-1267   www.czech-server.cz
    © 1999-2015 Nitemedia s. r. o. Všechna práva vyhrazena.