Yleistä keskustelua webdevauksesta

[aittis]

Miten pääset alkuun?
Mikä on kuuminta hottia?
Mikä on kuumin frameworkki?
Millä olet itse tehnyt viimeaikoina hommia?
Millä toteuttaisit applikaation X?

Tutoriaaleja, artikkeleita, vertailuja yms!

 

[aittis]

Monesti webdevauksessa mieltymys siirtyä heti käyttämään uusimpia käytössä olevia fullstack-frameworkkejä on suuri. Tämä ei kuitenkaan pitkällä juoksulla ole kannattavaa.

Aluksi itse suosittelen ihan lähtemään perus HTML+CSS -tasolta. Niillä pääsee oikeasti alkuun. Monet käytännön työsuoritteet ovat niiden muokkaamista jo olemassa oleviin sivustoihin. Tai vaihtoehtoisesti näillä tekniikoilla toteutettaviin pieniin staattisiin HTML-sisältöihin.

HTML+CSS taidoilla voi tosiaan toteuttaa pieniä sivuja. Seuraava askel mielestäni on tutustuminen CMS-ohjelmiin, mm. Wordpress. Näissäkin aluksi riittää, että osaa tehdä tyyleihin muutoksia ja saa hieman käsitystä kuinka dynaamisuus nettisivuissa toimii. Wordpressin kautta pääsee tutustumaan PHP:hen. Tämäkin luo hyvää pohjaa. Pienet muutokset PHP:llä valmiisiin pohjiin tuovat ensimmäisen asekeleen kohti dynaamisuutta. Kuitenkin HTML+CSS kulkee tässä vahvasti mukana.

Seuraavaksi suosittelen ottamaan haltiin jonkin HTML-CSS-JS -frameworkin pelkästään fronttipuoleen, esim Bootstrap tai Materialize. Näiden avulla staattisiin sivustoihin jo hieman syvyyttä pienellä määrällä JavaScriptiä.

Nyt ollaankin sitten tasolla missä on syytä miettiä hieman laajempaan frameworkkiin tutustumista. Käsissä on siis taidot HTML, CSS, (Bootstrap) ja vähän PHP:tä. Vaihtoehtoja on kymmeniä ja jokainen webdevaaja suosittelee automaattisesti sitä mitä hän tällä hetkellä käyttää.

Kuuminta hottia fronteissa:
VUE.js, puhtaasti fronttipuoleen kehitetty JS-framework millä on tosi laaja kasvava yhteisö.
React: Facebookin devaajien kehittämä JS-framework mitä oikeasti hyödynnetään itse Facebookissa yllättävän vähän. Muun muassa Airbnb sovelluksen hakuominaisuus tehty kokonaan tällä.
Angular: Nykyään "must to have" -fronttipuolella. Laaja käyttäjäkunta mutta vähän jo ehkä hiipumassa verrattuna kahteen edelliseen (lue hiipumassa kuuminta hottia -kategoriasta)
jQuery: Tämä sen takia, että esim validointi-kirjasto todella hyvä. Yhdessä AJAXin kanssa kova työkalu edelleen, varsinkin jos nojataan paljon backendiin.

Yhteenvetona näistä ei ole väliä mitä näistä suosit, kunhan perusteet ELI SE HTML JA CSS oikeasti hanskassa! Tähän kategoriaan tulee vuosittain uutta kamaa ja vaihtoehtoja!

Backend (middleware)
Viimeaikoina trendi ollut siirtyä raskaista möhköistä sulaviin ja etenkin prototyyppejä suosiviin tekniikoihin. Full-Stackit ovat olleet viime vuosina hybridimalleja, jotka tarjoavat esim tietokannan, backendin ja jonkun yllämainituista fronteista. Kaikki samassa paketissa. Hyvä lähtökohta, esim MEAN (Mongo, Express Angular, NodeJS).
Tähän kategoriaan kuuluu myös Rails, Django, Laravel, yms. Näistä en nyt ehdi kertoa enempää.

Eli summataan:
Tekniikoita todella paljon. Kirjastoja ja frameworkkejä todella paljon. Joka vuosi tulee joku uusi "mikä on pakko oppia". Näissä kaikissa todella tärkeää osata ne perus HTML+CSS -tekniikat hyvin. Pointtina kuitenkin hypätä suoraan uusimpaan (esim VUE) on mielestäni irrelevanttia.

Ehkä parempi jakaa tämä tasoihin missä edetä:
1: Aluksi siis HTML + CSS, jolla voi toteuttaa omaan portfolioon sivustoja. Samalla responsiivisuuden perusteet hanskaan. Nettihotellit yms tulevat tutuiksi.

2. Wordpress. Dynaamisen sivuston toteutus käyttämällä Wordpressin valmiita teemoja (näitä satoja tuhansia). Teemojen pieni muokkaus käyttötarkoitukseen sopivaksi (HTML, CSS, hieman PHP:ta).

3. Wordpressin täysin oman teeman toteutus. (HTML, CSS, PHP ja esim. Bootstrap!). Tällä oikeasti pääsee jo pitkälle ja voi tarjota asiakkaille täysin kustomoituja helppokäyttöisiä dynaamisia sivustoja.

