pátek 14. listopadu 2014

Fulltext česky pomocí Djanga a Elasticsearch

Fulltextové vyhledávání je k mojí nelibosti celkem často na webu opomíjená funkce. Klasickým argumentem, proč fulltext nedělat je zpravidla, že je to složité a hrozně časově náročné udělat. Klient je často uveden v omyl, že spolehlivé fulltextové vyhledávání je práce na týden a tak mnohdy vítězí buď varianta ne-fulltextová, nebo (častěji) Custom Search od Google. Dnes si ukážeme, že opak je pravdou a že dobře fungující fulltext je dneska spíše otázkou hodin.

pondělí 20. října 2014

Ako vyrobiť statický web efektívne

Jedna z mojich posledných úloh v práci bola vytvoriť web prezentáciu pre nášho klienta. Žiadna server-side funcionalita, čisté HTML stránky. Je to jednoduchá vec - nie je potrebný programátor, žiadna databáza dá sa to nasadiť na ktorýkoľvek hosting.

Celé to zvládne jeden človek za pár dní. Háčik je ale v tom, že ak máme takýto statický web, každá stránka má v sebe z väčšej časti opakujúci sa kód a pri každej zmene je potrebné upraviť všetky stránky. Vec sa ešte komplikuje ak má byť web vo viacerých jazykoch. Riešením je napríklad vyhľadávanie a premenovávanie nad všetkými súbormi, to ale môže spôsobiť veľa problémov, ak sa človek pomýli a nevie už niektoré zmeny vrátiť späť. A mýli sa každý.

úterý 2. září 2014

Jak jsme udělali Žanetu

 Po čase realizujeme projekt (500+ MD), který má všech "pět pé":
  • baví nás,
  • zákazník je spokojen,
  • je dodán včas,
  • zákazník řádně a včas platí,
  • dostali jsme další související zakázky.
Jmenuje se Žaneta a je to systém na správu zájezdů pro CK Adventura a CK China Tours.

pondělí 11. srpna 2014

Creating Modular Menus in AngularJS

Recently, I had to design an AngularJS application that would be highly modular. The idea was to let each module to create its own menu items and its own routes.

pondělí 9. června 2014

Analýza? Prototyp? Obojí!

Prototyp > analýza

Je známo, že prototyp/mock up uživatelského rozhraní, pokud je tvořen správně, dokáže zcela nahradit značnou část úvodní analýzy. Zejména v případech, kdy je zákazník technikou nepolíben, nemá podle mého valný smysl předvádět znalosti UML modelování a zahrnovat ho desítkami diagramů a mnoha stránkami popisu. Ukázaná platí!

středa 14. května 2014

CoffeeScript a OOP

Dlouho jsem nemohl přijít CoffeeScriptu na chuť. Přišlo mi, že za málo muziky nabízí hodně potíží. Co mě nakonec přesvědčilo, byla schopnost, po které jsem v JavaScriptu přímo prahnul: Psát skutečné třídy a objekty.

úterý 29. dubna 2014

Host a static site on heroku.com

Recently I needed to publish a simple HTML / CSS / JS GUI prototype application for our client. Just for them to see how it would look like with basic workflow.
So I asked our administrator where should I put it. He told me that despite of it's very easy to have some Apache running on our virtual, we didn't have something like that because there's no need for it.

čtvrtek 13. března 2014

Angular.js daterangepicker

Filip a Tibor při posledním projektu narazili na to, že pro Angular neexistuje žádný pořádný daterange picker – tedy komponenta, která umožní vybrat rozsah dvou datumů.
Protože jsou to kluci šikovní, tak se hned pustili do nápravy tohoto smutného stavu :)

úterý 11. března 2014

BorIS - moderní systém pro nepopulární sektor

O Borisovi jsme na blogu už jednou psali. Jen pro připomenutí: BorIS je elektronická databáze evidence výkonů v terénních programech drogových služeb. Pracovníci neziskové organizace zadávají a sdílí (mezi sebou) data o klientech a provedených výkonech – to znamená konzultace, terapie, výměny jehel, prohlídky a podobné záležitosti.

pátek 7. února 2014

Píšeme desktopové aplikace v HTML



Nedávno jsem do mailu (díky Honzo!), dostal článek o tom, že Chrome Desktop Apps už fungují i na mobilu.
Na článku mě upřímně nejvíc zaujalo to, že vůbec nějaké Chrome Desktop Apps existují. No a samozřejmě jsem to potřeboval vyzkoušet.
Na žádném "pracovním" projektu se to dvakrát nehodilo, tak jsem si řekl, že moje vařítko čaje si taky zaslouží trochu lásky. Netrvalo to ani den a podařilo se mi překlopit webovou stránku do jednoduché aplikace!


