Frontend Friday

#20 : Kauden päätösjakso

Wed, 13 Apr 2016 12:00:00 GMT

PodLuolan perukoilla Tommi miettii syntyjä syviä. Tai syytä miksi podcastia tehdään. Syvät ajatukset kumpuavat blogipostista.

#19 : Koodikuri

Tue, 27 Oct 2015 12:00:00 GMT

PodLuolassa on koodinsiivoustalkoot, joten aiheena on koodikuri. Läpi käydään asioita eri linttereistä front end tekemiseen liittyen. Ja saattaapa tuo ajatus vähän muutenkin vaellella.

#18 : Polymer Bootstrap

Mon, 21 Sep 2015 12:00:00 GMT

Kesä vaihtuu syksyksi ja Apple julkaisee uusia käyttöjärjestelmiä ja laitteita. PodLuolan syvyyksissä keskitytään kuitenkin uusiin kirjastojulkaisuisihin. Polymerin vakaa versio tuli esille ja se toi mukanaan nopeuspäivityksiä. Material Designiä webiin Polymeria kevyempänä tarjoaa Material Design Lite. Ja Bootstrapin poppoo julkaisi alphan 4-versiostaan.

#17 : Safari on IE

Mon, 31 Aug 2015 12:00:00 GMT

Kesälomat on lusittu ja pölyt PodLuolan lähettimien päältä pyyhitty. Olli ja Tommi käyvät läpi selaimiin liittyviä asioita kesän varrelta. Muun jutustelun ohessa.

#16 : SVG

Sun, 24 May 2015 12:00:00 GMT

PodLuolan syvyyksistä avataan sanaista arkkua SVG:n suhteen. Jaksossa käydään läpi vektorigrafiikan lyhyt historia webissä. Lisäksi annetaan muutama vinkki SVG:n käyttöön sekä mahdollisuuksiin.

Caniuse.com svg-tuki
Media Queryt svg:n sisällä
SVG:n käyttö
Responsiiviset kuvat ja svg
SVG:n exporttaus Illustratorista
SVG:n optimointia webiin SVGO:lla ja SVGOMG:lla sekä yleisesti SVG:n optimoinnista
SVG:n tyylittely ja animointi CSS:n avulla
SVG:n animointi
Älä ehkä mahdollisesti base64-enkoodaa SVG:tä
Ikonifontit vs. SVG
Lonelyplanet.com (ei hotels.com, kuten jaksossa muistelin) vaihtoi SVG:hen
SVG:n use-tagin käytöstä
Sara Soueidanin blogi
Stripen checkout-demo
Snap SVG javascript-kirjasto
Sideproject Oulu Slack-kanava

#15 : Web Components

Sun, 01 Mar 2015 12:00:00 GMT

Webbiteknologioista seuraavana PodLuolan listalla oli Web Components. Olli kyseli ja Tommi vastaili sen mitä osasi. Web Componentseihin tututstuttiin pintaraapaisulla ja polyfilleistä esiin nousi Polymer ja X-Tag.

Katsomisen arvoisia videoita ovat esimerkiksi Andrew Rotan The Complimentary of React.js and Web Components, Soledad Penades:n An Introduction to Web Components ja Edge Conferencen Web Components paneeli.

Selaintuki unohtui mainita kokonaan podcastissa, joten siitä pahoittelut. Chrome ja Opera tukevat kaikkia ominaisuuksia Firefox ja Safari perässä. IE:n tilanteesta mitään ei pysty sanoa mutta lupaavasti sieltä suunnalta on asioista kuulunut. Are we Componentized Yet kertoo tilanteen tarkemmin.

#14 : React.js

Sun, 15 Feb 2015 12:00:00 GMT

PodLuolan massiivinen tuotantolaitos pyöräytti asiaa React.js-nimisestä kirjastosta. Mitä mahtaa Ollilla ja Tommilla olla sanottavaa tästä Facebookin tuotoksesta.

Muita jaksossa käsiteltyjä aiheita olivat Flux, Marty.js sekä React.js:n natiivi toteutus. Video React Nativen julkaisusta on täällä.

#13 : Versionhallintaa

Sun, 24 Aug 2014 22:00:00 GMT

PodLuolan syvyyksissä pyyhitään pölyjä podcast-laitteista ja sukelletaan versionhallinnan maailmaan. Tutustutaan hieman Gitin, SVN:n ja Mercurialin käyttöä helpottaviin työkaluihin. Lyhyet esittelyt saavat Git Tower, SourceTree, Versions, CornerStone, TortoiseSVN sekä TortoiseGit.