4. Frameworkit. Tässä voi käyttää jo mielikuvitusta mitä haluaa tehdä, mihin käyttöön halutaan tehdä jne. Käytännössä puhutaan verkkopalveluista. Tähän esimerkkinä ihan Rails ja Bootstrap.

5. Fullstack. Oikotie dynaamiseen verkkopalveluun. Esim MEANin lisäksi harkitsisin jopa Meteoria. Meteor antaa myös kosketuksen mobiiliapplikaatioihin. Näissä tutustuu jo osittain kuumimpaan hottiin. Viimeisin oma projektini oli esimerkiksi Meteor + React verkkopalvelu.

6. Kokonaisvaltainen verkkopalvelu. Tässä voi hyödyntää kaikkea. Esimerkiksi Django(pythonin päällä pyörivä arkkitehtuuri) + Angular + Vapaavalintainen tietokanta. Tässä pääsee jo käsiksi pyhään kolminaisuuteen, Backendiin, tietokantaan ja fronttiin.

 

[Elon Musk]

Aika hyvä yleisohje. Painottaisin kuitenkin enemmän JavaScriptin oppimista. Se ei ole mikään helppo kieli vaikka saattaa hello worldin perusteella sellaiselta vaikuttaakin. Se on kuitenkin vakiintunut front-end-kieli ja nykyään myös palvelimen puolella (Node) ja sulautetuissa laitteissa. Sen perusteet kannattaa osata hyvin, muuten kaikkien js kirjastojen käyttö on hiukan hankalaa.

 

[aittis]

Aika hyvä yleisohje. Painottaisin kuitenkin enemmän JavaScriptin oppimista. Se ei ole mikään helppo kieli vaikka saattaa hello worldin perusteella sellaiselta vaikuttaakin. Se on kuitenkin vakiintunut front-end-kieli ja nykyään myös palvelimen puolella (Node) ja sulautetuissa laitteissa. Sen perusteet kannattaa osata hyvin, muuten kaikkien js kirjastojen käyttö on hiukan hankalaa.

Joo, vaikka viestissäni mainitsinkin PHP:n useaan kertaan painotan että JS paljon tärkeämpi kieli opetella alussa

 

[muzzy]

Toivottavasti javascript kuolee kokonaan siitä roolista minkä se on saanut, ihan kamala kieli ja hirvittävä ekosysteemi. Tulevaisuudessa joku WebAssemblyn päälle rakentuva ratkaisu tarjoaisi ihan samat edut siitä että sekä palvelimella että clientillä pyörii samalla kielellä koodi ja jopa sama koodikanta. Tosin toivottavasti se ei tarkoita sitä että clienttipuolen UI-jutut koodataan PHP:llä siitä eteenpäin myös... argh.

 

[jase]

En tiedä meneekö jo enemmän järjestelmäkehityksen puolelle, mutta kovasti on alkanut kiinnostaan reaktiiviset arkkitehtuurit. Käytännössä siis mikropalveluarkkitehtuurin RPC/REST hässäkät korvataan Kafkan kaltaisilla event streameilla, jolloin eri järjestelmät keskustelevat toisilleen pub/sub periaatteella request/response viestien sijasta.

Tässä hyvä intro reaktiivisiin mikropalveluihin http://www.mammatustech.com/reactive-microservices

 

[sakson]

PHP:tä kannattaa kyllä opetella enemmän kuin "hieman", ennen WordPressin kanssa leikkimistä. Helpottaa muokkaamista, eikä tarvitse jokaisen pienen asian takia asentaa pluginia.

 

[SweeneyTodd]

PHP:tä kannattaa kyllä opetella enemmän kuin "hieman", ennen WordPressin kanssa leikkimistä. Helpottaa muokkaamista, eikä tarvitse jokaisen pienen asian takia asentaa pluginia.

En kyllä suosittele puukottamaan WordPressiä suoraan. Ennemmin käpistelee ne omatkin muutoksensa pluginmuotoon, niin päivitykset helpottuu kummasti ja mahdollisen ongelman aiheuttaja on helpommin löydettävissä, kun voi plugineita näppäillä päälle ja pois.

 

[sakson]

En kyllä suosittele puukottamaan WordPressiä suoraan. Ennemmin käpistelee ne omatkin muutoksensa pluginmuotoon, niin päivitykset helpottuu kummasti ja mahdollisen ongelman aiheuttaja on helpommin löydettävissä, kun voi plugineita näppäillä päälle ja pois.

Toki ei sitä heti kannata lähteä muokkailemaan mitään tärkeimpiä asioita, ettei hajoita koko sivustoa. Lähinnä ajattelin, että ymmärtää mitä template-tiedostot tekee ja helpottaa custom pagen tekemistä suuresti.

 

[SweeneyTodd]

Toki ei sitä heti kannata lähteä muokkailemaan mitään tärkeimpiä asioita, ettei hajoita koko sivustoa. Lähinnä ajattelin, että ymmärtää mitä template-tiedostot tekee ja helpottaa custom pagen tekemistä suuresti.

Joo, en tarkoittanutkaan etteikö php olisi hyvä olla hallussa wp:n kanssa, mutta halusin vain antaa tarkentavan huomautuksen ennen kuin joku päättää helposti ja näppärästi muokata sivunsa siihen kuntoon, että menee kaikki rikki ensimmäisessä päivityksessä.

 