Co jsou Chrome Web Apps?

Malá odbočka pro ty z vás, co (stejně jako já) až do dneška netušili, že něco takového existuje.
Chrome Web Apps jsou webové aplikace, které se ale tváří jako "normální" Windows/Mac/Linux aplikace. To znamená, že ve Windows je najdete přímo ve Start menu (v záložce Chrome Apps), můžete si dát zástupce na plochu atd.
Navíc u nových verzí Chrome je dole na liště tzv. Chrome App Launcher, což je jednoduchý způsob, jak spustit konkrétní aplikaci.


Jak to šlo?

Zdrojový kód původní aplikace je relativně jednoduchý – v zásadě jde o jednu HTML stránku a kus Javascript (popravdě Coffeescript) kódu v AngularJS.
HTML šlo pryč víceméně celé. Ne, že by nešlo použít, ale potřeboval jsem uživatelské rozhraní aplikace razantně zmenšit – aplikace má rozměr jen 380x380 pixelů.
V obou případech jsem použil Twitter Bootstrap, nemusel jsem tedy nic vymýšlet a jen přepsal těch pár divů a výběr čajů dal do select boxu místo radio buttonů, co jsou na webu.
Původně jsem si maloval, že v Javascriptu nebudu muset dělat změny žádné, ale opak byl pravdou. Spoustu kódu jsem naštěstí mohl vyhodit – webová verze musí kontrolovat, zda je použitý správný prohlížeč a zda jsou k dispozici webové notifikace. To šlo všechno pryč.

Změnit se musely dvě věci: Ukládání nastavení, protože desktopová aplikace nemůže použít localStorage, ale musí používat chrome.storage.*. Zase ale se nastavení automaticky (`chrome.storage.sync`) sdílí mezi všemi počítači konkrétního uživatele.
Druhá změněná věc bylo samotné vyvolání notifikace – opět je třeba použít chrome rozhraní. I když tohle asi nebylo 100% nutné.

Poslední věc bylo uklizení kódu, odstranění jednoho zbytečného kontroleru a vyhození JQuery. Tohle ale asi udělám i ve webové verzi a budu se snažit kód trochu sjednotit.

Výsledek? Kdybych od začátku počítal s desktopovou verzí, mohl jsem si ušetřit spoustu práce. Ať už správným použitím kombinace col-xs-* a col-md-* tříd v HTML nebo trochou abstrakce v Javascriptu, kdy bych si obalil volání notifikací a localStorage nějakým proxy objektem.
Ale ani takhle nešlo o nic hrozného, zabralo mi to asi 4-5 hodin času.

Jen výsledný zdroják je zatím v samostatné větvi, sdílení kódu mezi webem a desktopem musím teprve vyřešit.


Hurá do světa

Paradoxně nejvíc času a bádání mi zabralo vydání aplikace do Chrome Web Store. Nějak jsem nepochopil oficiální postup zabalení a vydání aplikace.
Takže pro příští generace (a pro mě za půl roku) tu raději sepíšu svůj vlastní návod:
  1. Aplikace se "zabalí" pomocí "Pack extension" přímo v prohlížeči Chrome. Tento krok je nutný pouze pro distribuci aplikace mimo Chrome Web Store nebo pro vyzkoušení instalace aplikace.
  2. Celý adresář s aplikací se zabalí do zip souboru. Soubor manifest.json musí být v kořeni zipu.
  3. Tento zip soubor se nahraje na Chrome Web Store a vydá.
  4. Zabalená aplikace z prvního kroku se nikam nenahrává, do zipu nepatří, prostě je na nic!
Vydanou aplikaci můžete samozřejmě nainstalovat. z Chrome Web Store. A dejte mi vědět, jak chodí?


Mobilní verze

A běží i na mobilu? No jéje!

Ale o tom až příště.

pondělí 3. února 2014

Chraňte svoje hesla! Aneb kdo si to má všechno pamatovat?

Před časem jsem řešil s dlouholetým zákazníkem problém v námi dodaném systému. Abych mohl problém analyzovat, potřeboval jsem do onoho systému přístup, který jsem však neměl. V rámci zrychlení celé akce došlo k tomu, že mi zákazník své přihlašovací údaje začal diktovat do telefonu (ano, ani to není ideální). Pozorně jsem začal psát. "Uživatelské jméno je Petr, vše malými písmeny." "A heslo je Petr1959, také malými písmeny," sdělil mi pan Petr Novák.