Versionhallinnan lisäksi tutustutaan eroavaisuuksien tarkasteluun erikoistuneisiin työkaluihin. Näitä ovat mm. DiffMerge ja Kaleidoscope.

Ulkopuolista versionhallintapaikkaa tarjoavat esimerkiksi GitHub, Bitbucket ja Beanstalk. Sekä maksullisena että maksuttomana.

Mikäli omaa kokemusta näistä tai muista vastaavista palveluista löytyy niin laittakaa palautetta. Palautekanavina ovat alla oleva foorumi, Twitteristä @FrontendFriday, Facebookista Frontend Friday sekä sähköpostitse ouluweb@gmail.com

#12 : Editorit

Sun, 15 Jun 2014 21:00:00 GMT

Tällä kertaa PodLuolan syvyyksissä puhutaan editoreista. Tarkempaan käsittelyyn pääsee ensimmäisenä Githubin Atom. Vertailukohtaa haetaan niin Sublime Textistä, TextMatesta kuin VIMistä. Myös Adoben Brackets pääsee vertailulistalle.

Toisenlaisena editorina nousee esille Macaw. Onko tässä haastaja Adoben työkalujen ylivallalle web-suunnittelussa? Ei ehkä vielä mutta hyvään suuntaan ollaan menossa. Mainintaa saa myös WebFlow, jota ei kuitenkaan vielä ole päästy koeponnistamaan.

Muissa aiheissa sivutaan seuraavia:

#11 : Word of Press

Sun, 06 Apr 2014 12:30:00 GMT

PodLuolan uumenista kantautuu jälleen kerran ääntä. Tällä kertaa Olli saatiin tynnyristä ulos ja ääni on laadukkaampaa. Kova yritys oli tiivistää jakson mittaa ja melkein siinä onnistuttiinkin.

Oletko turvassa - XP:n tuki päättyy

Windows XP:n tuki päättyy 8.4.2014 ja sitä myöten saamme jättää jäähyväiset toivon mukaan myös Internet Explorer 8:lle. Innolla odotamme miten tämä näkyy käytännön tasolla ja jäämme odottamaan Vistan tuen päättymistä vuonna 2017.

Picture-elementin implementointi Blinkiin

Responsive Images Comunity Group (RICG) on häärinyt picture elementin kanssa. Nyt ollaan ilmeisesti päästy yhteisymmärrykseen tuosta ja pitäisi implementoida selaimoottoreihin. Yoav Weiss niminen kaveri (freelancer) on pistänyt pystyyn Indie GoGo:hon kamppiksen, jossa tavoitteena on kerätä 10 000 dollaria jotta Picture elementti saadaan mahdollisimman nopeaa Blinkiin (ja sitä myöten Chrome + Opera).

Ja tavoitehan on täytetty. Lisärahoituksella kehittäjä lupasi ottaa mm. element queryt harkintaan/työn alle!

Picture srcset kuvallisesti

Mikäli picture-elementin todellinen hyöty on hieman epäselvä niin Eric Portis tarjoaa kuvallisen selityksen miten homma tulee toimimiaan.

Element queryn tila vuonna 2014

Tab Atkins kertoilee hieman element queryistä. Tai itseasiassa päivittää tilanteen ja odotettavissa olevat haasteet.

VagrantPress

Jos Wordpressin päälle kehittäminen kiinnostaa ja sen haluaa saada mahdollisimman kevyesti ylös on Vagrantpress näppärä paketti siihen.

Koneella pitää olla asennettuna Vagrant (Win, Mac, linux) jonka jälkeen otetaan klooni github-reposta. Myös VirtualBox on hyvä asentaa. Tämän jälkeen komennetaan vagrant up ja loppu on automaagista. Ensimmäisellä kerralla tulee olla verkkoyhteys mutta jälkeenpäin onnistuu ilman yhteyttä.

Wordpress API

Edellisessä jaksossa puhuttiin Hypermedia API:sta, joten tämä on hyvää jatkoa sille. WP API tarjoaa JSON-pohjaisen REST-rajapinnan Wordpressille. Plugin on aika geneerinen mutta kohtalaisen helposti laajennettavissa eri projekteihin. Tarvittaessa jopa toiminnallisen proton backend on mahdollista tämän avulla saada nopeasti pystyyn.

WPML

Mikäli Wordpress on tarve saada monikieliseksi on WPML siihen oiva työkalu. Hyvin pitkälle kaikki Wordpressissä on lokalisoitavissa. Ja suoraan Wordpressin backendistä.

WP-toolset

WP-Toolset tarjoaa useita eri työkaluja tehokkaaseen Wordpressin säätöön.

#10 : Hypermedia API

Sun, 16 Mar 2014 11:30:00 GMT

