Shopio Weblog

Prohlížení nedokončených košíků v administraci

V nové verzi Shopia jsme upravili způsob, jakým jsou v databázi ukládány zatím nedokončené košíky zákazníků. Na první pohled se může zdát, že je to jen systémová věc, která pro správce e-shopu nemá žádný přínos.

Opak je pravdou, protože nám to umožnilo rozšířit výpis nedokončených košíků v administraci:

basket1

Takže pokud nějaký zákazník vyplní své kontaktní údaje, ale už nedokončí objednávku, tak ho můžete kontaktovat a přesvědčit ho ke koupi.

basket2

Tento způsob navíc umožňuje dodělání i dalších úprav, jako je automatizované kontaktování takovýchto zákazníků s nabídkou slevy slevou na nákup nebo pomoci při volbě správných produktů.

Nové chování variant ve verzi 2.1

V nové verzi Shopio 2.1 jsme na základě zkušeností a připomínek přepracovali správu produktových variant tak, aby lépe vyhovovala vašim potřebám. Nové rozhraní se netýká jen nových e-shopů, ale mohou ho získat i naši stávající klienti, se kterými jsme se domluvili na pravidelných aktualizacích. Proto se vám pokusíme popsat, co se změnilo a v čem je nová varianta lepší.

Varianty můžete deaktivovat

shopio-var-1

Pokud již konkrétní produktovou variantu nechcete nabízet k prodeji, stačí ji pouze deaktivovat. Varianta se pak skryje na stránce produktu a zároveň nebude exportována v XML feedech pro zbožové vyhledávače. Variantu tak již nemusíte v tomto případě mazat a zůstane stále uložená v databázi pro případ, že ji zase budete chtít nabízet k prodeji. V detailu produktu se budou zobrazovat pouze ty parametry, které jsou přiřazené k aktivním variantám.

Můžete mít varianty zcela bez parametrů

Rozhodně doporučujeme k variantám parametry přiřadit z důvodu parametrického filtrování na e-shopu nebo pro generování kvalitního XML feedu do zbožových vyhledávačů. Může však nastat situace, kdy data přenášíte z jiných systémů, např. importujete z XML feedů jiných dodavatelů nebo ekonomických systémů. V těchto případech data o produktech a variantách nejsou vždy v ideálním stavu. Např. potřebují další čištění, doplnění informací atp. Proto vám Shopio nabízí i možnost spravovat varianty zcela bez parametrů. Samozřejmě si můžete parametry variant nastavit později.

Parametry u variant můžete libovolně upravovat

shopio-var-2

Varianty můžete např. nejprve naimportovat bez parametrů a až následně je k variantám přiřadit. Není tedy nutné při změně parametru variantu smazat a zakládat znovu. Stejně tak můžete i měnit (tzn. přidávat) počet parametrů, ze kterých je varianta tvořena. Např. nejprve nabízíte trička, která členíte pouze podle velikosti, a až následně se rozhodnete přidat další parametr barva. Není to problém.

Můžete nabízet produkt pouze s 1 variantou

shopio-var-3

Zbyla vám skladem pouze 1 varianta? Stačí ostatní deaktivovat a zákazníci budou moci zakoupit pouze vaši poslední variantu produktu. Pokud všechny varianty vyprodáte a deaktivujete všechny varianty, zobrazí se vám upozornění, abyste nezapomněli skrýt i samotný produkt, aby ho vaši zákazníci nezakoupili bez vybrané varianty.

Varianty je možné smazat přímo z košíku zákazníků

shopio-var-4

Když variantu deaktivujete, zákazníci si ji již nemohou zakoupit. Ovšem pokud si ji stihli vložit do svého nákupního košíku ještě dříve, mohou s takovou variantou stále dokončit objednávku. Při odstraňování varianty se vám v tom případě zobrazí varování a po potvrzení se varianta smaže i z košíků nakupujících zákazníků.

Jak vytvářet varianty

Jak probíhá vytváření variant v praxi vám ukáže následující animace. Nejprve je potřeba produkt zařadit do kategorie, která má nastaveny parametry. Poté se vám v přehledu variant objeví formulář pro výběr povinných parametrů. Já jsem využil oba parametry (Barva a Velikost). Poté je možné jako jinde v Shopiu přidat novou variantu odkazem nahoře. U varianty stačí vyplnit pouze hodnoty parametrů. Pokud vám vyhovovalo „staré“ vytváření variant zaškrtnutím na jedné stránce, můžete použít hromadné vytvoření více variant. Varianty se nyní vytvářejí deaktivované, aby se nestalo, že si někdo nově vygenerované varianty nakoupí třeba bez správně nastavené ceny. Varianty bez parametrů vytvoříte stejně snadno. Prostě jen v seznamu povinných parametrů pod seznamem variant nic nezaškrtnete.