Na první pohled je jasné, že s heslem není něco v pořádku. Nicméně dnes nechci psát o tom, že heslo typu "petr1959" je úplně k ničemu, ale chci psát o tom, jak si pamatovat hesla, pokud jich máte opravdu hodně, chcete je mít stále k dispozici a zároveň chcete, aby tato hesla byla alespoň trochu v bezpečí.

Požadavky na "systém", kterému hesla svěřím:
  • bezpečnost dat - nemohu o hesla jednoduše přijít / zálohování
  • přístupnost - potřebuji hesla když sedím u počítače, stejně tak když jsem někde v terénu jen s mobilním telefonem
  • opensource - systém úschovy hesel by neměl být služba typu LastPass, což není z důvodu, že bych za to nechtěl platit :-)
  • sdílení hesel - možnost některá hesla sdílet s někým jiným
  • nezávislost na platformě - OS X, Windows, Linux, Android, IOS...
  • integrace do webového prohlížeče - Nice To Have :-)
Password Gorilla
Při hledání jsem našel jen několik aplikací pro ukládání "hesel", které by splňovaly to, co jsem požadoval. Nakonec jsem zvolil aplikaci Password Gorilla pro desktop a pro Android aplikaci PasswdSafe.

Takže jak jsou na tom mé jednotlivé požadavky vs. realita?


Bezpečnost dat

Díky tomu, že jsou "hesla" ukládána v datovém souboru, není nic jednoduššího, než tento soubor přidat do běžné zálohy. Datový soubor mám samozřejmě zabezpečen dostatečně dlouhým heslem (30+ znaků).

Přístupnost

Datový soubor mám uložen "v cloudu" (Google Drive, Dropbox...), čímž ho mám přístupný na všech zařízeních, kde ho potřebuji. Na Mac mám soubor syncovaný přes Insync. Na Android pak otevírám datový soubor přes standardní Drive aplikaci v readonly režimu, což mi dostačuje.

Opensource

Jak Password Gorilla, tak i PasswdSafe jsou opensource projekty.

Sdílení hesel

Tam, kde potřebuji hesla sdílet s někým dalším (například všemožné webové přístupy do různých služeb), mám tato hesla uložena ve vlastním datovém souboru, který v "cloudu" s dotyčným sdílím.

Nezávislost na platformě

Celé řešení mám vyzkoušené pouze na OS X a Android, ale předpokládám, že vše bude fungovat stejným způsobem i na ostatních platformách, viz. informace na GitHubu.

Integrace do webového prohlížeče

Tohle jsem zatím nevyřešil a zatím ani nenalezl nikoho, kdo by ve stacku mnou vybraných aplikací vyřešil. Zároveň se ale ukazuje, že tento požadavek pro mě není zásadní a v tuto chvíli mě příliš nevadí.

PasswdSafe

FAQ - aneb na co je dobré ještě myslet


Na Androidu mám nainstalovanou aplikaci PasswdSafe, ale když chci otevřít datový soubor z aplikace Drive, tak ten se nedá otevřít.

Datový soubor je potřeba pojmenovat tak, aby měl příponu ".psafe3".

Jaká všechna hesla si tedy reálně musím zapamatovat?

Jednoznačně je potřeba si zapamatovat heslo k datovému souboru. Tím, že budete datový soubor pravděpodobně "odemykat" poměrně často, neměl by být problém si složité heslo brzy zapamatovat.

Další heslo, které by bylo dobré si zapamatovat, je do vašeho "cloudu", ideálně s dvou úrovňovou autorizací. Představte si situaci, kdy budete v zahraničí a přijdete o notebook i mobilní telefon a záloha bude tisíce kilometrů daleko. V tuto chvíli musíte být schopni zprovoznit celé řešení na novém zařízení, což bude předpokládat i to, že jste si schopni stáhnout datový soubor z vašeho cloudu.

Závěr

Závěrem už jen budu konstatovat, že jsem s výše popsaným řešením pro tuto chvíli spokojený. Minimálně jsem se s kvalitou hesel posunul z "nuly na sto", což považuji za dobrý první krok.

A co vy? Jak se staráte o svá hesla? Také stále ještě používáte stejné heslo na všech používaných službách? Co na to Petr Novák? :-)


P.S.: Petr Novák je osoba smyšlená, nicméně příběh ze začátku blogpostu je skutečný. Nejvíc zarážející na tom pro mě je, že Petr si vylepšil heslo o rok svého narození po tom, kdy mu před dvěma lety někdo vykradl databázi klientů (několik desítek tisíc kontaktů). Pravdou ale je, že tehdy měl uživatelské jméno i heslo stejné 1:1 :-)

pondělí 27. ledna 2014

Jak děláme open source