PodLuolan satelliittiyhteys tarjoilee tällä kertaa tarinaa Hypermedia rajapinnoista. Tommin ja Ollin kysymyksiin vastailee asiasta enemmän tietävä Vesa Vänskä.

Linkkejä

Video: Hypermedia APIs
Linkkilista: Hypermedia API reading list
Sovellus: Swagger
Kirja: Building Hypermedia APIs with HTML5 and Node
Kirja: RESTful Web APIs
Vesan speakerdeck
PayPal:n rajapintakuvaukset
https://speakerdeck.com/maratk/what-is-hypermedia-api
Bret Victorin video
Heroku platform api - ja blogiposti siitä

#9 : jQuery vs JavaScript

Wed, 19 Feb 2014 20:30:00 GMT

Yhteys PodLuolasta avautuu jälleen. Aiheena on JavaScript ja sen käyttö. Tarvitseeko aina sitä jQuerya pukata ensimmäisenä projektiin kiinni? Tähän vastaavat Tommi ja Olli.

Shownotes

Trendi meillä ja maailmalla tuntuu olevan pois jQueryn käytöstä. Ollaanko siirtymässä samanlaiseen tilanteeseen kuin Flashin kanssa oli jokunen vuosi takaperin? Ei sitä jQueryä kaikkeen tarvitse, selaintuki javascriptillä on jo aika hyvä ja useimmiten puhtaalla js:llä pärjää.

Chrome 34 ja Opera 21 kytkevät img srcset -tuen päälle. Vaihtoehtoja kuitenkin on tarjolla

Podcast haluaa kehittyä. Palautetta tarvitaan. Vastaa kyselyymme.

#8 : Uusi vuosi

Sun, 29 Dec 2013 20:00:00 GMT

Olli ja Tommi keräävät vuoden 2013 pääasiat ja merkittävimmät jutut nippuun kommenttie kera. Lisäksi otetaan katsaus vuoteen 2000… siis 2014. Vuoden viimeisen podcastin myötä tarjoillaan pitkä pläjäys käsikirjoittamatonta materiaalia. Ja ohjaajan versiona.

Linkkejä

#7 : Special 1 - RubySauna

Sun, 03 Nov 2013 21:00:00 GMT

Tarjolla on ensimmäinen erikoisjakso eli spesiaali. Jakson aiheena on RubySauna ja mukana on totutusta poiketen erikoiskokoonpano. Mukaan saatiin Tommi, Tuomas (@tuomasj) ja Florian (@polarblau). Erikoisjakson muodossa kieli vaihtuu lontoon murteelle.

This time our podcast is a special. Topic revolves around RubySauna with Tommi, Tuomas (@tuomasj) and Florian (@polarblau). And this time we will speak english. A true special treat.

#6 : Meille on tullut palautetta

Sun, 01 Sep 2013 22:00:00 GMT

Podcastimme sai ensimmäisen sähköisen palautteen. Siitä innostuneena päädyimme tekemään koko jakson kyseisen palautteen ympärille. Läpi käydään yleisellä tasolla asioita, joita vaaditaan jotta pääsee töihin webbialalle.

Tarkoituksena oli tehdä tiivis ja aavistuksen lyhyempi jakso. Valitettavasti epäonnistuimme siinä. Mutta luvassa on tuttuun tapaan jotain asiallisen keskustelun ja tajunnanvirran väliltä.

#5 : Sisällönhallintajärjestelmät

Thu, 08 Aug 2013 20:00:00 GMT

Tommi ja Olli palaavat kesälomilta koneiden ääreen. Tarjolla on keskustelua sisällönhallintajärjestelmistä niin hyvässä kuin pahassa. Ytimessä pureudutaan oikean sisällönhallintajärjestelmän valintaan ja todetaan että WordPress ei ole vastaus kaikkiin kysymyksiin. Vain johinkin. Koko homma menee freestylenä, joten osalla jutuista ei ole päätä eikä häntää.

#4 : Työvoimapolitiikkaa

Thu, 04 Jul 2013 17:00:00 GMT

Kesälomafiiliksillä vedettiin lähes kahden tunnin setti. Olli on jo lomalla ja Tommi odotteli lomien alkua. Eli juttu harhaili Backbone.js:n ja CoffeeScriptin kautta webbikäyttöliittymiin ja työntekoon. Luvassa siis on levotonta ja hyppivää keskustelua aiheesta ja aiheen vierestä.

Palautetta ja kommentteja otetaan vastaan. Podcast on jatkuvassa kehityksessä joten aihe-ehdotuksia, kysymyksiä ja vinkkejä otetaan vastaan eri palautekanavien kautta. Vaikka tätä itse tehdään niin tarkoitus on kuitenkin jakaa hyvää kaikille.