shopio-variants

Doufáme, že se vám nové varianty budou líbit

Někteří naši klienti mají u produktů jen pár variant. Jiní jich mají i několik desítek. Během návrhu nového rozhraní jsme strávili spoustu času zkoušením různých variant chování a snažili jsme se, aby pokrývalo co nejširší spektrum různých použití, bylo intuitivní a snadno použitelné. Doufáme, že se vám nové rozhraní bude vyhovovat, ale pokud byste narazili na nějaký problém nebo komplikaci dejte vědět a pokusíme se to nějak vyřešit.

Podzimní Shopio 2.1 je tady!

Znáte pořekadlo „až se zima zeptá, co jsi dělal v létě“? My jsme se potili u počítačů, abychom stihli připravit novou podzimní verzi Shopia, která jako vždy přináší spoustu novinek. Pokusím se vám ty nejzásadnější představit.

podzimni-shopio-2-1

Předchozí verze 2.0.0 přinesla spoustu nových funkcí, třeba podporu pro Heuréka Košík, provoz na HTTPS nebo úplně přepracované fungování šablon. Co vybrat do verze 2.1.0, aby byla ještě lepší, byl celkem oříšek, ale myslím, že nakonec se nám podařilo vybrat hodně zajímavé věci.

Asi největší novinkou jsou asymetrické jazykové verze – tedy možnost mít některé stránky, články nebo bannery jen v některých verzích. Je to věc, na kterou se hodně našich zákazníků ptalo, a bylo ji v předchozích verzích obtížné vyřešit. Teď to jde na dvě kliknutí. Můžete tak například snadno udělat banner upozorňující na dopravu zdarma po ČR, ale vypnete jeho zobrazování ve slovenské verzi, kde doprava zdarma není. Navíc si můžete podle jazyka nastavit adresu pro odchozí emaily. To se hodí zejména v případě, pokud v zahraničí vystupujete pod jinou doménou – to je třeba případ Pivní dárkyPivné DárčekyCzechBeerGifts.

Další novinkou, která s jazyky souvisí, je možnost zapínat a vypínat jazyky za běhu. Stalo se nám, že klient se rozhodl expandovat do zahraničí a potřeboval veškerý obsah zpřístupnit v cizím jazyce. Jenže vytvořit veškerý obsah chvíli trvá a na eshopu by se mezitím zobrazoval nedodělaný obsah. V předchozích verzích nebylo možné jazyk přidat bez toho, aniž by byl vidět na eshopu. Museli jsme to tedy složitě řešit vytvořením dočasné verze eshopu, kde se všechno naplnilo a zkontrolovalo a pak přesunulo zpět. Nově je možné jazyk přidat, ale nezapínat. V klidu si připravíte obsah a až bude napsaný a zkontrolovaný, tak ho zapnete. To samé samozřejmě funguje také pro nové měny.

Pokud je pro vás důležité, jak se váš eshop umisťuje ve vyhledávačích, budete jistě nadšeni z integrované podpory pro přesměrování. Kdykoli změníte adresu stránky nebo třeba produktu, Shopio si toho všimne a automaticky vytvoří přesměrování ze staré adresy na novou. Vše je navíc navrženo tak chytře, že vždy dojde rovnou k přesměrování na aktuální adresu. A to i v případě, že jste měnili URL ve více krocích (url1 -> url2 -> url3 -> url1 -> url4). Jak to hezky funguje si můžete vyzkoušet na našem demoshopu.

Pro eshopy s větším množstvím variant jsme připravili zbrusu nové rozhraní pro správu variant.  To nově umožňuje dočasnou deaktivaci variant a produkty s jen jednou variantou. Doufáme, že se vám bude líbit, a oceníme zpětnou vazbu.

