WordCamp néven WordPress konferencia volt Rijekában, 2015. szeptember 4-től 6-ig. Erre látogattunk ki, pontosabban csak én, aki a weboldal készítésért felelős a Tárhelypark-nál, mivel a fejlesztéshez és saját oldalainkhoz is WordPress-t használunk. Most veletek is megosztom mind azt, ami ott történt. Előre szólok, hogy nem vagyok a nyers beszámolók híve, ezért itt most nem csak az előadások tételes leírásáról olvashattok, hanem az egész ott létről.
A konferencia három napos volt, de én sajnos csak az első két napon tudtam részt venni. Az első napon workshop-ok voltak, a második napon pedig az egész napos előadás sorozat, a harmadik napon pedig főleg a wordpress core fejlesztésről volt szó és a helyi szervezők jóvoltából városnézésen is részt lehetett venni.
1. nap – (Workshop és városnézés)
Pénteken hajnalban indultunk autóval Rijekába az egyik barátommal Pataki Danival, aki nem mellesleg pont az egyik előadó volt 🙂 . 5 órás indulás és a szinte nulla forgalomnak hála 10-re már le is értünk a rijekai kikötőbe. Sajnos a korai érkezés miatt nem tudtuk még elfoglalni a szállásunkat, ami egy hajón volt! A cuccunkat azért sikerült leraknunk a hotelben, no meg Daninak sikerült még egy kicsit dolgoznia is az előadásán, mert jó programozóhoz mérten az utolsó pillanatban is talál olyat, amin még érdemes finomítani. Utána egy rövid városnézés (hosszú nagyon nem is lehetett, mert Rijeka belvárosa kb 1 – 2 óra alatt teljesen bejárható) és ebédelés. 1 órára visszaértünk a hajóra, ahol sikeresen bejutottunk a kabinunkba. Ha nem vagy klausztrofóbiás, akkor ajánlom az ilyen „Botel”-eket, van egy különleges hangulata.
De elég ennyi a hotelről, lassan indulni kell, hogy még ott tudjunk lenni egy kicsit a workshop előtt az eligazításra. A pénteki programok a rijekai egyetemen voltak már 10 órától, de délelőtt csak horvátul tartottak foglalkozást, így azt kihagytam. Délután pedig csak egy workshop volt, amit Dani tartott.
Creating the perfect development environment – Daniel Pataki
(A tökéletes fejlesztői környezet létrehozása)
Dani pénteki előadása a fejlesztői környezetről szólt, hogy ő milyen terminál commandokat, milyen virtuális gépet használ. Rengeteg érdekes és wordpress fejlesztést felgyorsító rendszerről beszélt. Az előadás felépítése megegyezett egy weboldal fejlesztés elkezdésének menetével (server – wordpress – alap pluginek felrakása). A workshopon korlátozott létszámban vehettek részt (30 fő) a jelentkezők, mert így volt arra lehetőség, hogy bármelyik lépésnél kérdezhessenek és akár ott helyben a laptopjukon csinálják ugyan azokat a lépéseket végig, amit Dani mutatott a kivetítőn.
Bocsi de a workshopról elég részletesen írok és hosszabban, mint az egész második napról, mert itt sokszor bele mentünk a részletekbe, illetve mert a szombati előadások kb 30 percesek voltak kérdésekkel együtt, de ez a pénteki workshop több mint 2 órás volt.
1. Lépés | virtuális gép felállítása.
A kiválasztott virtuális gép a Vagrant volt, amit mi is ajánlunk tárhely megrendelőinknek, ha tesztelni szeretnének. Egy kis rövid ismertető a vagrantról illetve a telepítéséről. Utána egy kis extra config file beállítás. Plusz levezette, hogy hogyan kell egy virtuális szerveren egyszerre több teszt domaint futtatni. Tudtam, hogy ezt meg lehet oldani, de soha nem vettem rá a fáradságot, hogy utána nézzek, mert annyival egyszerűbbnek tűnt a XAMPP használata. Én xamppal kezdtem még nagyon amatőr koromban és akkor a vizuális kezelőfelülete nagyon megkönnyítette a dolgomat. Most is ezt a tanulságot vontam le, hogy kezdő programozónak érdemesebb mondjuk xamppal vagy valami hasonló rendszerrel kezdenie, mert akkor ennek a beállításával nem megy annyira az idő és később, amikor van rá ideje és affinitása, akkor álljon egy hatékonyabb és programozhatóbb rendszerre, mint mondjuk a Vagrant.
2. Lépés | ha már a szerver fut a WP-CLI használata.
Ennek a „command line interface„-nek a segítségével nagyon gyorsan, pár sor kód beírásával lehet mind azon lépéseket végig csinálni, amit alapból kattintgatással és várakozással csinálnánk meg. Ezek a lépések: friss wordpress letöltése, adatbázis felállítása, wordpress telepítése, admin regisztrációja, alap pluginek telepítése és aktiválása, fölösleges dolgok törlése (hello dolly plugin, hello word post/page/comment ). Igaz, minden futtatásához több sor kód is kell, de ezeket a parancsokat be lehet rakni egy bash fileba, és annak a futtatásával pár másodperc alatt él is a rendszerünk.
Emellett még rengeteg hasznos dologra használható. Például téma telepítésére, akár s theme telepítésére is, ami remek alap a saját custom témánk elkezdéséhez. Lehet vele test usereket, bejegyzéseket, commenteket és oldalakat is telepíteni kevesebb, mint 10 másodperc alatt. Na és a legjobb, ami a workshopon elhangzott, az oldalak áttelepítését segíti: adatbázisban search and replace. De mi is ez? A Tárhelyparknál elég sok weboldal készül manapság (ebben az évben indítottuk el a weboldal készítés szolgáltatásunkat) és ezekhez az ajánlatkérés után mindig csinálunk egy ingyenes demo oldalt, amire már az élesbe állítás előtt feltöltjük az élő tartalmat. Rengeteg helyen jelenik meg az adatbázisban a demo oldal linkje, aminek a kicserélése nem is lenne olyan nehéz, de sok helyen serialized array-ben vannak elmentve. Ezeknek elég problémás a kicserélése, főleg ha tele van UTF-8 -as karakterekkel. A mi fejlesztőcsapatunknak erre van egy megoldása, amit néha még mindig kijátszik pár különleges karakter, de majd intenzív tesztelés alá vesszük a WP-CLI segítségével.
3. Lépés | weboldal készítőknek az egyik leghasznosabb plugin ACF (Advanced Custom Fields) plugin
Már dolgoztam párszor az ACF-el. Pont azt csinálja, amit a neve is mutat: a postokhoz (post, page, custom post type …) tartozó custom meta fildeket teszi egyszerűen, a userek számára könnyen kezelhetővé. Sajnos nem olyan könnyű írni róla, egyszerűen ki kell próbálni és ha már egy témádban használtad, akkor az összes többiben is fogd, annyira jó. Mindenféle fieldet (text, textarea, checkbox, dropdown, radio, date, image, map, repeater, number ,stb.), mindenféle kombinációban hozzá lehet rendelni a backended bármelyik pontján. Tudom, ez nagyon általánosan hangzik, de erről van szó! Ha mondjuk egy recept oldalt csinálsz, akkor a back end-ben a receptjeidhez hozzá rendelhetsz egy repeater fieldet, aminél minden sorban van egy kép feltöltési lehetőség, egy név, egy mennyiség, egy kalória érték field; akkor ezekkel már meg is oldottad, hogy az alapanyagokat a back end-ben nagyon egyszerűen fel lehessen tölteni és mind ezt, ha már fel van telepítve az ACF plugin, akkor kb 1 perc alatt eléred, hogy egy a wordpress designjához 100%-ban passzoló (mint ha beépített lenne) form fildjeid legyenek a háttérben. A front end-en pedig két egyszerű coddal meghívhatod az adott field tartalmát – get_field() | the_field() – és ha már láttáf wordpress functiont, akkor tudod is, hogy a the_field()-el megmutatod a tartalmat, a get_field()-el meg megkapod az értékét, ahogy az várható. Mivel ezt tényleg ki kell próbálni (mert magyarázni nehéz), itt van egy rövid videó róla.
4. Rész | Child theme használta
Szinte alap, ha egy más által készített téma alapján készítesz ügyfélnek weboldalt, és bele akarnál nyúlni a téma file-jaiba, hogy jobban illeszkedjen az elképzelésekhez, akkor NE TEDD! Ne nyúlj bele az eredeti téma file-okba! Csinálj egy Child theme-et és abba rakd át a módosítandó fileokat és ott módosítsd, így van esélyed, hogy a téma alap frissítése nem fogja tönkretenni azokat a módosításokat, amiket te csináltál, illetve könnyebben tudod updatelni a módosításokat is, ha esetleg valami gond lenne. Ebben a cikkben megtalálod, hogy hogyan lehet child theme-et csinálni: How to Create a WordPress Child Theme
5. Rész | Gulp-ról
Szintén egy terminálba (command line-ba) beépülő rendszer a Glup. A gulp-ot lehet használni a különböző java scriptek „pre-processs”-álására, az-az , ha nagyon struktúráltan írod meg a javascript cododat több fileban szétosztva és commentelve, akkor a gulp segítségével a szerkesztett file mentésének pillanatában képes az összes java scriptedet egy file-ba összecsomagolni minify-olva. Így már hatékonyan tudod hozzácsatolni a témádhoz. Ugyan így van a LESS, SASS style filokkal. A legjobb benne, hogy mindezt abban a pillanatban lefuttatja, amint mented az éppen szerkesztett file-t, nem kell külön a terminálban a fejlesztési periódusok végén elindítani. Ugyanígy képes arra, hogy a böngésződben a megnyitott teszt oldalt is újratöltse, amint elmented a szerkesztett filt, akár úgy is, hogy az oldal nyitva van a telefonodon, tableteden és a desctopodon is. Itt megtalálhatjátok az összes plugint a guplhoz.
6. Minden más
Symlink használata – ha mondjuk egy Git projektben benne van a téma is, és a szükséges pluginek is, akkor a symlink segítségével bárhová be lehet húzni ezeket az almappákat, akár több futó virtuális gép wordpress mappájába is. Ekkor ha változtatsz valamin, az mindegyik oldalon azonnal látszik (ha mindegyikbe külön bemásolnád a téma és plugin mappákat, akkor a változtatás után mindegyikbe át kell vezetni a változtatásokat).
Tester pluginek
Theme Check – olyan ellenőrző plugin, amit érdemes a fejlesztés végén lefuttatni (és a hibák javítása után még egyszer 🙂 ). Ellenőrzi, hogy vannak-e benne olyan codok, amik a wordpress standerdek szerint hibásak / problémásak lehetnek.
Regenerate Thumbnails – ha menet közben változtatnál a beépített default image sizeokon, akkor érdemes ezt a plugint lefuttatni. Megfogja az alap képet és újra generálja belőle a beállított image sizokat (thumbnail, medium, large, custom sizok).
Monster widget – egyszerűen egy gombnyomással berakja az összes core widgetet a sidebarba, így nem kell egyesével berakosgatni őket, hogy tesztelni lehessen a designt.
Azt hiszem ezzel elég kimerítően és részletesen leírtam, hogy milyen volt a workshop. Ja igen, amiről még nem írtam, hogy a résztvevők demográfiai összetétele elég vegyes volt. Annak ellenére, hogy arra számítottam, hogy 20 – 30 éves srácok lesznek csak, ehhez képest maximum 15-en férhettek bele ebbe a sztereotípiába. Rajtuk kívül legalább 10 lány volt és az idősebb korosztály is képviseltette magát, sőt mindenki aktívan vett részt a foglalkozáson (kérdeztek, próbálták követni).
A nap további részében sikerült még beiktatni egy kis fagyos úszást is. Természetesen sikerül mindig akkor utaznom Horvátországba, amikor esős az idő, erre a hétvégére is azt mondták, hogy végig esni fog az eső, ezért így is készültünk (csak egy rövid strandolást terveztünk be). Végül végig kellemes volt az idő, csak abban a kb. 2 órában esett (szakadt) az eső, amikor lent voltunk a tengerparton. Ez nem lett volna akkora baj, hacsak nem pont egy olyan helyen lettünk volna (ahogy később a helyiektől megtudtuk), ahol hideg források törnek fel a tengerben, így a víz reszketően hideg volt.
A következő bejegyzésemben összefoglalom a második nap érdekességeit.