[Pirssi]

Olis kiva päästä tuolle tasolle, että voisi aina opetella sitä mikä on "kuuminta hottia".
Tämä artikkeli helpotti vähän ymmärtään noita gruntteja, nodeja, gulppeja, sasseja, kissoja ja koiria. Mutta silti nuo monet tuntuu niin etäisiltä, että en edes yritä opetella. Perus HTML ja CSS ja jopa SCSS alkaa sujumaan. Vähän on tullut tehtyä WP:lle + Foundationia ja Bootstrappia tullut käytettyä, mutta en oikein saa niistäkään vielä tarpeeksi irti.

Mitenhän näitä juttuja kannattaisi opetella kun en tiedä tarvitsenko jotain noista miljoonista työkaluista? Just eilen lähdin tekeen saittia tämän avulla http://getskeleton.com/ kun meni hermot bootstrapin ja foundationin asennussäädöissä.

 

[Rantakemisti]

Webbipuolelta tällä hetkellä HTML, CSS, JS ja PHP on hyvin hallussa ja näillä tulee leipätyökin tehtyä. Olisi hauskaa opetella jokin uusi Js-kirjasto jQueryn lisäksi mutta en oikein tiedä mistä lähteä liikkeelle kun työssäkään ei tarvitse muuta osaamista. Fiilikset ovat tämän artikkelin mukaiset: https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f#.pa7tz46av

 

[sco]

Onko jollain käytännön kokemusta Angular2:n myötä pintaan pulpahtaneesta TypeScriptistä?
Jotenkin tuo idea koodin kääntämisestä kohde-ecma-versiolle herättelee toiveita vähemmän keljusta selainkoodittelusta.

 

[Zuprlazeh]

Webbipuolelta tällä hetkellä HTML, CSS, JS ja PHP on hyvin hallussa ja näillä tulee leipätyökin tehtyä. Olisi hauskaa opetella jokin uusi Js-kirjasto jQueryn lisäksi mutta en oikein tiedä mistä lähteä liikkeelle kun työssäkään ei tarvitse muuta osaamista. Fiilikset ovat tämän artikkelin mukaiset: https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f#.pa7tz46av

Itsellä melkeinpä sama tilanne. Webbikoodailua tulee tehtyä työksi, enimmäkseen HTML, CSS ja JS, mutta myös PHP:tä jonkin verran. Tekisi mieli opetella syvemmin JS:ää ja PHP:tä, tällä hetkellä teen sivupohjia vanhemman koodarimme rakentaman hallintajärjestelmän päälle, joten niihin ei ole tarvinnut kovin paljoa perehtyä. Toki joskus on pitänyt tehdä jotain omiakin muokkauksia ja sitä kautta saanut vähän lisää kokemusta niistä.

Pitäisi joskus saada aikaiseksi jokin oma hiekkalaatikko jossa pääsee testailemaan.

 

[malagon]

EDIT. En osaa lukea.

 

[Rantakemisti]

JavaScriptistä kun puhutaan niin nykyään se taitaa vähän mennä näin:
https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f#.lw8xqo5h3

Jep, postasin jo tuon artikkelin kaksi viestiä sitten.

 

[malagon]

Jep, postasin jo tuon artikkelin kaksi viestiä sitten.

Jepp. Sori. Taisi iskeä lukihäiriö.

 

[aittis]

Olis kiva päästä tuolle tasolle, että voisi aina opetella sitä mikä on "kuuminta hottia".
Tämä artikkeli helpotti vähän ymmärtään noita gruntteja, nodeja, gulppeja, sasseja, kissoja ja koiria. Mutta silti nuo monet tuntuu niin etäisiltä, että en edes yritä opetella. Perus HTML ja CSS ja jopa SCSS alkaa sujumaan. Vähän on tullut tehtyä WP:lle + Foundationia ja Bootstrappia tullut käytettyä, mutta en oikein saa niistäkään vielä tarpeeksi irti.

Mitenhän näitä juttuja kannattaisi opetella kun en tiedä tarvitsenko jotain noista miljoonista työkaluista? Just eilen lähdin tekeen saittia tämän avulla http://getskeleton.com/ kun meni hermot bootstrapin ja foundationin asennussäädöissä.

Työkaluja on tosiaan paljon, ei ehkä miljoonia
Kaikkea ei tarvitse hallita. Suosittelisin ehkä tutustumaan Meteoriin, sillä helppo lähteä kokeilemaan eri frontteja. https://www.meteor.com/

Tutoriaaleista löytyy kolme versiota, blaze, angular ja react. Suosittelen ehkä kertomasi perusteella tekemään tuon Blaze-tutoriaalin. Sen jälkeen voit tutustua miten nuo muut eroavat siitä.

 

[aittis]

Webbipuolelta tällä hetkellä HTML, CSS, JS ja PHP on hyvin hallussa ja näillä tulee leipätyökin tehtyä. Olisi hauskaa opetella jokin uusi Js-kirjasto jQueryn lisäksi mutta en oikein tiedä mistä lähteä liikkeelle kun työssäkään ei tarvitse muuta osaamista. Fiilikset ovat tämän artikkelin mukaiset: https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f#.pa7tz46av