Na konec jsem si nechal takové vývojářské perličky, které ale ocení i zákazníci. První z nich jsou jazykově závislé sloupce v databázi. Různé jazyky se řadí a porovnávají různě. V angličtině například nemají písmeno Ch a řadí ho pod C, jinak se chová také azbuka a další jazyky. Shopio nově rozumí tomu, který sloupec je ve kterém jazyku a podle toho řadí a vyhledává. Druhá perlička je inteligentní vybírání alternativních produktů. Alternativní produkty můžete stále vybrat ručně. Ale pokud to neuděláte, nebo vyberete třeba jen jeden, tak Shopio automaticky doplní do seznamu produkty ze stejné kategorie s co nejpodobnější cenou. Již nyní to používáme na Pivních dárcích. Všimněte si, že i když v kategorii jsou různé věci v rozpětí 170 až 1200 Kč, tak Shopio vybere ty, které jsou skutečně alternativní. To je ideální v případě, kdy produkt už neprodáváte a zákazník, který přijde z vyhledávače, hledá náhradu. Navíc pokud chcete využívat alternativní produkty na up-selling, stále můžete produkty vybírat ručně. Případně jsou k dispozici také Související produkty, které jdou na up-selling a cross-selling použít stejně dobře. Z této úpravy mám osobně velkou radost, protože i když je relativně jednoduchá, tak zákazníkům velmi pomůže.

Další změny už jen telegraficky.

  • Nový modul na zoom fotografie v detailu produktu. Používá ho například 4camping.
  • Vylepšené CSS pro tisk – divili byste se, kolik lidí si produkty z eshopu tiskne!
  • Shopio se naučilo používat Facebook Pixel – můžete tedy měřit kampaně na Facebooku.
  • Vylepšili jsme také výpis informací z platebních metod. Díky tomu snáz zjistíte, zda zákazník nemá problémy se zaplacením.
  • Formuláře v košíku a registraci mají nastavené auto-fill atributy, takže jdou lépe vyplňovat automaticky.
  • Přibyla podpora pro nové feedy Zboží.cz 2015 (včetně <CATEGORY_ID>), Seznam Sklik Retargeting v rámci modulu Sklik, Heuréka měření konverzí (nová verze od září), Google Remarketing.

Doufáme, že se vám nová verze bude líbit. Pro zákazníky, kteří využívají možnost průběžného upgradu, budeme nasazovat změny v průběhu října. Pokud pro vaše Shopio zatím průběžné upgrady nevyužíváte a chtěli byste, neváhejte nás kontaktovat.

Jak můžete ušetřit tím, že vaše Shopio bude aktuální?

Už dávno neplatí, že stačí mít na e-shopu jen hezkou šablonu. V konkurenčním prostředí e-commerce je třeba neustále přicházet s novými nápady. E-shop s možností úprav na míru vám poskytuje mnoho prostoru jak se odlišit od konkurence. Zároveň má však jednu nevýhodu. Je pro něj poměrně drahé průběžně reagovat na změny na trhu. Náklady se totiž nemohou rozkládat mezi více zákazníků jako v případě řešení bez úprav, kde na jednom kódu běží stovky nebo i tisíce e-shopů.

8772LH04PGR8K1

Trh e-commerce se, stejně jako celé IT odvětví, vyvíjí překotnou rychlostí. Od roku 2008, kdy Shopio vzniklo, už jsme zažili mnohé zásadní změny. Neuvěřitelný nástup Heuréky, která převálcovala tehdy velmi dobře zavedené Zboží.cz. Asynchronní měřící kód Google Analytics a měření konverzí. Vznik a rozmach zasílatelských společnosti jako DPD, PPL nebo Geis a platebních metod jako GoPay, PayU nebo ThePay. Integrace každé takové velké změny do Shopia a její otestování může stát i několik desítek tisíc, které ve výsledku někdo musí zaplatit. Dělat je všechny v rámci zákaznických úprav je i pro zavedené e-shopy docela velká investice.

Takhle situace se nám vůbec nelíbila. My totiž chceme, aby Shopia prosperovala, vydělávala a dařilo se jim. Přišli jsme proto s řešením.

Nabízíme pravidelné aktualizace neboli upgrady, které respektují existující klientské úpravy. Úpravy postupně integrujeme do hlavní verze Shopia a při upgradu je „propisujeme“ do klientských verzí. To nám umožňuje náklady na integraci rozložit mezi více zákazníků a zároveň nám to šetří čas. Je to tedy, jak říkají Angličani, „win-win“.