Dnes jsem se v rámci úklidu (především duševního :-)) zamyslel krom jiného i nad tím, co vše z naší práce publikujeme jako "open source" a co jsme nad tímto open source vystavěli.

Ella - Django powered CMS


Co je Ella? Oficiální popis říká: "Ella je open source CMS založené na Django frameworku. Původně vznikala jako CMS pro magazíny společnosti CentrumHoldings (především Žena.cz) s ambicemi stát se hlavním CMS pro všechny obsahové weby od lifestylových e-časopisů se střední návštěvností až po zpravodajské servery s návštěvností v řádech miliónů zobrazení denně."

V CentrumHoldings bohužel nečekala na Ellu příliš dlouhá budoucnost, zejména z důvodu celkového odklonu CentrumHoldings od Pythonu. My jsme naštěstí Elle nikdy nepřestali důvěřovat a zůstali jsme v kontaktu s jejími původními vývojáři. S těmi jsme na její záchranu založili občanské sdružení Pyvec, které však velmi brzy Ellu přerostlo. O tom ale až někdy jindy.

Časem se nám podařilo Ellu prosadit i do společnosti Sanoma, kde nad ní bylo spuštěno několik zajímavých webů - Květy, Vlasta, Dům a zahrada...

Náš největší projekt na Elle je Investičníweb.cz. Ella pohání například i Věrnostní program společnosti Mountfield.

Naši přátelé ze společnosti BermanBraun (bývalé Whiskey Media) pak na té stejné Elle provozují weby s výrazně větší návštěvností převyšující počet obyvatel ČR - Tested.com, Mom.me, Anime Vice...

Zdrojové kódy Elly naleznete na GitHubu a pokud vás zajímají čísla, tak zde je i několik grafů. Instalační balíček najdete na Pypi, kde má Ella každý měsíc tisíce stažení.



GAP a GAPI


V minulém blogu jsme již o knihovně GAP a GAPI psali, takže zde přidám již jen několik čísel z GitHubu a Pypi.


BorIS


BorIS je projekt našich zaměstnanců, kteří na něm pracují většinou ve volném čase. I o tomto projektu jsme již psali, takže uvedu jen odkaz na GitHub a informaci o tom, že BorISe používá již cca 10 zařízení z ČR. Tím však ambice projektu zdaleka nekončí a těšíme se na to, až hranice ČR překročíme.


A co ještě máme?


Dál už toho "moc" není, jen několik malých knihoven, pár komitů do knihoven někoho jiného a samozřejmě také řadu plánů do budoucna. Tím nejsmělejším je asi dostat naší HTML5/JS/CSS aplikaci jako výchozí "example" aplikaci v projektu Apache Cordova. Tak uvidíme jestli se nám to povede.

No a to je asi vše. Až budu příště zas "uklízet", zkusím o tom něco napsat.

čtvrtek 2. ledna 2014

Náš technologický stack - server

Server

Bez diskuse Google AppEngine v Python verzi. Ne, že by to byla zase taková pecka, ale většinou je to požadavek zákazníka.
Ovšem pecka je náš GAP a GAPI.


GAP

GAP je naše odpověď na to, že AppEngine neví, co to je virtualenv. AppEngine dokonce ani neví, co to je PIP.
To naše pythonáře trochu (víc) zaskočilo, ale naštěstí Robin dal rychle dohromady náhradu.
Jak funguje? Takhle:
workon <myvirtualenv>
pip install gap
gap start-project <applicationid>
cd <applicationid>
vi requirements.gip
bin/gip install -r requirements.gip
Každý, kdo někdy dělal s virtualenv v Pythonu se zorientuje relativně rychle - jen místo pip install napíše bin/gip install a GAP se postará o stažení knihoven a jejich nalinkování do adresáře se zdrojákama.
Závislosti se ukládají do requirements.gip (místo requirements.pip) a svět je zase veselejší místo k životu.
GAP nám umožnil mít pořádek v knihovnách jednotlivých projektů a nezas*rat si instalaci Pythonu.


GAPI

Další náš příspěvek světu je GAPI – mimochodem na originálních názvech GAP/GAPI je vidět, že jsme především programátoři. Copywritera aby člověk pohledal...
Takže GAPI. Rozhraní (API) Google služeb je navržené šikovně, ale knihovna pro Python, která ho implementuje, už je na tom hůř. O dost.
GAPI umí navíc:
  • cachovat autorizační tokeny
  • dávkové requesty
  • opakovat requesty v případě chyby
  • stránkovat odpovědi
  • a běží v pohodě na AppEngine
Ke GAPu patří i další rozšíření jako GAP-Resources, GAP-Angular (to jsem psal já!) a GAP-DatastoreAdmin, ale o těch až jindy.