Riippuu tietenkin teetkö esimerkiksi Vanilla PHP:ta vai esimerkiksi Laraveliä? Laravel ja AngularJS aika hyvä kombinaatio tutustua JS-frameworkkeihin.

 

[Dawn]

Onko täällä kukaan tehnyt Spring frameworkin yhteyteen (esim. Spring Boot/MVC) frontendiä miten? Suunnitelmissa oli omaa projektia ajatellen tehdä sivujen renderöinti palvelinpuolella Freemarker -template engineä käyttäen. Palvelun ei ole tarkoitus olla miljoonia käyttäjiä palveleva, joten skaalautuvuus lienee riittävä. Tuntuu kyllä Angularin jälkeen, että palataan JSP/JSTL aikaan takaisin. Toisaalta eikö näitä kannata aina pohdiskella oman tarpeen mukaan.

Valitsin tämän polun siis, koska:

• Halusin tietää millaista Freemarkerilla on tehdä frontend
• JS frameworkit päivittyvät tällä hetkellä niin hurjaan tahtiin, että en ajatellut olla jatkuvasti vaihtamassa/päivittämässä
• Helppo tehdä Springin yhteydessä

Huonoja puolia on varmaan se, että ei pääse nauttimaan vaikka Reactin tarjoamista hienouksista sivullaan. Pystyisikö sitä ottamaan käyttöön rinnalle osittain?

 

[Pirssi]

Työkaluja on tosiaan paljon, ei ehkä miljoonia
Kaikkea ei tarvitse hallita. Suosittelisin ehkä tutustumaan Meteoriin, sillä helppo lähteä kokeilemaan eri frontteja. https://www.meteor.com/

Tutoriaaleista löytyy kolme versiota, blaze, angular ja react. Suosittelen ehkä kertomasi perusteella tekemään tuon Blaze-tutoriaalin. Sen jälkeen voit tutustua miten nuo muut eroavat siitä.

Kiitoksia! Pitääpä tosiaan tutustua meteoriin seuraavaks.

 

[Saiso]

Onko jollain käytännön kokemusta Angular2:n myötä pintaan pulpahtaneesta TypeScriptistä?
Jotenkin tuo idea koodin kääntämisestä kohde-ecma-versiolle herättelee toiveita vähemmän keljusta selainkoodittelusta.

Tuota tulee työssä käytettyä aika paljon Angular 2/Ionic 2 kanssa, ja tykkään kovasti.

 

[aittis]

Huomenna 25.10. läpsähtää Kickstartteriin Font-Awesome 5 jonka voi ostaa early-birdinä 20 dollarin hintaan.

Hieno video tulossa

Suosittelen!

 

[aittis]

https://www.kickstarter.com/projects/232193852/font-awesome-5

Siinä

 

[Rantakemisti]

https://www.kickstarter.com/projects/232193852/font-awesome-5

Siinä

Eli Font Awesome 5 on maksullinen mutta 4.7 pysyy vapaasti käytettävänä?

 

[aittis]

Eli Font Awesome 5 on maksullinen mutta 4.7 pysyy vapaasti käytettävänä?

Perus versio vitosesta tulee myös ilmaiseksi. Pro-versiossa esim. +1000 ikonia enemmän sekä tuki SVG:lle

 

[Rantakemisti]

Perus versio vitosesta tulee myös ilmaiseksi. Pro-versiossa esim. +1000 ikonia enemmän sekä tuki SVG:lle

Ok, onhan tuolla tuo "Free" ja "Pro" taulukko mutta nuo Pron Student / Non-Profit, Personal / Company, Enterprise ja Theme lisenssit hämäsivät.

 

[Pirssi]

Meikällä tosiaan nyt opiskelujen puolesta hyvä hetki opetella uusia juttuja. Pitäis siis alkaa tekemään "jotain projektia". Itse saan siis päättää mitä teen tän syksyn.

js, jquery, node, npm, gulp, git, php - tuossa muutamia juttuja, mitä haluaisin ottaa haltuun ja jos tän projektin puitteissa pääsis joihinkin noista käsiksi niin olishan se tosi jees. Oon siis tosi alottelija näissä jutuissa, mutta aikaa tässä on ihan hyvin. Tulisko teille mieleen jotain, mitä voisin tehdä? Oisko se joku web-appi vaikka sillä Meteorilla tehtynä? Vai jotain ihan muuta? Saa ehdottaa mitä vaan. Sillä lopputuloksella ei oo kuitenkaan niinkään väliä itselleni kunhan vaan hyötyisin jotain tästä ajasta mikä tuohon projektiin uppoaa.

 

[Saiso]

Meikällä tosiaan nyt opiskelujen puolesta hyvä hetki opetella uusia juttuja. Pitäis siis alkaa tekemään "jotain projektia". Itse saan siis päättää mitä teen tän syksyn.