V každém upgradu získá e-shop za zlomek ceny ty nejdůležitější změny za poslední půl rok. Typicky jsou to úpravy ve feedech pro vyhledávače zboží (ve 2.1 nové Zboží.cz), měřících kódech (ve 2.1 Sklik Retargeting) nebo vylepšení pro SEO (ve 2.1 rozšířená metadata v detailu produktu). Dále pak drobná i větší vylepšení použitelnosti pro administrátory i návštěvníky. Takto jsme například v poslední verzi přidali možnost nevyžadovat vyplnění adresy pro osobní odběry – to je něco, co nabízí zatím jen minimum řešení.

Náročnost upgradů je závislá na množství a složitosti zákaznických úprav. Kalkulujeme ji tedy individuálně a může se v průběhu času měnit s tím, jak se zapracovávají klientské úpravy. Někteří z našich klientů, jako třeba Nejbaby.cz, už je využívají v pilotním provozu a jsou s nimi spokojeni. Pokud vás tato možnost zaujala a zvažujete, že byste chtěli upgrady pro své Shopio, tak stačí napsat nebo zavolat a domluvíme se :)

Inzerujte na Slevomatu se Shopiem!

Připravili jsme pro naše klienty možnost propojit Shopio a Slevomat – nejznámější český slevový portál. Vaše nabídka na Slevomatu se zobrazí až 300 000 lidem a je to tak ideální možnost, jak na svůj e-shop přilákat nové zákazníky.

Co můžete na Slevomatu inzerovat?

  • Vybraný produkt ve slevě.
  • Kombinaci produktů ve slevě.
  • Slevový kupón na pevnou částku nebo procentní slevu.

Po zakoupení na Slevomatu obdrží zákazník unikátní kód voucheru, který následně může uplatnit na vašem e-shopu.

E-shopy, které automatické propojení se Slevomatem nemají, nutí své zákazníky, aby vložili kód voucheru do poznámky objednávky. To s sebou ale nese celou řadu problémů:

  • Zákazník může vložit neplatný kód voucheru (ať už omylem nebo úmyslně) – a prodejce tak musí kód ručně ověřovat a stojí ho to spoustu času navíc.
  • Zákazník sice vloží správný kód voucheru, ale vybere na e-shopu produkt, na který se sleva nevztahuje. Prodejce musí komunikovat se zákazníkem a to mu opět zabere spoustu času.
  • Zákazník musí čekat, až prodejce kupón ověří a než bude jeho objednávka expedována.
  • E-shop není schopen okamžitě spočítat celkovou cenu objednávky.
  • Pokud se zákazník rozhodne v průběhu nákupu do košíku přidat další položky tak neví, jaká bude finální cena objednávky po uplatnění kupónu a zda nebude muset něco doplácet.
  • Určitá kombinace dopravy a platby může hodnotu objednávky navýšit. Pokud je zákazník nucen rozdělit svou objednávku, musí zaplatit za dopravu 2x, což ho může velmi často od nákupu odradit.
  • Bez přesné ceny nemůže zákazník zaplatit okamžitě, např. elektronicky. Musí počkat, až prodejce vystaví fakturu.

Shopio všechny tyto problémy řeší za vás!

Shopio umožňuje propojení se Slevomatem pomocí volitelného modulu, který si můžete objednat. Díky propojení Shopia a Slevomatu se sleva spočítá zákazníkům automaticky a okamžitě. Po zadání slevového kódu a dokončení nákupu na e-shopu dojde k automatickému uplatnění kupónu na Slevomatu. Shopio samozřejmě neumožní uplatnit exspirovaný nebo již použitý kupón.

slevomat2

Aby vše mohlo automaticky fungovat, je samozřejmě potřeba drobná akce na straně e-shopu. V Shopio administraci je potřeba vytvořit slevový kupón a ten svázat s ID vaší akce na Slevomatu.

Jak slevový kupón nastavíte je jen na Vás, měl by ale logicky odpovídat inzerované ceně na Slevomatu. Tzn. pokud prodáváte produkt za 1000 Kč na Slevomatu za 800 Kč, vytvoříte slevový kupón na 1000 Kč a svážete ho s vybraným produktem. Zákazníci, kteří si slevový kupón na Slevomatu zakoupí, mají poté po uplatnění kupónu produkt na vašem e-shopu za „0 Kč“.

Pokud budete mít složitější kampaň, kdy nabízíte více variant produktu s různou cenou v rámci jedné akce, rádi vám s nastavením kampaně pomůžeme.

Před oficiálním spuštěním akce vám také doporučujeme svoji kampaň pokaždé důkladně otestovat.

