Polymer + AngularJS helposti: Yeoman

Olen pyöritelly vähän Polymeriä koska se kiinnostaa kovasti. Kyseessä on siis uuden sukupolven JavaScript-ui kirjasto jossa pääjuju on komponentisointi, uudelleenkäyttö, laajennettavuus – mutta vaihteeksi UI puolella.

Ongelmana on että se ei ole yksinään kovin vahva – se keskittyy vain yhteen asiaan eli komponentteihin. Frameworkit kuten Angular ovat suosittuja koska sieltä löytyy järeästi arkkitehtuuria tarpeeseen kuin tarpeeseen.

Olen käytellyt Yeomania aiemminkin, mutta aika ajoin huonoin kokemuksin. Nyt päätin testata sitä tässä yhteydessä vielä kerran, ja vaihteeksi pelittää hienosti. Tässä tarinaa vähän elementeistä ja kokemuksista.

Pohjalle koneeseen on syytä asentaa Node.js ja npm, niiden avulla pystyy sitten asentamaan kaiken muun. Vakityökalut mitä asennan tyypillisesti ensiksi, ovat esim. bower ja grunt, ja tässä yhteydessä yeoman. Ne voi asentaa globaalisti esim. näin:

npm install -g bower grunt yo

Nyt pitäisi komentoriviltä onnistua em. komennot, esim. bower, yo, grunt. Jos ei onnistu, todennäköisesti poluissa on vikaa. Esim. omassa Windows 8 koneessani piti lisätä PATH perään c:\users\munprofiili\AppData\Roaming\npm kansio johon nämä oletuksena tuikataan. Ja jo pelittää.

Seuraavat ohjeet on apinoitu suoraan lähteestä http://www.html5rocks.com/en/tutorials/webcomponents/yeoman/

Asenna polymer generaattori näin:

npm install -g generator-polymer

Seuraavaksi tehdään kansio, ajetaan generaattori, ja käynnistetään serveri:

mkdir MunPolymeeri

cd MunPolymeeri

yo polymer

(Tässä välissä voi vastata että juujuu, core ja paper kaikki mukaan vain!)

grunt server

Ja jos menee yhtä sulavasti kuin mulla, niin käynnistyy livereload serveri, joka avaa selaimen, ja lataa Angular+Polymer softarungon. Tämä on siitä metka että sitä voi haluamallaan tekstieditorilla muokkailla ja samantien kun tallentaa, se lataa muutokset ruudulle.

Olen pyöritellyt muutamia mukavia editoreita. Kaupallisella puolen varmaan IntelliJ WebStorm on kovimmasta päästä – mutta se on omaan makuuni joko turhan raskas/jäykkä/rajoittunut tai sitten en vain osaa käyttää sitä. Pidän kuitenkin keveämmistä, nopeammista ja notkeammista välineistä. Tähän asti olen käyttänyt ihan Notepad++ editoria, sopivin plugarein varustettuna. Mutta nyt aloin innostumaan Sublime Text -editorista, ja se pysyy testissä kunnes osaan sanoa onko se parempi vai huonompi kuin notepad++. Ominaisuuksia on ainakin enempi, tosin rahaa pitäisi pistää peliin jos alkaa tosissaan käyttämään. Siinä on aina pieni kynnys, onneksi kokeilemaan pääsee ilmaiseksi. Myönnettäköön myös, että Sublimen lisenssimalli on perin reilu.

No niin, siinä on toimiva softarunko pyörimässä, ja meillä on editori. Mitäs seuraavaksi? 😉

 

Linkkivinkkejä:

http://www.sublimetext.com/

http://www.jetbrains.com/webstorm/

http://notepad-plus-plus.org/

Mainokset

2 thoughts on “Polymer + AngularJS helposti: Yeoman

Vastaa

Täytä tietosi alle tai klikkaa kuvaketta kirjautuaksesi sisään:

WordPress.com-logo

Olet kommentoimassa WordPress.com -tilin nimissä. Log Out / Muuta )

Twitter-kuva

Olet kommentoimassa Twitter -tilin nimissä. Log Out / Muuta )

Facebook-kuva

Olet kommentoimassa Facebook -tilin nimissä. Log Out / Muuta )

Google+ photo

Olet kommentoimassa Google+ -tilin nimissä. Log Out / Muuta )

Muodostetaan yhteyttä palveluun %s