js, jquery, node, npm, gulp, git, php - tuossa muutamia juttuja, mitä haluaisin ottaa haltuun ja jos tän projektin puitteissa pääsis joihinkin noista käsiksi niin olishan se tosi jees. Oon siis tosi alottelija näissä jutuissa, mutta aikaa tässä on ihan hyvin. Tulisko teille mieleen jotain, mitä voisin tehdä? Oisko se joku web-appi vaikka sillä Meteorilla tehtynä? Vai jotain ihan muuta? Saa ehdottaa mitä vaan. Sillä lopputuloksella ei oo kuitenkaan niinkään väliä itselleni kunhan vaan hyötyisin jotain tästä ajasta mikä tuohon projektiin uppoaa.

Ei sen kummemmin ole mitään ideaa, mitä voisit tehdä, mutta tuo teknolokiastäkki on alkuun aivan riittävä varmasti. Nuo kun sisäistää ja päälle joku JS- ja PHP- framework niin saa varmaan töitäkin alalta.

 

[jase]

Jos tyhjästä pitäis jotain keksiä niin ettisin jotain avointa dataa ja yhistelisin/esittäisin niitä jotenkin kivasti/kivalla twistillä. Esmes ite meinasin tehä ruuhkavaroittimen/ennustimen pohjantielle.

 

[aittis]

Kannattaa jakaa harjoittelu pieniin projekteihin. Liian ylenpalttinen applikaatio lähtee helposti liian laajaksi.

Jos vaikka funktionaalisuutta ja puhdasta ohjelmointitaitoa haluaa kehittää niin rakenna aluksi vaikka puhtaasti javascriptillä (ilman kirjastoja) Yatz-peli. Ulkoasussa käytä vaikka bootstrappiä.

Toinen esimerkki vaikka Geolokaatiota hyödyntävä applikaatio mikä voi esimerkiksi kertoa eri kaupunkien etäisyyksiä.

Tässä voit käyttää tilastokeskuksen avointa dataa ihan staattisena aluksi (lue, kopioimalla vaikka kaupungit koordinaatteineen objektiksi). Tämän jälkeen voit kokeilla muuttaa nämä api-kutsuiksi


Sent from my iPhone using Tapatalk

 

[Pirssi]

Ei sen kummemmin ole mitään ideaa, mitä voisit tehdä, mutta tuo teknolokiastäkki on alkuun aivan riittävä varmasti. Nuo kun sisäistää ja päälle joku JS- ja PHP- framework niin saa varmaan töitäkin alalta.

Nonni loistavaa, nyt kun sais vielä jonkunlaisen suunnitelman värkättyä, että miten noita lähtee opiskelemaan (ja missä järjestyksessä) niin eiköhän ne pikkuhiljaa alkais luonnistumaan.

Jos tyhjästä pitäis jotain keksiä niin ettisin jotain avointa dataa ja yhistelisin/esittäisin niitä jotenkin kivasti/kivalla twistillä. Esmes ite meinasin tehä ruuhkavaroittimen/ennustimen pohjantielle.

Toi avoimella datalla leikkiminen onkin käynyt joskus mielessä, joten se voiskin olla mielenkiintoista.

Toinen esimerkki vaikka Geolokaatiota hyödyntävä applikaatio mikä voi esimerkiksi kertoa eri kaupunkien etäisyyksiä.

Tässä voit käyttää tilastokeskuksen avointa dataa ihan staattisena aluksi (lue, kopioimalla vaikka kaupungit koordinaatteineen objektiksi). Tämän jälkeen voit kokeilla muuttaa nämä api-kutsuiksi

Ja tässä vois olla jopa ideaa projektiksi

 

[Saiso]

Vielä sellainen vinkki @Pirssi että kannattaa tehdä ilmainen GitHub student -tunnus ja laittaa kaikki koodisi sinne avoimesti nähtäville. Siinä oppii versionhallintaa ja koodit pysyy järjestyksessä, ja työnantajat osaa yleensä arvostaa, jos on jotain konkreettista näyttöä tekemisistä. Eli työnhakemuksen perään vaan linkki GitHub-profiiliin.

 

[Pirssi]

@Saiso Kiitos! Tosi hyödyllinen vinkki, kun tuo versionhallinta kuitenkin tarvii osata varmaan paikasta riippumatta.

 

[Fanboys Suck]

Lähinnä PHP/JS näkökulmasta:

- javascriptistä kannattaa opetella perus JS ja päälle jquery ja tällä hetkellä React. Angular 2 todennäköisesti "floppaa"
- PHP, Python. Opettele perusasiat ensin, sitten kun projektit kasvaa saatat saada hyötyä frameworkien kuten Laravel/Cake/Symfony käytöstä. Itse olen havainnut että omissa duuneissa frameworkit pikemminkin rajoittaa ja tulee käytettyä lähinnä itse tehtyä koodikokoelmaa luuranko projetin päällä.
- opettele jonkun tietokanta frameworkin käyttö, PHP:n kohdalla PDO, tai sitten jos halut muutakin kuin vain tietokantariippumattoman konnektorin niin joku doctrine.
- opettele jonkun template moottorin käyttö, Smarty, falcon jne. Smarty omasta mielestä paras, mutta esim. twig toimii symfonyn kanssa hyvin.
- css frameworkit tekee nykyisin front end kehityksestä ihan palan kakkua, Bootstrap toimii hyvin ja omaa ison yhteisön (lue stack overflow täynnä vastauksia). Flexbox rullaa myös, miksi sitä ei ollut jo 15 vuotta sitten... Elämän parhaat vuodet meni hukkaan selainten bugeja vastaan taistellessa ja holy graalin etsimisessä.
- git, github, gitlab, svn...
- Firefoxin bookmarkiksi: http://php.net/manual-lookup.php?function=%s ja sitten ko bookmarkin keywordiksi php. Pääset suoraan php:n manuaalissa funktion sivulle esim: php strpos jne.
- asenna firebug/firephp/firequery, huonommille selaimille löytynee vastaavat
- opettele joku editori/ide niin hyvin että osaat vähintään tärkeimmät näppisoikotiet selkäytimestä, suosittelen php/web/jne stormia. Opiskelijalisenssi on maksuton ei kaupalliseen käyttöön
- opettele käyttämään ko. iden debuggeria.
- opettele unit testing, mitä aikaisemmin sitä parempi. Jos koodiasi on hankala testata, tarkoittaa se aika usein että koodi ei ole ihan parasta a-luokkaa
- Hyödynnä composeria ja tee omista koodinpalasistasi myös composer paketteja

 

[Rantakemisti]

Lähinnä PHP/JS näkökulmasta:

- javascriptistä kannattaa opetella perus JS ja päälle jquery ja tällä hetkellä React. Angular 2 todennäköisesti "floppaa"
- PHP, Python. Opettele perusasiat ensin, sitten kun projektit kasvaa saatat saada hyötyä frameworkien kuten Laravel/Cake/Symfony käytöstä. Itse olen havainnut että omissa duuneissa frameworkit pikemminkin rajoittaa ja tulee käytettyä lähinnä itse tehtyä koodikokoelmaa luuranko projetin päällä.
- opettele jonkun tietokanta frameworkin käyttö, PHP:n kohdalla PDO, tai sitten jos halut muutakin kuin vain tietokantariippumattoman konnektorin niin joku doctrine.
- opettele jonkun template moottorin käyttö, Smarty, falcon jne. Smarty omasta mielestä paras, mutta esim. twig toimii symfonyn kanssa hyvin.
- css frameworkit tekee nykyisin front end kehityksestä ihan palan kakkua, Bootstrap toimii hyvin ja omaa ison yhteisön (lue stack overflow täynnä vastauksia). Flexbox rullaa myös, miksi sitä ei ollut jo 15 vuotta sitten... Elämän parhaat vuodet meni hukkaan selainten bugeja vastaan taistellessa ja holy graalin etsimisessä.
- git, github, gitlab, svn...
- Firefoxin bookmarkiksi: http://php.net/manual-lookup.php?function=%s ja sitten ko bookmarkin keywordiksi php. Pääset suoraan php:n manuaalissa funktion sivulle esim: php strpos jne.
- asenna firebug/firephp/firequery, huonommille selaimille löytynee vastaavat
- opettele joku editori/ide niin hyvin että osaat vähintään tärkeimmät näppisoikotiet selkäytimestä, suosittelen php/web/jne stormia. Opiskelijalisenssi on maksuton ei kaupalliseen käyttöön
- opettele käyttämään ko. iden debuggeria.
- opettele unit testing, mitä aikaisemmin sitä parempi. Jos koodiasi on hankala testata, tarkoittaa se aika usein että koodi ei ole ihan parasta a-luokkaa
- Hyödynnä composeria ja tee omista koodinpalasistasi myös composer paketteja

Hyvä näkökulma! Näin pelkästään JS- ja jQuery-osaajana olisi kiva tietää miksi ennustat Angularin floppausta? React ja Angular on ollut opettelulistalla jo pitkää niin ihan sen takia kyselen.

 

[aittis]

Hyvä näkökulma! Näin pelkästään JS- ja jQuery-osaajana olisi kiva tietää miksi ennustat Angularin floppausta? React ja Angular on ollut opettelulistalla jo pitkää niin ihan sen takia kyselen.

Angular on jo ikänsä puolesta päivityksen tarpeessa eikä Angular 2 toistaiseksi ole vastannut suuren yleisön mielestä tarpeeksi tähän tarpeeseen

 

[Fanboys Suck]

Hyvä näkökulma! Näin pelkästään JS- ja jQuery-osaajana olisi kiva tietää miksi ennustat Angularin floppausta? React ja Angular on ollut opettelulistalla jo pitkää niin ihan sen takia kyselen.

Angular 2 huonoja puolia
- se on myöhässä, maalipylväät on siirtyneet (ts. sen tekeminen on kestänyt liian kauan)
- sen käyttäminen on turhan monimutkaista, tai muut onnistuvat tekemään vastaavat asiat helpommin
- google ei itse käytä sitä, tai edes kovasti tuputa sitä kenellekään. Google tuputtaa enemmän esim. polymeriä
- template syntaksi on xx$#&% monimutkaisuudessaan

Mutta Angular ja React ei tosin ole ihan sama asia, Angular hoitaa kaiken, ts. se on framework, ja React taas enemmän ohjelmakirjasto. Mutta joo, päällimmäinen syy siis too little too late. Ja ainahan voi sitten opetella uutta jos näyttääkin siltä että A2 on menestys, nyt vaan saa rahalle enemmän vastinetta muualta.

 