shopio_slevomat

Více informací o možnostech jak inzerovat na Slevomatu naleznete přímo na webu Slevomat.cz.

Propojení Shopia se Slevomatem jsme již realizovali pro e-shop Levné učebnice a pro GSKlub.

Pokud budete mít k možnosti propojení vašeho e-shopu se Slevomatem jakékoliv dotazy, neváhejte nás kontaktovat.

Snažší vyplňování zákaznických údajů s Auto-fill

V nové verzi Shopia, která nás čeká na podzim, jsme kromě jiných vylepšení zavedli podporu pro auto-fill, tedy automatické vyplňování zákaznických údajů z prohlížeče. Moderní prohlížeče, jako například Google Chrome, si automaticky zapamatovávají, co zadáváte do políček při objednávce a jsou je pak schopny vyplnit automaticky. Prohlížeč se pokusí odhadnout, co které políčko znamená, ale ne vždy se mu to daří. Typický problém je, že pro oddělené jméno a příjmení vyplní celé jméno jen do jednoho políčka. Díky této úpravě mu přesně řekneme, co kam patří a dokáže tak například správně vyplnit jinou dodací adresu.

Připravili jsme krátkou animaci toho, jak vyplňování funguje.

animace vyplňování zákaznických údajů

Přijde nám to jako skvělý způsob, jak vašim zákazníkům nakupování ještě více zpříjemnit. Pro klienty, kteří využívají možnosti průběžného upgradu eshopu bude tato novinka dostupná v rámci podzimního upgradu. Ostatní si ji mohou poté vyžádat jako zákaznickou úpravu.

Co používáme na vývoj (nejen) Shopia

Tomáš už sepsal, jak nám vývoj funguje po organizační stránce, já se vám teď pokusím přiblížit, jaké nástroje a technologie používáme.

Backend

Shopio je postavené na Zend Frameworku 1 (protože v době, kdy se vybíralo, na čem ho stavět nebylo nic moc jiného k dispozici). Samozřejmě jsme si museli některé věci v ZF upravit a opravit, ale naprostou většinu věcí se nám podařilo poslat zpět do upstreamu (takže už jsou součástí ZF). Kromě ZF1 používáme různé další knihovny – Twig, Texy, Nette (Image, Debug), mPDF, PHPExcel, Symfony Console.

Shopio běží na PHP 5.3 (na Tojeono.cz) nebo PHP 5.5 (v naší infrastruktuře) a MySQL (resp. MariaDB). Na šablony se historicky používalo jen čisté PHP (jak je v ZF aplikacích časté), ale aktuální vývojová verze Shopia už používá Twig (s tím souvisí i to, že Shopio bude podporovat externě vytvářené šablony – ale o tom napíšu až někdy jindy). Některá Shopia dále používají Elasticsearch (a kupodivu nejen na hledání, ale třeba i na výpis kategorií), Memcache, Redis.

A jak už Tomáš zmiňoval, tak hodně důležitý je pro nás Jenkins. Pro každý commit a každý Pull Request se pouští automatizovaný build, který kontroluje spoustu věcí a v případě jakéhokoliv problému failne a dá vědět mailem. Vezmu to jen rychle:

  • PHP-Parallel-Lint – zkontroluje celé Shopio za pár sekund
  • twig-lint – kontrola syntaxe šablon
  • PHPUnit – testujeme jak model, tak i ZF controllery
  • PHP_CodeSniffer – Zend standard a spoustu dalších pravidel – psal jsem o tom na svém blogu
  • PHPCPD
  • JSHint – kontrola syntaxe JS
  • JSCS – CodeSniffer pro JS

Infrastruktura

Velká část Shopií běží na sdíleném hostingu Tojeono.cz (kromě sdíleného hostingu mají i VPS s dedikovanou pamětí a výkonem pro větší zátěž).

Kromě toho jsme v poslední době vytvořili vlastní infrastrukturu pro běh Shopií. Základem je loadbalancer (s nginxem), který servíruje statická data a ostatní požadavky předává na jednotlivé workery (nginx + php-fpm). Těch workerů může být podle potřeby samozřejmě více. Jako databáze se používá MariaDB (master a slave servery). Na monitoring Icinga (fork Nagiosu) a collectd + Visage. Všechny servery běží na Debianu.