Linkit löytyvät tälläkin kertaa Kipptistä.

#3 : Webshaped

Mon, 27 May 2013 17:00:00 GMT

Olli ja Tommi kävivät Webshapedissa kuuntelemassa asiaa webistä. Tässä on lyhyt yhteenveto päivän tapahtumista.

Linkit löytyvät tällä kertaa poikkeuksellisesti Kippt.comista.

#2 : Episodi 2

Sun, 14 Apr 2013 21:00:00 GMT

Ex tempore -jakso, jossa haetaan omaa näkökulmaa erilaisiin aiheisiin. Tapaamista ei edellisen jakson jälkeen järjestetty, joten luvassa on luovaa kaaosta aiheiden osalta.

Uutisia

Selainmaailman muutokset

Opera vaihtaa WebKitiin

Jonka jälkeen Google forkkaa WebKitin (nimeltä Blink)

Ja Opera seuraa perässä

Paul Irish: WebKit for Developers

Webshaped-tapahtuma Helsingissä lähestyy

Webshaped.fi

Puhujat

Jake Archibald, Google Chrome
Jonathan Smiley, ZURB
Vitaly Friedman, Smashing Magazine
Darrell Stephenson, Soundcloud
Holger Bartel , uforepublic
Yves Peters, FontFeed
Andrew Nesbitt, Forward

Pari videota

Brad Frost : Death to Bullshit
Brad Frost käskee keskittymään sisältöön. Unohtakaa hälinä (mainokset, QR-koodit ym) ja keskittykää sisältöön.

Mike Monteiro : Fuck you. Pay me
Asiallinen ja kärkevä “puhe” Mike Monteirolta mm. asianajajien tärkeydestä, sopimusasiakirjoista ja muista vaikeista asioista. Erityisen hyvä webbiyrittäjille.

Breaking the 1000ms Time to Glass Mobile Barrier
Todella mielenkiintoinen pureutuminen siihe, miten webbisivu saadaan nopeaksi. Ei vain mobiilissa vaan ihan yleensä. Läpi käydään mm. se kuinka paljon aikaa menee pelkkään verkkoneuvotteluun puhelimen ja maston välillä.

Creative JavaScript in advertising

Muita aiheita

Media Queries are a Hack by Ian Storm Taylor
Ovatko media queryt liian laajoja RWD sivujen tekoon? Tarvitaanko element queryjä?

Responsive Nav
Viljami Salmisen js-kirjastoriippumaton responsiivinen valikkoplugari

Advanced cross-browser flexbox
Edellisen podcastin flexbox käytännössä. Saavutettuja etuja (myös demossa) mm. media query -vapaa layout. Haasteena on kolme erilaista syntaksia (ns. vanha, hybridi ja speksin mukainen)

Can I Use

Frontend Friday

Meillä on webbisivut osoitteessa ouluweb.github.io
Seuraava miitti on sovittu tiistaille 30.4. Paikkana Business Kitchen, Torikatu 23 (4. krs.), 90100 Oulu
Podcastia voi kommentoida Branchissa
Sähköpostitse voi lähestyä ouluweb@gmail.com
Miitti-ideoita otetaan vastaan
Podcast-aiheita ja ideoita otetaan vastaan

#1 : Responsive Grids part 1

Sun, 24 Mar 2013 20:00:00 GMT

Tommi ja Olli keskustelevat grideistä, munkeista ja karusellien tehokkuudesta. Eli puhutaan aiheesta ja aiheen vierestä.

Frontend Friday

#20 : Kauden päätösjakso

#19 : Koodikuri

#18 : Polymer Bootstrap

#17 : Safari on IE

#16 : SVG

#15 : Web Components

#14 : React.js

#13 : Versionhallintaa

#12 : Editorit

#11 : Word of Press

Oletko turvassa - XP:n tuki päättyy

Picture-elementin implementointi Blinkiin

Picture srcset kuvallisesti

Element queryn tila vuonna 2014

VagrantPress

Wordpress API

WPML

WP-toolset

#10 : Hypermedia API

Linkkejä

#9 : jQuery vs JavaScript

Shownotes

#8 : Uusi vuosi

Linkkejä

#7 : Special 1 - RubySauna

Links

#6 : Meille on tullut palautetta

#5 : Sisällönhallintajärjestelmät

#4 : Työvoimapolitiikkaa

#3 : Webshaped

#2 : Episodi 2

Uutisia

Webshaped-tapahtuma Helsingissä lähestyy

Puhujat

Pari videota

Muita aiheita

Frontend Friday

#1 : Responsive Grids part 1

Gridiesimerkit

Webbigridit

Linkkejä