[Katepillar]

Itse olen päässyt viime aikoina työstämään projektia Laravelin kanssa. On kyllä ollut mielenkiintoinen matka kun koko frameworkistä ei ole ollut minkäänlaista kokemusta, mutta tekemällähän sitä parhaiten oppii.

 

[asikainl]

WordPressiin liittyvää kysyttävää:

Onko missään hyvää ohjetta siitä, kuinka step-by-step kannattaa toimia, kun lähtee muuttamaan saitin navigointirakennetta rajusti (koko taxonomiaa)? Saitti pyörii teeman (Impreza) päällä, joka kyllä hoitaa graafisesti muutokset (toivottavasti) ongelmitta, mutta lähinnä edessä massiivista redirectien järjestelyä yms. kun käytännössä koko saitti (www.solutive.fi) on tarkoitus uudelleenjärjestää järkevämmäksi navigoitavuuden, SEO:n ja konversio-optimoinnin takia. Tähän asti pieniä redirectejä hoidellu simple redirects plugarilla, mutta nää isommat kai kannattais viedä serveritasolle vai onko ihan sama näin pieni saitti vielä (noin 30 sivua + 120 postia) vielä uudelleenohjailla wordpressin-tasolla? Lähinnä juuri tästä työvaiheesta joku rautalankaohje / hyvä prosessimalli maistuisi.

Tarkoitus on siis esimerkiksi siirtää kaikki "ajankohtaista" alla olevat postit uuteen 1.tason linkkiin "blogi" tms. koska nyt postaukset sekoittuu kuin ellun kanat tuohon muuhun pages-luokan sisältöön, kun kategorioina postauksissa on samoja ("tableau" ja "alteryx"), jotka ovat saitin pages-navigointisisällössä 1.tason otsakkeina. Tästä seuraa kaikenlaista SEO-sekoilua ja käytettävyysongelmaa, kuten jokainen voi päätellä. Saitilla on muutenkin joitain huonoja rakenteeseen liittyviä ratkaisuja, joita haluaisin selkeyttää; esim. 1.tason navigaatioiden Alteryx ja Tableau sijaan vois olla taso "tuotteet", koska tuotepaletti voi vuosien varrella vaihtua ja toisaalta olis nättiä että olis vierekkäin tuotteet ja palvelut perusnavigointitasolla.

Saitti on muutenkin täysin optimoimaton (SEO- ja konversio-) vielä, koska tulin firmaan vasta sisään ihan hetki sitten. Nyt olisi tarkoitus aloittaa tämä projekti tällä saitin uudelleenstrukturoinnilla, jonka yhteydessä tarkoitus poistellakin jotain vanhentunutta sisältöä yms. hoidella noi uudelleenohjaukset kunnialla, ettei SERP:t kärsi. Sitten sen jälkeen tarkoitus alkaa optimoimaan saittia, eli vanhat sisällöt ensin kuntoon.

Mä EN siis ole täällä töissä web devaajana, mutta sattumoisin työhistoriaa on aihepiirin ympäristöstä sen verran että tää kaatuu mulle. Hoidan koko firman (digi)markkinoinnin suunnittelun, joten webbisivun rakenne liittyy aika olennaisesti siihen.


Kiitti avusta! Jos on jotain kommentteja/vinkkejä yllä mainittuun liittyen muutenkin, niin toki voi kommentoida. Pääpointti olis kuitenkin nyt siinä, että miten hoitaa toi massiivinen uudelleenohjailu ja rakennemuutos mahdollisimman fiksusti.

 

[SweeneyTodd]

Tähän asti pieniä redirectejä hoidellu simple redirects plugarilla, mutta nää isommat kai kannattais viedä serveritasolle vai onko ihan sama näin pieni saitti vielä (noin 30 sivua + 120 postia) vielä uudelleenohjailla wordpressin-tasolla? Lähinnä juuri tästä työvaiheesta joku rautalankaohje / hyvä prosessimalli maistuisi.

Sanoisin, että mod_rewrite olisi järkevin tapa toimia. Sillä saa helposti juuri tuollaiset "vaihda tämä sana toiseksi" -tyyppiset muunnokset hoideltua ihan yhdellä rivillä. Siis olettaen, että ongelma on siinä, että vanhat osoitteetkin pitäisi saada yhä toimimaan.

Muista laitella 301 koodi näille, niin hakukoneet ei tykkää kyttyrää.

 

[asikainl]

Siis nyt käytössä on 301 simple redirects plugari yksittäisille urleille. Mut lähinnä mä hain kokemuksia parhaasta tavasta hoitaa asia, kun lähdetään laajasti muuttamaan osoitteistusta toiseksi rakenteellisesti. Miten prosessi kannattaa tehdä. Tässä on vielä se, että joidenkin urlien kohdalla muutetaan sekä parenttia että slugia. Suurimmalla osalla toki pelkkää parenttia.

 

[Fanboys Suck]