A to nejdůležitější je to, že jednotlivé servery nejsou instalovány ručně, ale pomocí SaltStack (obdoba Chef/Puppet). Takže veškerou konfiguraci serverů máme verzovanou v gitu a není problém rychle nahodit obdobnou infrastrukturu kdekoliv na nových serverech, případně přidat další worker. Úvod do saltu popsal Tomáš na Zdrojáku.

Na deploy používáme buildskripty ve Phingu, do kterého si píšeme vlastní tasky. Samotný deploy spouštíme z webového rozhraní a je to one-click-deploy (kdy se na jedno kliknutí na server nahraje poslední revize z gitu a spustí změnové SQL skripty).

Na řízení projektů a komunikaci s klienty používáme ActiveCollab. Je to systém, který máme nainstalovaný u sebe a platíme roční poplatek za upgrady. V minulosti jsme uvažovali o vytvoření vlastního systému, ale vždy jsme to nakonec zavrhli, protože by to bylo neúměrně mnoho práce.

Frontend

Na frontendu používáme HTML5 (+microdata tam, kde mají smysl). CSS generujeme ze Sassu (používáme Compass). Zajímavostí je, že používáme Twitter Boostrap, ale místo oficiální LESS verze používáme Sassový port (teď už podporují Sass i oficiálně). V JavaScriptu máme převážně drobnosti v jQuery/jQueryUI. CSS i JS samozřejmě spojujeme a minifikujeme (používáme vlastní knihovnu)

Vývojáři

Zajímavostí je, že zatím všichni používáme na vývoj Windows (to neznamená, že nemáme rádi Linux – na vývojářských strojích naleznete cygwin a spoustu linuxových nástrojů). Chvíle trápení práce s Macem (který máme pro build iOS aplikace) všem stačila.

Všechen kód verzujeme gitem a ukládáme ho na Github, kde nám PR v poslední době obohacují GitHub Selfies Na práci s gitem používáme GitExtensions <3 (a bash používáme jen pro několik příkazů – resp. kombinací příkazů uložených jako aliasy).


Kód píšeme v PHPStormu a lokálně si ho spouštíme na xamppu/wamppu. A používáme xdebug (na debugování a profilování).

Kávu z Holešovických pražíren pro nás vaří DeLonghi Magnifica a nádobí po nás myje Baumatic myčkovič.

Co dál?

Používáte také podobné nástroje? Nebo jiné a lepší a divíte se, že si s těmito vystačíme? Dejte nám vědět na info@www.shopio.cz. Neustále hledáme nové posily do týmu a rádi se něco nového naučíme.

Jak vyvíjíme Shopio?

Tento příspěvek je trochu techničtějšího rázu, než je na našem blogu obvyklé. Rád bych vám v něm přiblížil některé zajímavé postupy, které používáme při vývoji Shopia.

Ilustrativní: Monitor s kódem

Práce na Shopiu je rozdělena na dvě části – práce na samotné platformě a práce na úpravách pro konkrétní zákazníky. Abychom mohli zákazníkům dodávat úpravy v odpovídajícím čase a za přijatelné ceny, potřebujeme mít pro úpravy stabilní základ, na který se můžeme spolehnout. Proto je pro nás kvalita základního kódu velmi důležitá.

Společné vlastnictví kódu

Pokud pracujete ve větší společnosti, určitě to znáte – kusy kódu, o kterých nikdo netuší jak fungují, a jejich úprava je za trest. Takové kusy kódu na Shopiu prakticky nemáme. Vzhledem k tomu, že w3w je velmi svobodná firma, tak potřebujeme, aby mohl kdokoli kdykoli pracovat na jakémkoli kusu kódu (někdo může být na cestách, nebo mít doma výpadek internetu a někdo ho musí zastoupit). Základním kamenem společného vlastnictví kódu jsou coding standards – tedy způsob formátování zdrojového kódu, pojmenovávání tříd, proměnných a souborů.

Nepoužíváme žádný ze zavedených coding standardů, ale pro naše potřeby jsme si upravili Zend coding standard tak, aby nám zbytečně nepřidělával práci, ale aby nám pomáhal. Při zavádění coding standardů je důležité, aby s jeho zavedením souhlasili všichni a byl výsledkem shody. Jedině v tom případě ho budou všichni svědomitě používat a bude přínosem. Nám se to podařilo, a tak dokonce často nastávají vtipné situace, kdy člověk najde chybu v kódu, udělá git blame a zjistí, že ji napsal sám. Po čase se totiž z pohledu do kódu prakticky nedá poznat, kdo ho napsal. A to je základ společného vlastnictví kódu.

