Browsed by
Archiv pro štítek: Javascript

React Workshop

React Workshop

Připravujeme další z našich otevřených vývojářských workshopů, tentokrát zaměřený na React, který se uskuteční v sobotu 25.2.2017 od 10h v Plzni na adrese náměstí Republiky 28 (https://www.id-sign.com/kontakt). Místo může být v případě velkého zájmu změněno, proto prosím sledujte naší FB stránku ať vám neuniknou žádné změny. K akci je rovněž i vytvořena FB událost a registrovat se lze na srazy.info

V průběhu workshopu vás Jarda Šnajdr provede základními principy Reactu, vysvětlí klíčové vlastnosti a pokud si přinesete svůj počítač, tak vám pomůže napsat vaší první reactí aplikaci :-) Plánovaná osnova workshopu je následující:

  • Základní principy a proč je React tak populární?
  • Komponenty, rendering, virtuální DOM
  • Změny stavu, obsluha událostí
  • Flux, Redux, Immutable – architektura aplikace
  • Jak optimalizovat rychlost a spotřebu paměti

Pro koho je workshop určen? Pro všechny zájemce o React, kteří chtějí pomoci se začátkem, mají alespoň základní znalost javascriptu a ES6 syntaxe a v počítači funkční npm příkaz. Pokud něco z toho nesplňujete, tak čas zbývající do workshopu můžete vyplnit nápravou.

Naučte se s námi React nebo Symfony

Naučte se s námi React nebo Symfony

Připravujeme krásný projekt, který bude startovat ve více zemích EU a má potenciál ovlivnit určitý trh obdobně, jako bezrealitky.cz ovlivnily realitní trh. Tentokrát v celoevropském měřítku.

Technicky se jedná o frontend v Reactu a backend v Symfony. Zdatní frontend developeři, kteří umí, nebo mají chuť naučit se React by byli velmi vítané posily týmu. Obdobná nabídka platí i pro PHP vývojáře, kteří buďto mají zkušenost se Symfony, nebo mají chuť se jej naučit pod vedením zkušených borců :-)

Více se o nás můžete dozvědět na stránce o nás, co jsme již dokázali na přehledu našich projektů a koho hledáme a co nabízíme na stránce kariéry v iD-SIGN.

Ke kontaktu a zvídavým otázkám můžete využít jak kontaktní formulář, tak i email info@id-sign.com. Rádi vás přivítáme! :-)

Získání GPS polohy v prohlížeči

Získání GPS polohy v prohlížeči

UPDATE:
Prohlížeč Chrome od verze 50 považuje informace o poloze uživatele za soukromá data a přes Geolocation API je zpřístupňuje pouze na stránkách zabezpečených HTTPS protokolem.

========================

Mobilní telefon máme v kapse skoro všichni a snadno jsme si zvykli, že jsou zobrazované informace přizpůsobené naší poloze. Je to komfortní, dokáže to ušetřit spoustu času a přitom je velmi jednoduché se prohlížeče na aktuální polohu zeptat.

Využívá se k tomu Geolocation API, které má dnes již širokou podporu, viz. caniuse.com. Komunikace s API je velmi jednoduchá a stačí ošetřit několik možných stavů.

Definice metody geolocation.getCurrentPosition je do velké míry samovysvětlující:

 navigator.geolocation.getCurrentPosition(success, error, options) 
  • v success poskytujeme callback pro úspěšně získanou polohu,
  • v error poskytneme callback pro případ odmítnutí poskytnutí polohy a
  • v options můžeme upřesnit dodatečné volby metody

více informací můžete získat třeba na stránce MDN

Firefox

Zde nám do toho zákeřně vstupuje Firefox se svojí volbou „Nyní ne„, která oproti všem očekáváním nevyvolá error callback. Nevyvolá totiž žádnou událost. Z pohledu kódu se poté zdá, že se uživatel stále nerozhodl jestli sdílení polohy povolí, nebo odmítne.

Jako nejrozumnější reakce na tento stav se mi jeví vyvolat po nějaké době vhodnou akci pomocí setTimeout() a tento timeout rušit pokud uživatel zareaguje dříve než se tento timeout provede.

Ukázka kódu

V ukázce si připravíme dvě jednoduché metody. V první nastavíme timeout pokud nedostaneme do 5 vteřin žádnou reakci a vytvoříme callbacky pro jednotlivé stavy. Na konci vyvoláme druhou metodu pro získání vlastní polohy:


var showPosition = function () {
    var timeout = setTimeout(function() {
        console.log("Timeout vyprsel...");
    }, 5000);
    
    var success = function (position) {
        clearTimeout(timeout);
        console.log("Ziskani polohy povoleno", position);
    };
    
    var failure = function(error) {
        clearTimeout(timeout);
        console.log("Poloha nedostupna...", error);
    };

    getPosition(success, failure);
};

Ve druhé metodě již komunikujeme s API a pomocí poskytnutých callbacků si vrátíme patřičné odpovědi. V případě úspěšného získání polohy to bude objekt se souřadnicemi, jinak chybový objekt:


var getPosition = function (success, failure) {
    var available = function (location) {
        var lat, lng, acc;
        lat = location.coords.latitude;
        lng = location.coords.longitude;
        acc = location.coords.accuracy;

        success({lat: lat, lng: lng, acc: acc});
    };
    
    var unavailable = function(error) {
        failure(error);
    };
    
    var options = {enableHighAccuracy: true, timeout: 5000, maximumAge: 0};

    navigator.geolocation.getCurrentPosition(available, unavailable, options);
};

To je vše. Nyní byste v konzoli měli vidět vaše souřadnice :-)

Pokud toto vyzkoušíte třeba v klasickém desktopovém prohlížeči na notebooku, tak nemusí být souřadnice přesné. V závislosti na vašem připojení, nebo poskytovateli připojení mohou být i velmi nepřesné a nemusí souhlasit ani kraj. Nicméně tento způsob získávání informací o poloze uživatele je asi nejpřesnější z dostupných a v mobilních zařízeních se zapnutou GPS funguje velmi spolehlivě.