Siis nyt käytössä on 301 simple redirects plugari yksittäisille urleille. Mut lähinnä mä hain kokemuksia parhaasta tavasta hoitaa asia, kun lähdetään laajasti muuttamaan osoitteistusta toiseksi rakenteellisesti. Miten prosessi kannattaa tehdä. Tässä on vielä se, että joidenkin urlien kohdalla muutetaan sekä parenttia että slugia. Suurimmalla osalla toki pelkkää parenttia.

mod_rewrite (serveritasolla) kuten sweeney_todd jo kirjoitti. Jos sivuja vaan kolmekymmentä niin siirrät olemassaolevat postit käsin uuteen rakenteeseen nopeammin kun ehdit väsätä mitään siirtoskriptiä.

Eli tee uusi rakenne, kopsaa sivut sinne, mod_rewritellä tsekkaat että vanhat sivut löytyy ja sitten vaihdat dev-masiinan prod-masiinaksi.

 

[goldenscan]

Tuli tuossa joku aika sitten väsättyä Javascriptillä Yahtzee-peli ensimmäisenä oikeana ohjelmointiprojektina (http://lumous.com/yahtzee/) ja nyt mietin josko tuota koittaisi kehittää vähän eteenpäin. Onko antaa vähän vinkkiä mitä lähden googlettelemaan jos esimerkiksi haluaisin nuo noppaheittojen arvot selaimelta serverille (nyt ne kulkee DOM attribuutteina joten huijaaminen on aika simppeliä tai yksinkertaisen high score -listauksen.

 

[©©©]

Hieno kyllä toi Yatzy-peli! Jos tohon haluaa backendin niin ehkä heitot voisi tulla myös backendiltä json apin kautta ja laittaa tuohon väliin vaikka jQueryn hoitelemaan ajax-kyselyt.

 

[aittis]

Tuli tuossa joku aika sitten väsättyä Javascriptillä Yahtzee-peli ensimmäisenä oikeana ohjelmointiprojektina (http://lumous.com/yahtzee/) ja nyt mietin josko tuota koittaisi kehittää vähän eteenpäin. Onko antaa vähän vinkkiä mitä lähden googlettelemaan jos esimerkiksi haluaisin nuo noppaheittojen arvot selaimelta serverille (nyt ne kulkee DOM attribuutteina joten huijaaminen on aika simppeliä tai yksinkertaisen high score -listauksen.

Hyvältä näyttää, tässä oma versioni, ei ihan loppuun asti hiottu. Tehty täysin vanilla-javascriptillä. Ulkoasussa hyödynnetty hieman Materialize.css
http://yatz.aittis.com/

 

[SweeneyTodd]

Tuli tuossa joku aika sitten väsättyä Javascriptillä Yahtzee-peli

Huomasin minuutin testin aikana pienen bugin. Sain pienen suoran luvuilla 2,3,4,5,5

Hienolta näyttää muuten. Tietokonevastustajaa koodaamaan seuraavaksi?

 

[Zvona]

Tuli tuossa joku aika sitten väsättyä Javascriptillä Yahtzee-peli ensimmäisenä oikeana ohjelmointiprojektina (http://lumous.com/yahtzee/) ja nyt mietin josko tuota koittaisi kehittää vähän eteenpäin. Onko antaa vähän vinkkiä mitä lähden googlettelemaan jos esimerkiksi haluaisin nuo noppaheittojen arvot selaimelta serverille (nyt ne kulkee DOM attribuutteina joten huijaaminen on aika simppeliä tai yksinkertaisen high score -listauksen.

Hieno peli. Mutta tässä riittää pohdittavaa:
- voisi miettiä CSS 3D transitioiden käyttöä nopissa (https://desandro.github.io/3dtransforms/docs/cube.html)
- serveriyhteys voisi olla esim. websocketien päässä, jolloin kommunikointi "käyttäjä heitti noppia" --> "serveri palauttaa arvot" olisi jouhevaa (esim. http://socket.io)
- highscore listauksen voi palauttaa esim. JSONina, joka haetaan `fetch()` APIa käyttäen (vaatii tosin polyfillin osalle selaimista). Tällöin ei tarvita serverikutsuja varten esim. jQuerya.
- jokaisella on mieltymyksensä serveripäästä, mutta itse suosin node.js:ää, joka taipuisi tähänkin tapaukseen todella nopein kääntein.

 

[©©©]

Huomasin minuutin testin aikana pienen bugin. Sain pienen suoran luvuilla 2,3,4,5,5

Tuo neljän nopan pieni suora on sääntömuunnelma ei bugi, näin ainakin luulisin.

 

[Quirzo]

Itse teen omia projekteja tällä hetkellä jQuery, Bootstrap ja PHP:n CodeIgniter -combolla.

Tykästyin CodeIgniter-frameworkkiin koska se on aika minimoitu ja yksinkertainen, ei tarvitse mitään erillisiä asennuksia ja helppo lähteä kehittämään.

Paras editori mitä toistaiseksi olen löytänyt on kyllä ehdottomasti https://atom.io/. Toista vuotta jo käyttänyt ja on kyllä erittäin toimia, Notepad++ sun muut jäi kyllä pölyttymään.

Kiinnostusta olisi opetella Node.js sekä muutenkin tutustua yleisiin tekniikoihin, mistä vaan saisi aikaa..?

Kuva muuten liittyy