Problém coding standardů je, že kontrolovat je nikoho nebaví. Je to otravná práce. Ale nebyli bychom vývojáři, kdybychom si nedokázali pomoct skriptem! Takže coding standardy za nás hlídá phpcs. Automatizované kontroly nasazujeme postupně, jak postupně opravujeme standardy. Pokud si na běžícím projektu vymyslíte standard a začnete ho kontrolovat pomocí phpcs, nejspíš to bude epic fail. Proč? Protože každé spuštění vrátí Found 1000 violations, too many violations. Je potřeba to dělat postupně od nejzásadnějších věcí, které dodržujete už teď a postupovat k detailům. A jednou za čas udělat big bang a přepsat něco napříč projektem. Za dobu, co nám phpcs běží, se počet pravidel poměrně dost rozrostl a myslím, že zachytí většinu běžných chyb.

Git

Před časem jsme celou naší codebase zmigrovali z SVN do gitu. Zpětně to bylo velmi dobré rozhodnutí, protože nám umožnilo zavést množství různých postupů, které nám pomáhají zlepšovat kvalitu kódu. Při vývoji Shopia používáme upravený Github workflow. Veškeré úpravy probíhají v oddělených větvích a poté jsou pomocí pullrequestů integrovány zpět do hlavní vývojové větve. Pullrequesty (PR), pokud nevíte o co se jedná, jsou vlastně požadavky na zaintergrování nějakého kódu. Vytvořením PR říkáme „žádám tě, abys kus kódu, který je ve větvi XY, přidal do větve ABC“. A to je přesně situace, kdy je ideální čas na code review.

Pullrequesty a Code review

Základní pravidlo: Nikdy si nikdo nemergne vlastní PR.

I kdyby to mělo být přejmenování jedné proměnné. Za každý kus kódu v hlavní vývojové větvi jsou tak vždy zodpovědní dva lidé – ten, kdo to vytvořil, a ten, kdo ho mergoval. Před mergnutím PR si tak dotyčný kód vždycky pořádně zkontroluje, když je za něj zodpovědný.

Prvním krokem review je kontrola samotného kódu – v rámci PR na Githubu je na to samostatná záložka, ve které jsou zobrazené změny v kódu, které PR přináší (diff). U menších změn většinou stačí změny v kódu jen přečíst a pro sebe si je vysvětlit. Tím člověk odhalí většinu zjevných chyb – špatně pojmenované třídy a proměnné, nesmyslné konstrukce atp. Jakmile při review narazím na něco, u čeho si řeknu „co vlastně tohle dělá?“, tak tomu dám chvilku, a pokud to nepochopím, tak přidávám komentář, že je třeba kód přejmenovat, přestrukturovat nebo aspoň doplnit komentář. Díky tomu se nám daří mít v hlavní větvi minimum kódu, který by byl nepochopitelný. A to nám dál pomáhá ve společném vlastnictví kódu.

Kontinuální integrace

Martin v rámci své bakalářky (doporučuji k přečtení) pro w3w zprovoznil CI server Jenkins, ten nám umožňuje automatické kontroly jak běžících projektů, tak vývojových větví. Pro každou větev beží v Jenkinsu build, který zkontroluje PHP/JS coding standardy, zkontroluje, jestli PHP/JS/twig/SASS neobsahuje syntaktické chyby (lint) a spustí testy. Nedávno jsme také zprovoznili přímé napojení na Github, takže se nám automaticky buildují pullrequesty a přes API se označují. Situace, kdy člověk pushne na Github, chvilku počká a u githubu se mu objeví zelená fajfka, že build proběhl bez chyb, je super!

Párové programování

Čas od času narazíme na problém, který je tak velký, že si s ním člověk láme hlavu a vůbec se nikam neposouvá. V praxi se ukázalo, že než se celý den trápit sám, tak se vyplatí pozvat kolegu, ať jde programovat se mnou.

Rozdíl mezi párovým programováním a „zeptáním se kolegy“ je zásadní. Ptát se jednou za čas není efektivní – kolegu rušíte z jiné práce, musí přerušit to co dělá, začít se soustředit na váš problém, pochopit ho a pak poradit. Při párovém programování si oba vyhradíme čas, ten kus kódu máme v hlavě a plně se soustředíme na to, co děláme.

Nestává se příliš často, že by výsledek rychleji hotový (když se sečtou hodiny obou vývojářů). Ale párové programování přináší jiné hodnoty než rychlost. Vyšší kvalitu kódu, skutečně „společné“ vlastnictví kódu a je to vlastně i teambuilding.

Pokud jste ještě párové programování nezkoušeli, určitě mu dejte šanci. V práci, na Code Retreatu, nebo zajděte na Coding Dojo. Nebo si něco naprogramujte pro zábavu u jednoho PC s kamarádem.

WF

Pokud jste až doteď znali všechny použité zkratky, tak tuhle asi přeci jen neznáte. Za magickou zkratkou WF se skrývá Wopruz Faktor.

Jako každá aplikace, která má za sebou nějakou historii, i Shopio má části, které jsou méně kvalitní než jiné. Protože v rámci zákaznických úprav zasahujeme často do spousty míst kódu, stane se, že je třeba něco upravit i v těch „ošklivějších“ končinách. A podle toho, jak moc „ošklivý“ ten kód je, tak vysoký je Wopruz Faktor, který je úpravě přiřazený. Wopruz Faktor tedy udává, jak moc se nikomu do dané úpravy nechce („protože to bude wopruz“). Pozor aby nedošlo ke zmatení. WF není to samé jako splácení technologického dluhu. Má mnohem blíž spíš ke zvyšování developer experience (z frameworků DX prosazuje nejvíc asi Symfony).

Dobrou zprávou je, že snižování WF je jednou z priorit během rozvoje Shopia. I během nejnabitějších měsíců věnujeme alespoň několik hodin snižování WF. Za poslední rok jsme udělali v tomto ohledu dost práce a vymetli jsme i ta nejzatuchlejší místa, takže nám teď vývoj dělá o dost větší radost.

Přístup managementu, důraz na kvalitu kódu, svědomité splácení technologického dluhu a zlepšování developer experience je podle mého jednou ze zásadních výhod práce ve w3w.

Možná to vypadá, že se w3w stará víc o vývojáře než o klienty. Ale opak je pravdou. Protože většinu úprav účtujeme hodinově podle reálné náročnosti, tak má snížení WF přímý vliv na výslednou cenu (a termín). Rozdíl mezi „to bude wopruz na celé odpoledne a dneska se mi do toho už nechce (4 h)“ a „to bude celkem snadný, udělám to večer (1 h)“ může být výsledkem jedné nebo dvou hodin snižování WF.

Jak nám to funguje?

Nemůžu mluvit za ostatní, ale z technického pohledu vývoj Shopia funguje skvěle. Především společné vlastnictví kódu nám umožňuje si vzájemně pomáhat a sdílení kódu člověka obohacuje. Tu člověk objeví zajímavou konstrukci, jindy zas elegantní řešení složitého problému. Code review mě donutil víc přemýšlet nad kvalitou kódu a DX už během psaní. Poskytuje také určitou jistotu v tom, že se do produkce nedostane nějaká hloupá chyba z nepozornosti.

Co se chystá?

Nejžhavější věc na Shopiu je momentálně nová šablonovací vrstva, která by měla umožnit grafikům mnohem širší možnosti, co se úprav designu týče. A také nová serverová infrastruktura, díky které se nám otevírá možnost používat nové zajímavé nástroje (redis, fronty, replikované databáze a další). Myslím, že příští rok bude pro rozvoj Shopia velmi zásadní a posune ho hodně dopředu.

Říkáte si teď v duchu, že byste chtěli také programovat takhle? Nebo si říkáte, jak můžeme fungovat bez [doplňte skvělý nástroj pro týmový vývoj]? Dejte nám vědět na info@www.shopio.cz. Neustále hledáme nové posily do týmu a rádi se něco nového naučíme.

Shopio se přestěhovalo

Drazí klienti, přátelé a kamarádi,

rádi bychom vás informovali o změně našich kanceláří, která se odehrála o tomto víkendu (31.5. – 1.6. 2014).

Jeremenkova 9, nové kanceláře w3w

Od pondělka již nás naleznete na nové adrese:

w3w, s.r.o.
Jeremenkova 9/411
Praha 4, 147 00

Nestěhovali jsme se daleko – jen o pár set metrů níže blíže k Dvorcům – na hlavní ulici Jeremenkovu. Najdete nás v druhém patře žlutobílého domu naproti koupelnovému studiu Ptáček.

Pokud byste nás v našich kancelářích chtěli navštívit, rádi vás uvidíme.