Omat nettisivuprojektit (keskeneräiset sekä valmiit)

[Xiyng]

Kertokaas miksi toi lista ei miellytä silmää. Jokin tossa zebrassa on vialla, mutta en osaa sanoa että mikä.

En ole mikään asiantuntija, joten tuolle voisi varmaan tehdä vaikka ja mitä, mutta omaan silmääni tuo harmaa on liian tumma. Lisäksi näyttää vähän oudolle, että nuo valkotaustaiset rivit uppoavat taustaan, joten niillekin voisi olla järkevää pistää jokin väri, esim. erilainen harmaan sävy. Tosin rohkenisin vähän kyseenalaistaa sen, kannattaako koko listalla olla ollenkaan paddingia vai pitäisikö listan mieluummin täyttää koko elementti. Jos paddingin poistaa, valkoinen väri joka toisella rivillä on varmaan ihan OK, mutta silloinkin niiden harmaiden rivien harmaa lienee liian tumma.

 

[null]

Uutis lanka
Keväällä kun rbotti oli vähän heikoissa kantimissa niin tuli pari iltaa harrastettua tälläisen parissa. Ja nyt meinasin taas ehkä aktivoitua.

Bäkkäri toisiaan pyörii tuolla samassa heroku dynossa, joten feedin päivittyminen ottaa reilun minuutiin, jos pannu on ajettu alas.
Ja prokkis ei muutenkaan vielä sisällön/lähteiden puolesta arvosteltavassa kunnossa..

Kertokaas miksi toi lista ei miellytä silmää. Jokin tossa zebrassa on vialla, mutta en osaa sanoa että mikä.

Ehkä fonttikin voisi olla hivenen pienempi, mutta muutoin näyttää hyvältä.

 

[Mjonikaani]

Uutis lanka
Keväällä kun rbotti oli vähän heikoissa kantimissa niin tuli pari iltaa harrastettua tälläisen parissa. Ja nyt meinasin taas ehkä aktivoitua.

Bäkkäri toisiaan pyörii tuolla samassa heroku dynossa, joten feedin päivittyminen ottaa reilun minuutiin, jos pannu on ajettu alas.
Ja prokkis ei muutenkaan vielä sisällön/lähteiden puolesta arvosteltavassa kunnossa..

Kertokaas miksi toi lista ei miellytä silmää. Jokin tossa zebrassa on vialla, mutta en osaa sanoa että mikä.

Sivu mielestäni liian kirkkaan valkoinen. Huvikseni vähän sommittelin ja tulin kuvan mukaiseen lopputulokseen (tuliko liian tylsän harmaa?), ehkä saat jotain ideaa. Muuten sivu näytti toimivan hyvin ja uudet uutiset skrollatessa latautui nopeasti.

 

[Paapaa]

Musta tuo vaihtuva väri ei oikein toimi. Se toimii taulukoissa, mutta tähän laittaisin saman tyylin jokaiselle elementille ja miettisin sen selkeän erottelun muilla keinoin. Tekisin myös koko elementistä klikattavan. Laittaisin lisää paddingiä kellonajan, median ja tägien väliin. Ja tuon valitun kategorian näyttäminen yläpalkissa on aika redundanttia, sillä se näkyy vasemmassa palkissa joka tapauksessa.

 

[nnaku]

Musta tuo vaihtuva väri ei oikein toimi. Se toimii taulukoissa, mutta tähän laittaisin saman tyylin jokaiselle elementille ja miettisin sen selkeän erottelun muilla keinoin. Tekisin myös koko elementistä klikattavan. Laittaisin lisää paddingiä kellonajan, median ja tägien väliin. Ja tuon valitun kategorian näyttäminen yläpalkissa on aika redundanttia, sillä se näkyy vasemmassa palkissa joka tapauksessa.

Nojoo, koko app on mobiilia ajatellen virotetty.. eli toi appbar teksi toimii myös sivupalkin ulkopuolisissa kategorioissa ja kun draweri on piilotettu.

Spoileri: Kuva

Mutta pitää varmaa seuraavaksi kehitellä joku listitem komponetti ja unohtaa toi seepra kokonaan.

 

[Groomlake]

Uutis lanka

Hyvältä näyttää. pst.. 'Uutislanka'

 

[Mjonikaani]

Ilokseni huomasin, ettei ole suomenkielistä sivustoa, missä pystyisi näppärästi vertailemaan eri kissa- sekä koiraruokien ravintoarvoja. Joten päätin lisätä tälläisen mahdollisuuden aiemmin mainitsemalleni sivulle. Tällä hetkellä pystyy tosin vain kissanruokia vertailemaan, mutta tarkoitukseni on tehdä sama homma myös koirille.

Onko käytössä tai sivun leiskassa jotain häiritsevää?

Kyseinen sivu löytyy tästä: kissanruoka vertailu.

 

[mxb]

Julkaisin lemmikkimme.fi sivun noin 2 kuukautta sitten. Sivun tarkoitus on tutustuttaa käyttäjä eri kissa- sekä koirarotujen kasvattajiin sekä omistajiin. Pyrin tekemään sivun niin, että rodun valittua näkee muutamalla klikkauksella rodusta lisätyt kuvat, myynti-ilmoitukset sekä kasvattajat.

Viime aikoina olen tehnyt aika paljon hakukoneoptimointia ja toivonkin, että nämä muutokset toisivat lisää käyttäjiä sivulle. Moni sivulla vierailija käy katsomassa tietyn rodun kasvattajat sekä myynti-ilmoitukset ja huomattuaan ettei niitä ole, niin lähtevät samantien pois.

Palautetta olen saanut hyvin vähän, eli jos käytte testaamassa ja koette käytön hankalaksi, niin siitä olisi kiva tietää.

Näin pikavilkaisulla näytti hyvältä, ainakin kännykällä, mutta etusivulla kuvien päällä oleva fontti on epäselvä. Tai ainakaan itse en meinaa saada selvää siitä ollenkaan. Kahden alimmaisen kuvan päällä oleva teksti jäi täysin mysteeriksi.

Edit: ei kaksi alinta vaan kaksi seuraavaa kissojen ja koirien jälkeen. Lisäksi kysyisin, että millä tää on tehty ja onko nähtävissä esim. githubissa?

 

[Mjonikaani]

Näin pikavilkaisulla näytti hyvältä, ainakin kännykällä, mutta etusivulla kuvien päällä oleva fontti on epäselvä. Tai ainakaan itse en meinaa saada selvää siitä ollenkaan. Kahden alimmaisen kuvan päällä oleva teksti jäi täysin mysteeriksi.

Edit: ei kaksi alinta vaan kaksi seuraavaa kissojen ja koirien jälkeen. Lisäksi kysyisin, että millä tää on tehty ja onko nähtävissä esim. githubissa?

Olen tämän pohjalla käyttänyt Wes Bossin tutoriaalissa käyttämiä tekniikoita kuten React, apollo, graphql yoga sekä prisma. Nuo ruokavertailujen kaaviot on tehty käyttäen chart.js kirjastoa, sekä mobiilin sivupalkki on tehty react-sidebar:lla. Alasvetovalikot react-selectillä. Tyylien kirjoittamiseen käytin Styled Componenttia ja sivun layout pääosin css gridillä.

Niin ja koirien ruokavertailu nyt myös lisätty

 

[Zvona]

Sivusto: Blackjack Coach

Stack: Vanilla HTML+CSS (ja ei JS:ää), Node/Express ja view enginena PUG. Artikkelisisältö on tällä hetkellä JSON-filuina, mutta vien Mongoon tms. dokumenttikantaan, kunhan saan ensin artikkelisisällön tuotettua.

Aloitin puoli vuotta (!) sitten väsäämään harrastesivustoa blackjackin ympärille, johon kirjoitan pääosin strategia- ja psykologia-aiheisia artikkeleita. Innostus heräsi sivuston osalta uudelleen tässä loman aikana. Nyt siellä on neljä placeholder-artikkelia vailla kunnollista sisältöä.

Tässä vaiheessa kyselen (kyselinkin jo Muron puolella aiemmin), että minkälaisia visuaalisia sekä teknisiä muutoksia techiläisillä tulee mieleen. Eli mikä on ensivaikutelma, ja mitä asioita pitäisi korjailla, jotta käyttökokemus sekä selkeys olisi parempi.

Mainittakoon tässä vaiheessa, että pääpaino on itse artikkeleissa - ei niinkään tervetulotekstissä, joka sijaitsee pääsivun alimpana. Eli sitä en aio nostaa ensisijaiseksi elementiksi ainakaan vielä.

 

[ississ]

Sivusto: Blackjack Coach

Eli mikä on ensivaikutelma, ja mitä asioita pitäisi korjailla, jotta käyttökokemus sekä selkeys olisi parempi.

Pikaisesti puhelimella testattuna "articles"- listalla voisi olla sinisempi tausta.
Muissa on sininen pohja ja artikkelit valkoisella pohjalla. Parempi ehkä lukea musta-valko kuin valko-sini mutta tyylillisesti erilainen kuin muut...

 

[mxb]

Julkaisin reilu viikko sitten uuden version tästä. Vue vaihtui Angulariin. Samalla korjasin paljon bugeja ja lisäsin uusia ominaisuuksia. Edelleen sivua voi käyttää rekisteröitymättä, mutta rekisteröitymällä on käytössä enemmän ominaisuuksia.

Tämän vuoden puolella päivitelty taas runsaasti. Bäkkäri vaihtui Node/Express/Mongo yhdistelmästä C# & ASP.NET Coreen ja PostgreSQL:ään. Ulkoasua on paranneltu ja sivua voi myös käyttää englanniksi, mutta ruoat toki on suomeksi. Suosio kasvaa tasaisesti ja kohta menee 400 rekisteröityneen käyttäjän raja rikki.

Linkki Makroon.

Edit: Kyseessä siis ilmainen kalorilaskuri/ateriasuunnitelija

 

[Mjonikaani]

Sivusto: Blackjack Coach
Eli mikä on ensivaikutelma, ja mitä asioita pitäisi korjailla, jotta käyttökokemus sekä selkeys olisi parempi.

Pidän tuosta sinisestä teemasta, selkeän oloinen sivu.
Jos tekisin mobiilinäkymään jotain korjauksia niin (kohdat merkitty kuvaan):
1. Navigointi on ihan reunassa kiinni, jos vähän väliä niin voisi olla selkeämpi. Tai jos haluaa jättää tuohon reunaan kiinni, niin oikeasta reunasta pyöristykset pois.
2. Mobiilissa näyttää siltä, että sukunimi jäisi ruudun alle piiloon, ehkä vähän väliä oikeaan reunaan.
3. Tuo palkki kategorioiden alla ei ole täysin tasan, vaan on muutaman pikselin enemmän vasemmalla.

 

[null]

Ei ehkä sovi ihan otsikon alle, mutta anyway tuollaista sää sovellus projektia on tullut tovi pyöriteltyä.
Tuo on varmaankin jo 3. versio joka on kirjoitettu uudelleen ja aina on jotain opittu.

Vähän on ollut säätämistä tuon UI värimaailman suhteen, joka sekin on muuttunut useaan otteeseen.
Ei se nyt ihan vieläkään ole siellä missä pitäisi.
Mielestäni toimii ehkä paremmin mobiilissa kuin työpöydällä.

Ihan perus vanilla JavaScript + node.js / express rakennelma.

Weather in..

 

[Paapaa]

Tässä vaiheessa kyselen (kyselinkin jo Muron puolella aiemmin), että minkälaisia visuaalisia sekä teknisiä muutoksia techiläisillä tulee mieleen

Mä ehkä miettisin noiden tagien sijaintia työpöytä- ja padikoossa. Nyt ne leijuvat vähän ei missään tekstin pituudesta riippuen. Toimisiko paremmin alareunaan keskitettynä, tai heti kuvan alla?

Pystyviiva kortin tekstin vasemmalla puolella on musta kiva tehokeino, mutta noiden tägien alla se näyttää jotenkin tarpeettomalta.

Articles-näkymässä kuvien kuvasuhteet eivät pysy vakioina ja kuvat litistyvät. Jos vaikka laittaisit kuvat divien taustakuviksi ja siihen sitten vaikka "background-size: cover;" sopivalla keskityksellä.

Toi menun scale-transitio ei ehkä ole ihan paras mahdollinen valinta varsinkaan lineaarisena. Jotenki kökkö ja tårta på tårta kun se taustaväri jo muuttuu. Joku ease voisi tehdä siitä luonnollisemman. Ehkä pienemmällä maksimiskaalauksella. Ja jotain outoa tapahtuu esim. A-kirjaimen palkille skaalauksen päissä. Se pompsahtaa oudosti.

Väripaletti on sinänsä kiva, mä ehkä miettisin, jos isoja kontrasteja saisi vähän blendattua. Nyt on paljon valkoista ja mustaa. Jos lähtisin puhtaalta pöydältä, yrittäisin saada sellaisen kasinomaisen tummuuden ja ton kunkkukortin värejä vähän enemmän mukaan (valko, kelta, puna) kielimään korttipelistä.

 

[apek]

Ei ehkä sovi ihan otsikon alle, mutta anyway tuollaista sää sovellus projektia on tullut tovi pyöriteltyä.
Tuo on varmaankin jo 3. versio joka on kirjoitettu uudelleen ja aina on jotain opittu.

Vähän on ollut säätämistä tuon UI värimaailman suhteen, joka sekin on muuttunut useaan otteeseen.
Ei se nyt ihan vieläkään ole siellä missä pitäisi.
Mielestäni toimii ehkä paremmin mobiilissa kuin työpöydällä.

Ihan perus vanilla JavaScript + node.js / express rakennelma.

Weather in..

Ei toimi ollenkaan jos ei salli sijainnin jakoa. Eli ei jatkoon tälläiset projektit.

 

[Zvona]

Kiitokset kaikille kommenteista koskien Blackjack Coach :ia. En lähde yksilöllisesti vastailemaan viesteihin, mutta tein tarvittavat korjaukset - eli oikeastaan kaikkien ehdotusten mukaan, sillä ne olivat aidosti hyviä ja hyödyllisiä.

Kokeilin myös eri väriteemoja, mutta aion pysytellä nykyisessä ainakin tovin.

 

[null]

Ei toimi ollenkaan jos ei salli sijainnin jakoa. Eli ei jatkoon tälläiset projektit.

Toi oli itseasiassa hyvä huomio. En oo tuota edes miettinyt sen kummemmin. Ehkä lisään tuohon haun, jos käyttäjä ei hyväksy sijainnin jakoa.

 

[null]

Ei toimi ollenkaan jos ei salli sijainnin jakoa. Eli ei jatkoon tälläiset projektit.

Kaikesta huolimatta, jatkan projektia.

 

[apek]

Hieno kommentti.

No jos sivu ei toimi ollenkaan, niin mitä muuta siihen voi kommentoida?

No nyt siellä sentään näkyy jotain. Tosin Mäntsälän sää, joten aika laiha lohtu.

 

[null]

No jos sivu ei toimi ollenkaan, niin mitä muuta siihen voi kommentoida?

No nyt siellä sentään näkyy jotain. Tosin Mäntsälän sää, joten aika laiha lohtu.

Rakentava kritiikki on tervetullutta.

 

[Tinke-80]

Morjens, toimin Kamraatit Ry:ssä kotisivuista vastaavana ja olisin kiitollinen palautteesta koskien www-sivujamme: Kamraatit Ry

 

[apek]

Morjens, toimin Kamraatit Ry:ssä kotisivuista vastaavana ja olisin kiitollinen palautteesta koskien www-sivujamme: Kamraatit Ry

Tietyillä leveydeillä menun alasvetovalikko menee piiloon. Se kannattaisi laittaa avautumaan vasempaan päin jos ei mahdu oikealle.

Muuten kyllä vaikuttaisi pikaisella vilkaisulla ihan toimivalta ja responsiivisuus toimii.

 

[Mjonikaani]

Morjens, toimin Kamraatit Ry:ssä kotisivuista vastaavana ja olisin kiitollinen palautteesta koskien www-sivujamme: Kamraatit Ry

Etusivulla näyttäisi olevan tietokoneella käyttäessa aika paljon tyhjää tilaa instagram osion vieressä. Lisäksi alapalkki näyttää hieman tyhjälle, pitäisikö vasempaan alareunaan pistää vaikka linkki yhteistietoihin tai johonkin muuhun sivulle.

Tuo taustalla oleva kuva sekä kuva jossa kamraatit-logo ovat kooltaan melko suuria (yhteensä yli 1.5 megaa), saisiko kuvat pienemmiksi jotta sivu latautuisi hieman nopeammin?

Olisiko parempi siirtää etusivun "Uutiset - Liity Kamraatit Ryn kannatusjäseneksi!" vasta esittelytekstin jälkeen?

 

[Nigel]

Heitetäänpäs tänne jännityksellä oma eka isompi fullstack-projekti näytille. Sivu on vielä kesken.

Homma lähti liikelle, koska halusin itselleni palvelun, jonka avulla voi helposti seurata NHL-pelaajien suorituksia. Näytän sivulla viimeisen 1 pelin, viimeisten 5 pelin ja viimeisten 10 pelin perusteella tämän hetken parhaat pelaajat. Lisäksi kirjautuneilla käyttäjillä on mahdollisuus lisätä suosikkeihin pelaajia, jolloin suosikit-sivulta näkyy heitän suorituksensa samojen pelimäärien perusteella. Itse änärifanina tykkään seurata enemmän yksittäisiä pelaajia kuin joukkueita.

Projektin edessä keksin palvelulle toisenkin tärkeän ominaisuuden. Maalivideot. Kuinkahan monta kertaa olen koittanut etsiä Youtubesta tai Googlettamalla jotain tiettyä maalia, mutta en ole sitä vain löytänyt. Lähdin ratkomaan ongelmaa ja sain toteutettua jokaiselle pelaajalle oman profiilisivun, jolta näkee pelaajien suoritukset peli-peliltä. Jokaiseen peliin, jossa pelaaja on tehnyt yhden tai enemmän maaleja, on liitetty maalivideot. Kun avaa pelaajan profiilisivun, niin sivun alaosassa näkyy automaattisesti viiden viimeisen pelin maalit, jos niitä on. Klikkaamalla taulukosta jotain tiettyä peliä, haetaan siihen peliin liittyvät maalivideot.

Tällä hetkellä olen vääntänyt tätä projektia reilusti yli 200 tuntia tässä kesän aikana. Aloitin tämän projektin Fullstack Open -kurssin harjoitustyönä, jossa 8 opinto-pisteeseen vaaditaan 200h työtä. Opintopisteet tuosta siis kyllä saan, mutta olisi tarkoitus tehdä tuo ihan valmiiksi asti ja viedä tuotantoon. Työtä on vielä paljon ja tarkoitus olisi saada suhteellisen valmis paketti kasaan ennen kauden alkua.

Tässä linkki: Player Follower (tylsä nimi, mutta en ole vielä keksinyt parempaa)

Eli sivu on siis vielä pahasti kesken. Lähes valmiit sivut on "Players" ja "Favorites" (näkyy kun kirjautuu sisään) ja pelaajaprofiilit. Pelaajaprofiileihin pääsee klikkaamalla pelaajakorttien pelaajanimiä. Haku palkki ei vielä toimi, mutta /find-players polusta löytyy hakuominaisuudet, jos joku haluaa koittaa pelaajien etsintää. Find-players toimii vain kirjautuneille käyttäjille.

Palvelua voi testata seuraavilla kredentiaaleilla:

• Username: iotech
• PW: salasana

Tällä hetkellä mulla on tuolla tietokannassa viime tammi-helmikuun dataa. Lopulliseen versioon luonnollisesti datan tulee päivittyä joka päivä, kun pelit on pelattu.

Pistäkäähän kommentteja ja parannusehdotuksia. Olen aika käpy CSS:n kanssa ja eka versio sivusta olikin jo valmiina semantic-ui:lla tehtynä. Heitin sen kuitenkin romukoppaan ja tein tyylittelyt itse käytännössä nollapohjalta. Ei mikään helppo homma. Älkää siis välittäkö kirjautumisista, rekisteröitymisistä, sarjataulukoista ja pistepörssistä, koska ne on viimeistelemättä.

 

[mxb]

Heitetäänpäs tänne jännityksellä oma eka isompi fullstack-projekti näytille. Sivu on vielä kesken.

Homma lähti liikelle, koska halusin itselleni palvelun, jonka avulla voi helposti seurata NHL-pelaajien suorituksia. Näytän sivulla viimeisen 1 pelin, viimeisten 5 pelin ja viimeisten 10 pelin perusteella tämän hetken parhaat pelaajat. Lisäksi kirjautuneilla käyttäjillä on mahdollisuus lisätä suosikkeihin pelaajia, jolloin suosikit-sivulta näkyy heitän suorituksensa samojen pelimäärien perusteella. Itse änärifanina tykkään seurata enemmän yksittäisiä pelaajia kuin joukkueita.

Projektin edessä keksin palvelulle toisenkin tärkeän ominaisuuden. Maalivideot. Kuinkahan monta kertaa olen koittanut etsiä Youtubesta tai Googlettamalla jotain tiettyä maalia, mutta en ole sitä vain löytänyt. Lähdin ratkomaan ongelmaa ja sain toteutettua jokaiselle pelaajalle oman profiilisivun, jolta näkee pelaajien suoritukset peli-peliltä. Jokaiseen peliin, jossa pelaaja on tehnyt yhden tai enemmän maaleja, on liitetty maalivideot. Kun avaa pelaajan profiilisivun, niin sivun alaosassa näkyy automaattisesti viiden viimeisen pelin maalit, jos niitä on. Klikkaamalla taulukosta jotain tiettyä peliä, haetaan siihen peliin liittyvät maalivideot.

Tällä hetkellä olen vääntänyt tätä projektia reilusti yli 200 tuntia tässä kesän aikana. Aloitin tämän projektin Fullstack Open -kurssin harjoitustyönä, jossa 8 opinto-pisteeseen vaaditaan 200h työtä. Opintopisteet tuosta siis kyllä saan, mutta olisi tarkoitus tehdä tuo ihan valmiiksi asti ja viedä tuotantoon. Työtä on vielä paljon ja tarkoitus olisi saada suhteellisen valmis paketti kasaan ennen kauden alkua.

Tässä linkki: Player Follower (tylsä nimi, mutta en ole vielä keksinyt parempaa)

Eli sivu on siis vielä pahasti kesken. Lähes valmiit sivut on "Players" ja "Favorites" (näkyy kun kirjautuu sisään) ja pelaajaprofiilit. Pelaajaprofiileihin pääsee klikkaamalla pelaajakorttien pelaajanimiä. Haku palkki ei vielä toimi, mutta /find-players polusta löytyy hakuominaisuudet, jos joku haluaa koittaa pelaajien etsintää. Find-players toimii vain kirjautuneille käyttäjille.

Palvelua voi testata seuraavilla kredentiaaleilla:

• Username: iotech
• PW: salasana

Tällä hetkellä mulla on tuolla tietokannassa viime tammi-helmikuun dataa. Lopulliseen versioon luonnollisesti datan tulee päivittyä joka päivä, kun pelit on pelattu.

Pistäkäähän kommentteja ja parannusehdotuksia. Olen aika käpy CSS:n kanssa ja eka versio sivusta olikin jo valmiina semantic-ui:lla tehtynä. Heitin sen kuitenkin romukoppaan ja tein tyylittelyt itse käytännössä nollapohjalta. Ei mikään helppo homma. Älkää siis välittäkö kirjautumisista, rekisteröitymisistä, sarjataulukoista ja pistepörssistä, koska ne on viimeistelemättä.

Sivu, jota en tiennyt "tarvitsevani". Näyttää hyvältä enkä mitään sen suurempaa vikaa kyllä löytänyt. Ainoa, mikä näin nopeasti tuli vastaan, oli pelaajakortin flip-kohta, jonka päällä hiiren kursori ei muuttunut pointteriksi.

Millä stackilla tehty ja onko github-linkkiä?

 

[Tinke-80]

@Nigel Jatkoajassa olisi varmasti paljon innokkaita testaajia? Toki kannattaa kysyä ensin lupa kyseinen sivun modeilta silltä kyseinen saitti on surullisen kuuluisa tiukasta moderoinnistaan.

Myös tilastosivu kaipaisi vähän selkeyttä. Ota vaikka esimerkkiä nhlfinns-sivustolta: https://nhlfinns.net/nhl/seasons/2019/regular

 

[Nigel]

Kiitos kaikille palautteesta.

Tyylin suhteen players-sivun korteissa ehkä laittaisin visuaalisen skannauksen fasilitointiin vähän de-emphasista labeleille (G, A, P, jne.) suhteessa niiden arvoihin, ja välttämättä ei edes tarvitse erottaa niitä label/value-pareiksi vaan esim. jotain tyyliin G/A/P ja 1/2/3, tai sitten sama kuin nyt eli pareina mutta vertikaalisesti, jolloin silmän ei tarvitse hyppiä kirjainten yli arvoja lukiessa. En kyllä tiedä, miten statsit yleensä esitetään. Ehkä myös nostaisin statseista jonkun tärkeimmän isommaksi elementiksi.

Koitin nostaa tärkeimmät statsit, eli maalit syötöt ja pisteet paremmin esille laittamalla ne ylemmälle riville ja koska statsit on kahdessa rivissä, niin en haluaisi laittaa pareja vertikaalisti. Ymmärrän kyllä pointtisi luettavuuden kannalta. Täytyy katsoa jos tuohon keksii jonkun paremman ratkaisun.

Sivu, jota en tiennyt "tarvitsevani". Näyttää hyvältä enkä mitään sen suurempaa vikaa kyllä löytänyt. Ainoa, mikä näin nopeasti tuli vastaan, oli pelaajakortin flip-kohta, jonka päällä hiiren kursori ei muuttunut pointteriksi.

Millä stackilla tehty ja onko github-linkkiä?

Kun sain maalivideot ensimmäistä kertaa toimimaan, niin meni varmaan tunti noita videoita katsellessa.

Backendinä on Node, Apollo Server (GraphQL), MongoDB ja frontendinä React. Redux ei ole käytössä. Teen tilanhallinnan Context APIn ja Apollon avulla.

@Nigel Jatkoajassa olisi varmasti paljon innokkaita testaajia? Toki kannattaa kysyä ensin lupa kyseinen sivun modeilta silltä kyseinen saitti on surullisen kuuluisa tiukasta moderoinnistaan.

Myös tilastosivu kaipaisi vähän selkeyttä. Ota vaikka esimerkkiä nhlfinns-sivustolta: https://nhlfinns.net/nhl/seasons/2019/regular

Kiitos vinkistä. Kunhan saan loputkin sivut suurinpiirtein valmiiksi, niin täytyy kysellä palautetta laajemminkin.

Tarkoitatko tilastosivulla Stats-sivua vai pelaajaprofiilin taulukkoa? Nuo taulukot on tosin tällä hetkellä samanlaiset, joten jos yksi on epäselvä niin on toinenkin. Mikä mielestäsi on tekee taulukosta epäselvän? Reunaviivat, kontrasti, fonttikoko?

Mistäs tuota dataa saat?

Kaikki numerodata ja videot tulee NHL:n ilmaisesta rajapinnasta. Kuvat tulee toisesta avoimesta rajapinnasta ja en itseasiassa ole ihan varma, että saanko käyttää noita kuvia sivullani. Jos en saa, niin täytyy keksiä jotain muuta.

 

[Tinke-80]

@Nigel eli jos NHLfinns sivun Seasons kohdassa laitat statsit sortaamaan (sorry, oikeaa sanaa tälle en nyt keksi) vaikka vetojen perusteella niin tämä sarake korostuu eri värillä. Sinun Stats sivu ei kerro minkä sarakkeen perusteella sorttaus tapahtuu. Ja sinun Stats sivun Load more painikkeen teksti ei näy (valkoinen valkoisella pohjalla). Mutta hieno projekti sinulla! 5/5

 

[Nigel]

Yksi radikaalimpi ratkaisu voisi olla nostaa kokonaispisteet omaksi erittäin näkyväksi elementiksi johonkin, jolloin muut relevantit statsit saattaa mahtua kaikki samalle riville vähän alemmas. Listan katselua aloittaessa ehkä välittömästi ensimmäinen kysymys oli, minkä asian mukaan lista on järjestetty - ja pisteet muistaakseni oli se asia.

Jos lisää ominaisuuden sortata korttilista muidenkin kuin kokonaispisteiden (tms.) mukaan, niin joku tuollainen 'tärkein arvo' voisi toimia. Siihen voisi heittää sortatun attribuutin ja muut generoituisi sivummas riville. Ei välttämättä toimisi, mutta se on yksi mahdollisuus.

Joo, kortit on nyt järjestetty pisteiden mukaan. Tällä hetkellä en pysty sorttaamaan niitä mitenkään muuten. Tai pystyisin sorttaamaan näkyvät kortit eri järjestykseen, mutta listaus menettäisi pointtinsa.

Jokaisessa pelimääränäkymässä on 15 parasta pelaajaa pisteiden perusteella. Nuo 15 parasta on filtteröidään 800 pelaajan seasta. Olen tallentanut laskennan tulokset tietokantaan ja tuon laskennan tuloksen näytän sivulla. En tällä hetkellä osaa tehdä tuota paremmin aiheuttamatta jäätäviä latausaikoja sivulle.

Tein vastikään vähän samanhenkisen palvelun, jossa kuvat tulivat muualta. Niiden käytöstä tiedustellessa vastaus oli kieltävä. Piti vääntää apusoftat, joilla puolimanuaalisesti harvestoi 500 thumbnailia Wikimedian kokokuvista. Puuduttavaa touhua, joten kannattaa panostaa luvan saamiseen.

Mulla ei taida olla mitään muita vaihtoehtoja kuin toivoa, että saan käyttää noita kuvia. En heti keksi mistä muualta löytäisin jokaisen pelaajan naamakuvan helposti jostain.

 

[Nigel]

Pistin uuden päivityksen sisään. Nyt myös stats- ja standings-sivujen pitäisi olla kunnossa.

 

[Mjonikaani]

Backendinä on Node, Apollo Server (GraphQL), MongoDB ja frontendinä React.

Ei näyttäisi IE:llä toimivan, tosin ei toimi tuo omakaan sivuni Todennäköisesti ongelma tuossa Apollo Serverissä. Jos jaksat selvittää kuinka tuon saisi "korjattua" niin pistähän viesitä. Oletin myös että flip-painikkeesta olisi kortti pyörähtänyt ympäri.

Oman projektin ruokavertailu on valmis. Harmittaa että tuli käytettyä chart.js kirjastoa noihin kaavioihin. Sen vuoksi kaaviot ovat canvas-elementtejä, joita ei oikein pysty hakukoneoptimoida samaan tyyliin kuin svg:tä. Ei tullut tätä seikkaa otettua huomioon kun aloin tuota tekemään. Olisi pitänyt sittenkin käyttää d3js-kirjastoa.

Mitäköhän sitä seuraavaksi tekisi?

 

[Nigel]

Ei näyttäisi IE:llä toimivan, tosin ei toimi tuo omakaan sivuni Todennäköisesti ongelma tuossa Apollo Serverissä. Jos jaksat selvittää kuinka tuon saisi "korjattua" niin pistähän viesitä. Oletin myös että flip-painikkeesta olisi kortti pyörähtänyt ympäri.

Oman projektin ruokavertailu on valmis. Harmittaa että tuli käytettyä chart.js kirjastoa noihin kaavioihin. Sen vuoksi kaaviot ovat canvas-elementtejä, joita ei oikein pysty hakukoneoptimoida samaan tyyliin kuin svg:tä. Ei tullut tätä seikkaa otettua huomioon kun aloin tuota tekemään. Olisi pitänyt sittenkin käyttää d3js-kirjastoa.

Mitäköhän sitä seuraavaksi tekisi?

Joo, korttien oli tarkoitus pyörähtää ympäri, mutta jäi lopulta tekemättä se animaatio. Täytyy jossain vaiheessa katsella siihen joku ratkaisu. Mitä tulee IE:hen, niin en sitä aio kyllä tukeakaan. Voisi ehkä tehdä jonkun info-sivun, jossa kehotetaan asentamaan kunnon selain.

Tuo sun linkki menee localhostiin.

 

[living_death]

Jotain tän tyylistä rakentelua toimeksiantona pieneltä aloittelevalta yritykseltä kahdessa päivässä.

Yksi asia joka ottaa aina pannuun on se, että ei ole valmiiksi mitään tekstejä, tyyliä tai muuta vaan sanotaan että annan sinulle vapaat kädet.

Sivut olisivat teknisesti Seo optimointeja yms. valmiina WAMP serverissä, mutta odotellaan...

Noi tekstit mitä nyt näkyy on vaan omaa hahmotelmaa vaikka en tiedä rakennusalasta mitään

Kuvan alla piilossa rullaa karusellissa tuotekuvia.

Wordpress ja teemana Angle.

 

[Nigel]

No niin. Heitin taas uuden päivityksen Herokuun.

Tein pelaajakorteille flip-animaation, joka toivottavasti toimii suurimmalla osalla käyttäjistä. Jostain syystä en saa sitä mitenkään toimimaan oikein Safarilla (ainakaan iOS). Ilmeisesti backface-visibility-property ei toimi Safarilla samalla tavalla. Toimimattomuus ilmenee siten, että kun animaatio loppuu, niin kortin takapuoli häviää näkyviltä.

Hakupalkki on nyt kunnossa. Toimii haku niin joukkueille kuin pelaajille. Mobiilissa tai muuten vaan pienessä ikkunnassa on mahdollisuus käyttää hakua /search-sivulta.

Lisäsin jokaiselle tiimille oman sivun. Tiimikohtaiselta sivulta näkyy kyseisen tiimin kokoonpano statsien kanssa. Pelaajien nimet ovat linkkejä, joten sitä kautta pääsee nopeasti tarkastelemaan pelaajien profiileja. Täytyy katsoa, jos tiimisivulle saisi vaikka joukkueen viimeisten 10 maalin videot näkyville. En ole ihan varma tämän ominaisuuden hyödyllisyydestä kyllä. Yksi ilmiselvä asia olisi toki pelikoosteet, mutta noita pelikoostesivuja löytyy jo paljon, joten en välttämättä halua laittaa pelikoosteita ollenkaan. Keskityn ennemmin ominaisuuksiin, joita muilta sivuilta ei ole helposti saatavilla.

Nyt myös stats- ja standings-sivut on valmiit.

Seuraavat stepit on varmaan hioa lomakkeet kuntoon. Rekisteröintiprosessi toimii jo muuten, mutta mulla ei ole vielä käytössä mitään palvelua, jonka kautta saisi vahvistusmeilit lähetettyä. Mikähän tähän olisi paras (ilmainen) ratkaisu?

Tässä vielä linkki sivulle.

Missä muuten lopullinen tuotantoversio kannattaisi hostata? Nyt käytän tuota Herokun ilmaisversiota, koska sitä käytettiin myös FullStack Open -kurssilla.

 

[Pökötti]

Ios Safarilla ei tosiaan oikein toimi flippaus. Kannattaa tutkia, voisiko tuon toteuttaa niin että flippaus olisi käytössä vain sellaisilla selaimilla joilla se toimii.

Progressive enhancement - Wikipedia

 

[mxb]

No niin. Heitin taas uuden päivityksen Herokuun.

Tein pelaajakorteille flip-animaation, joka toivottavasti toimii suurimmalla osalla käyttäjistä. Jostain syystä en saa sitä mitenkään toimimaan oikein Safarilla (ainakaan iOS). Ilmeisesti backface-visibility-property ei toimi Safarilla samalla tavalla. Toimimattomuus ilmenee siten, että kun animaatio loppuu, niin kortin takapuoli häviää näkyviltä.

Hakupalkki on nyt kunnossa. Toimii haku niin joukkueille kuin pelaajille. Mobiilissa tai muuten vaan pienessä ikkunnassa on mahdollisuus käyttää hakua /search-sivulta.

Lisäsin jokaiselle tiimille oman sivun. Tiimikohtaiselta sivulta näkyy kyseisen tiimin kokoonpano statsien kanssa. Pelaajien nimet ovat linkkejä, joten sitä kautta pääsee nopeasti tarkastelemaan pelaajien profiileja. Täytyy katsoa, jos tiimisivulle saisi vaikka joukkueen viimeisten 10 maalin videot näkyville. En ole ihan varma tämän ominaisuuden hyödyllisyydestä kyllä. Yksi ilmiselvä asia olisi toki pelikoosteet, mutta noita pelikoostesivuja löytyy jo paljon, joten en välttämättä halua laittaa pelikoosteita ollenkaan. Keskityn ennemmin ominaisuuksiin, joita muilta sivuilta ei ole helposti saatavilla.

Nyt myös stats- ja standings-sivut on valmiit.

Seuraavat stepit on varmaan hioa lomakkeet kuntoon. Rekisteröintiprosessi toimii jo muuten, mutta mulla ei ole vielä käytössä mitään palvelua, jonka kautta saisi vahvistusmeilit lähetettyä. Mikähän tähän olisi paras (ilmainen) ratkaisu?

Tässä vielä linkki sivulle.

Missä muuten lopullinen tuotantoversio kannattaisi hostata? Nyt käytän tuota Herokun ilmaisversiota, koska sitä käytettiin myös FullStack Open -kurssilla.

Itse olen käyttänyt Digital Oceania pari vuotta ja on toiminut moitteettomasti. Halvin droplet (1gb RAM, vcpu, 25gb SSD, 1000gb outbound transfer) riittää yllättävän pitkälle eikä maksa kuin vitosen kuussa. Ei siis ilmainen, mutta melko halpa kuitenkin.

 

[kreivi_krapula]

Tein pelaajakorteille flip-animaation, joka toivottavasti toimii suurimmalla osalla käyttäjistä. Jostain syystä en saa sitä mitenkään toimimaan oikein Safarilla (ainakaan iOS). Ilmeisesti backface-visibility-property ei toimi Safarilla samalla tavalla. Toimimattomuus ilmenee siten, että kun animaatio loppuu, niin kortin takapuoli häviää näkyviltä.

Chromella teki mulla samanlailla, pelaajakortti pyörähtää ja animaation päättyessä katoaa takapuolen sisältö näkyvistä. Nimeä pystyy kuitenkin klikkaamaan tuosta jos tietää missä kohti se siellä on näkymättömänä ja se ohjaa ko. pelaajan sivulle.

Hakupalkki on nyt kunnossa. Toimii haku niin joukkueille kuin pelaajille. Mobiilissa tai muuten vaan pienessä ikkunnassa on mahdollisuus käyttää hakua /search-sivulta.

Semmoinen huomio hakuun, että hakukoneisiin tottuneena käyttäjänä tuntuu vähän oudolta ettei "Enter" painallus tee mitään. Ehkä tuohon ohjaus hakutulokset sivulle (missä siis listaisi löydetyt pelaajat/joukkueet) tai jos tuloksia on vain yksi (esim. Mikko Koivu) ohjais suoraan ko. pelaajan/tiimin sivulle. Ei toki mikään bugi, lähinnä käytettävyysjuttu ja mielipiteeseen pohjautuva sellainen kaiken lisäksi.

Nyt myös stats- ja standings-sivut on valmiit.

Statsisivulla näkyy yksittäisiä pelaajia kahtena rivinä (esim. Nikita Kucherov) on pistepörssin sijoilla 1. ja 2. Kliksuttelemalla sorttauksia muun kuin pistemäärän mukaan rikkoo taulukon (ainakin G, A, +/-, GP). Sortatun sarakkeen väri voisi ehkä myös olla eri väri kuin taulukon otsikkosolujen väri.

Semmoinen visuaalinen juttu myös taulukoihin yleisesti liittyen, että joka toisen rivin vois sävyttää eri värillä niin ei silmä eksy niin helposti kun tsekkaa riviä. Myös mouseover rivin päällä vois vielä muuttaa väriä niin saa silläkin tehostettua tuota.

Seuraavat stepit on varmaan hioa lomakkeet kuntoon. Rekisteröintiprosessi toimii jo muuten, mutta mulla ei ole vielä käytössä mitään palvelua, jonka kautta saisi vahvistusmeilit lähetettyä. Mikähän tähän olisi paras (ilmainen) ratkaisu?

Tässä vielä linkki sivulle.

Missä muuten lopullinen tuotantoversio kannattaisi hostata? Nyt käytän tuota Herokun ilmaisversiota, koska sitä käytettiin myös FullStack Open -kurssilla.

Amazon Web Servicesiltä saa vuoden Free Tierin ja web sivun hostaus ei senkään jälkeen ihan älyttömän kallista ole jos kyseessä on staattinen sivu. Sivusto heitetään AWS S3 buckettiin ja se on aikalailla siinä. AWS Cognitolla saa aika out-of-the-box käyttäjäkannan pystyyn. Kannattaa tsekata AWS Amplify

Hyvä sivu kaikesta yllä mainitsemastani huolimatta, tieto on esitetty siellä missä sen olettaa olevan eikä leiska tai teema ärsytä. Jos kiekkoa aktiivisesti seuraisin, varmaan tuon valitsisin NHL:n virallisen sivun sijaan.

 

[Nigel]

Oma toinen React-harjoitusprojekti oli/on tuo: leikareipa/lintulista. Frontti JS/React ja bäkki PHP/MySQL. Jotain bugeja yms. löytyy mutta kyllä sillä asiansa hoitaa.

On kyllä hyvännäköinen sivu.

Itse olen käyttänyt Digital Oceania pari vuotta ja on toiminut moitteettomasti. Halvin droplet (1gb RAM, vcpu, 25gb SSD, 1000gb outbound transfer) riittää yllättävän pitkälle eikä maksa kuin vitosen kuussa. Ei siis ilmainen, mutta melko halpa kuitenkin.

Referral link, jos kiinnostaa. Saat 50$ kuukaudeksi(? eli käytännössä ilmainen kk) ja minä 25$, jos ihastut palveluun ja käytät siellä 25$. Jos tarviit jeesiä jne niin multa saa kysyä.

Houstauksen ei tarvitse olla ilmainen. 5$/kk ei ole kyllä vielä liian kallis. Täytyy tutustua. Tällä hetkellä ei ole oikeen mitään käryä näistä. Mites Linode? Tuo sponssaa montaa kuuntelemaani Podcastia niin nimi on jäänyt mieleen.

Chromella teki mulla samanlailla, pelaajakortti pyörähtää ja animaation päättyessä katoaa takapuolen sisältö näkyvistä. Nimeä pystyy kuitenkin klikkaamaan tuosta jos tietää missä kohti se siellä on näkymättömänä ja se ohjaa ko. pelaajan sivulle.

Hmm... Mulla on Chromen versio 76.0.3809.132 ja tuota ei tapahdu. Myöskin puhelimen Chromella toimii hyvin. Onko jotain helppoa tapaa testata sivua monella eri selaimella vai pitääkö kaikki eri versiot vaan asentaa ja testailla manuaalisesti?

Semmoinen huomio hakuun, että hakukoneisiin tottuneena käyttäjänä tuntuu vähän oudolta ettei "Enter" painallus tee mitään. Ehkä tuohon ohjaus hakutulokset sivulle (missä siis listaisi löydetyt pelaajat/joukkueet) tai jos tuloksia on vain yksi (esim. Mikko Koivu) ohjais suoraan ko. pelaajan/tiimin sivulle. Ei toki mikään bugi, lähinnä käytettävyysjuttu ja mielipiteeseen pohjautuva sellainen kaiken lisäksi.

Hyvä pointti. Laitetaan tehtävälistalle. Alunperin oli tarkoitus tehdä oma sivu hakutuloksille, mutta laiskuuttani päädyin tuohon ratkaisuun.

Statsisivulla näkyy yksittäisiä pelaajia kahtena rivinä (esim. Nikita Kucherov) on pistepörssin sijoilla 1. ja 2. Kliksuttelemalla sorttauksia muun kuin pistemäärän mukaan rikkoo taulukon (ainakin G, A, +/-, GP). Sortatun sarakkeen väri voisi ehkä myös olla eri väri kuin taulukon otsikkosolujen väri.

Olin ryssinyt tietokannan jotenkin. Nyt näyttäisi toimivan.

Semmoinen visuaalinen juttu myös taulukoihin yleisesti liittyen, että joka toisen rivin vois sävyttää eri värillä niin ei silmä eksy niin helposti kun tsekkaa riviä. Myös mouseover rivin päällä vois vielä muuttaa väriä niin saa silläkin tehostettua tuota.

Täytyy laittaa tämäkin tehtävälistalle.

Amazon Web Servicesiltä saa vuoden Free Tierin ja web sivun hostaus ei senkään jälkeen ihan älyttömän kallista ole jos kyseessä on staattinen sivu. Sivusto heitetään AWS S3 buckettiin ja se on aikalailla siinä. AWS Cognitolla saa aika out-of-the-box käyttäjäkannan pystyyn. Kannattaa tsekata AWS Amplify

https://aws.amazon.com/amplify/Mulla on tarvetta myös ajaa päivittäin automatisoituja skriptejä, jotka päivittää tietokannan. Se ei taida S3 bucketilla onnistua? Tarvitaan varmaan EC2?

Hyvä sivu kaikesta yllä mainitsemastani huolimatta, tieto on esitetty siellä missä sen olettaa olevan eikä leiska tai teema ärsytä. Jos kiekkoa aktiivisesti seuraisin, varmaan tuon valitsisin NHL:n virallisen sivun sijaan.

Teema on kopioitu aika suoraan Discordista. Suurinosa nettisivuista on vaaleita, joten tumman teeman valitseminen ei ollut ihan päivänselvä asia. Varmaan tulevaisuudessa jos mielenkiintoa riittää voisi koittaa askarrella myös jonkun vaalean teeman valittavaksi.

 

[mxb]

On kyllä hyvännäköinen sivu.

Houstauksen ei tarvitse olla ilmainen. 5$/kk ei ole kyllä vielä liian kallis. Täytyy tutustua. Tällä hetkellä ei ole oikeen mitään käryä näistä. Mites Linode? Tuo sponssaa montaa kuuntelemaani Podcastia niin nimi on jäänyt mieleen.

Hmm... Mulla on Chromen versio 76.0.3809.132 ja tuota ei tapahdu. Myöskin puhelimen Chromella toimii hyvin. Onko jotain helppoa tapaa testata sivua monella eri selaimella vai pitääkö kaikki eri versiot vaan asentaa ja testailla manuaalisesti?

Hyvä pointti. Laitetaan tehtävälistalle. Alunperin oli tarkoitus tehdä oma sivu hakutuloksille, mutta laiskuuttani päädyin tuohon ratkaisuun.

Olin ryssinyt tietokannan jotenkin. Nyt näyttäisi toimivan.

Täytyy laittaa tämäkin tehtävälistalle.

Mulla on tarvetta myös ajaa päivittäin automatisoituja skriptejä, jotka päivittää tietokannan. Se ei taida S3 bucketilla onnistua? Tarvitaan varmaan EC2?

Teema on kopioitu aika suoraan Discordista. Suurinosa nettisivuista on vaaleita, joten tumman teeman valitseminen ei ollut ihan päivänselvä asia. Varmaan tulevaisuudessa jos mielenkiintoa riittää voisi koittaa askarrella myös jonkun vaalean teeman valittavaksi.

Ei näytä olevan suuria eroja näin pikavilkaisulla. Varmasti ihan yhtä pätevä palvelu.

 

[Nigel]

Ios Safarilla ei tosiaan oikein toimi flippaus. Kannattaa tutkia, voisiko tuon toteuttaa niin että flippaus olisi käytössä vain sellaisilla selaimilla joilla se toimii.

Progressive enhancement - Wikipedia

Jotain pitää kyllä keksiä. Itsekin varmaan enimmäkseen Ipadilla tota tulen käyttämään.

 

[SuklaaKaakku]

Missä muuten lopullinen tuotantoversio kannattaisi hostata? Nyt käytän tuota Herokun ilmaisversiota, koska sitä käytettiin myös FullStack Open -kurssilla.

Mulla on oman projektin tuotannossa oleva palvelin Hetznerillä. Palvelin sijaitsee Helsingin konesalissa ja hintaa hiukan päälle 3 €/ kk. Vajaan vuoden aikana on ollut vain yksi katkos, kun host oli pimeänä.

 

[DualAlarm]

Heitetäänpäs tänne jännityksellä oma eka isompi fullstack-projekti näytille. Sivu on vielä kesken.

Homma lähti liikelle, koska halusin itselleni palvelun, jonka avulla voi helposti seurata NHL-pelaajien suorituksia. Näytän sivulla viimeisen 1 pelin, viimeisten 5 pelin ja viimeisten 10 pelin perusteella tämän hetken parhaat pelaajat. Lisäksi kirjautuneilla käyttäjillä on mahdollisuus lisätä suosikkeihin pelaajia, jolloin suosikit-sivulta näkyy heitän suorituksensa samojen pelimäärien perusteella. Itse änärifanina tykkään seurata enemmän yksittäisiä pelaajia kuin joukkueita.

Projektin edessä keksin palvelulle toisenkin tärkeän ominaisuuden. Maalivideot. Kuinkahan monta kertaa olen koittanut etsiä Youtubesta tai Googlettamalla jotain tiettyä maalia, mutta en ole sitä vain löytänyt. Lähdin ratkomaan ongelmaa ja sain toteutettua jokaiselle pelaajalle oman profiilisivun, jolta näkee pelaajien suoritukset peli-peliltä. Jokaiseen peliin, jossa pelaaja on tehnyt yhden tai enemmän maaleja, on liitetty maalivideot. Kun avaa pelaajan profiilisivun, niin sivun alaosassa näkyy automaattisesti viiden viimeisen pelin maalit, jos niitä on. Klikkaamalla taulukosta jotain tiettyä peliä, haetaan siihen peliin liittyvät maalivideot.

Tällä hetkellä olen vääntänyt tätä projektia reilusti yli 200 tuntia tässä kesän aikana. Aloitin tämän projektin Fullstack Open -kurssin harjoitustyönä, jossa 8 opinto-pisteeseen vaaditaan 200h työtä. Opintopisteet tuosta siis kyllä saan, mutta olisi tarkoitus tehdä tuo ihan valmiiksi asti ja viedä tuotantoon. Työtä on vielä paljon ja tarkoitus olisi saada suhteellisen valmis paketti kasaan ennen kauden alkua.

Tässä linkki: Player Follower (tylsä nimi, mutta en ole vielä keksinyt parempaa)

Eli

Pistäkäähän kommentteja ja parannusehdotuksia. Olen aika käpy CSS:n kanssa ja eka versio sivusta olikin jo valmiina semantic-ui:lla tehtynä. Heitin sen kuitenkin romukoppaan ja tein tyylittelyt itse käytännössä nollapohjalta. Ei mikään helppo homma. Älkää siis välittäkö kirjautumisista, rekisteröitymisistä, sarjataulukoista ja pistepörssistä, koska ne on viimeistelemättä.

Jotain pitää kyllä keksiä. Itsekin varmaan enimmäkseen Ipadilla tota tulen käyttämään.

Hienot sivut! Valikko ei mobiilissa vetäydy takaisin kun klikkaa jotain valikon linkeistä.

 

[kreivi_krapula]

Mulla on tarvetta myös ajaa päivittäin automatisoituja skriptejä, jotka päivittää tietokannan. Se ei taida S3 bucketilla onnistua? Tarvitaan varmaan EC2?

Ei onnistu S3:lla, mutta toki AWS:llä muita palveluja tuohon tarkoitukseen löytyy. Riippuen vähä mitä noilla skripteillä pitää tehdä, ensimmäisenä tulis mieleen viritellä Cloudwatchilla ja Lambdalla cronjobi. Jos esim. jotain web sivua crawlaa tai API:a kutsuu kerran päivässä tulosten parsimiseksi niin varmaan tuolla kombinaatiolla pärjää.

Teema on kopioitu aika suoraan Discordista. Suurinosa nettisivuista on vaaleita, joten tumman teeman valitseminen ei ollut ihan päivänselvä asia. Varmaan tulevaisuudessa jos mielenkiintoa riittää voisi koittaa askarrella myös jonkun vaalean teeman valittavaksi.

En tiedä käytitkö mitään UI-frameworkkiä, mutta esim. Material-UI frameworkissä tuollaisen teeman tekeminen ja kaikkien UI komponenttien yhdenmukainen päivittäminen on erittäin simppeli toteuttaa. Lisäksi tuollaisen light/dark kytkimen voi lisätä käyttäjän näkyville (kuten heidän omassa dokumentaatiossaankin on tehty tuolla lampulla yläpalkissa) niin voi käyttäjä valita mieleisen teemansa.

Tuollainen teema-ajattelu taitaa olla aika yleistä muillekkin frameworkeille, joten kannattaa tsekata löytyykö valmiina jos jotain käytit.

 

[Nigel]

Nyt alkaa olla peruspaketti kasassa. Sain grindattua kaikki lomakkeet kuntoon ja jotain muita tylsiä asioita, kuten transaktiosähköpostit ja yhteydenottolomakeen. Tällä hetkellä ainut täysin keskeneräinen sivu on terms and conditions, joka ei vissiin ole edes pakollinen.

Löysin mielestäni loistavan vapaana olevan domainin ja palvelun nimeksi tuli nyt sitten Player Fan. Jos joku jaksaa käydä testaamassa rekisteröitymisprosessia, yhteydenottolomaketta ja forgot passwordia, niin olisin kiitollinen. Testasin toki ne itse jo omalta koneelta, mutta useampi testaaja on aina parempi kuin yksi.

Seuraavaksi täytyy ainakin nuo notifikaatiot viimeistellä. Tällä hetkellä backendistä tulee aika rumia virheilmoituksia ja täytyy miettiä, että mikä olisi paras tapa esittää ne sivulla.

Täytyy myös lisäillä jotain animaatioita, jotka ei toivottavasti riko sivua, jotta siitä tulisi vähän sulavampi. Esim. lomake-modalit voisi aueta jonkun animaation saattelemana.

Mulla on suunnitelmissa myös muutama uusi näkymä noille pelaajakorteille. Tällä hetkellä näkyy siis vain 15 parasta pelaajaa tietyltä aikaväliltä, mutta ainakin jotain filttereitä tuohon voisi lisätä. Täytyy ruveta pohtimaan miten tuon saisi toteutettua backendissä, koska nykyinen systeemi on rakennettu näyttämään ainoastaan tuo näkymä.

Ei onnistu S3:lla, mutta toki AWS:llä muita palveluja tuohon tarkoitukseen löytyy. Riippuen vähä mitä noilla skripteillä pitää tehdä, ensimmäisenä tulis mieleen viritellä Cloudwatchilla ja Lambdalla cronjobi. Jos esim. jotain web sivua crawlaa tai API:a kutsuu kerran päivässä tulosten parsimiseksi niin varmaan tuolla kombinaatiolla pärjää.

Skriptit on juurikin tiedon hakua kerran päivässä API:sta ja sen jälkeen sitten pari erilaista laskentaa päivitettyjen hakutulosten pohjalta.

En tiedä käytitkö mitään UI-frameworkkiä, mutta esim. Material-UI frameworkissä tuollaisen teeman tekeminen ja kaikkien UI komponenttien yhdenmukainen päivittäminen on erittäin simppeli toteuttaa. Lisäksi tuollaisen light/dark kytkimen voi lisätä käyttäjän näkyville (kuten heidän omassa dokumentaatiossaankin on tehty tuolla lampulla yläpalkissa) niin voi käyttäjä valita mieleisen teemansa.

Tuollainen teema-ajattelu taitaa olla aika yleistä muillekkin frameworkeille, joten kannattaa tsekata löytyykö valmiina jos jotain käytit.

Aluksi sivu tein sivun Semantic-UI:lla, mutta päädyin lopulta tekemään koko sivun uudestaan styled-components-kirjastolla. Lähdin CSS:n kanssa käytännössä nollasta liikkeelle, niin tuntui, että saan hommasta enemmän irti jos vaan teen kaiken itse. Ihan hyvä oppitunti on ollut.

Mulla on oman projektin tuotannossa oleva palvelin Hetznerillä. Palvelin sijaitsee Helsingin konesalissa ja hintaa hiukan päälle 3 €/ kk. Vajaan vuoden aikana on ollut vain yksi katkos, kun host oli pimeänä.

On kyllä houkutteleva hinta. Luulen, tosin, että suurinosa sivuni käyttäjistä tulee olemaan pohjoisamerikkalaisia, niin en tiedä onko fiksua ottaa palvelinta Helsingistä? Onko sellainen palvelin mihin itse asennetaan käyttis ym tarvittava?

 

[Paapaa]

Oliko joku syy, miksi et käyttäisi Herokua, jos se kerran jo Herokussa nätisti pyörii @Nigel? Hobby-dyno maksaa $7/kk.

 

[©©©]

Hieno ja toimiva sivu @Nigel Ainakin mobiililla sanoo, että ei ole https. Tuo varmaan kannattaa korjata ennen rekisteröitymistä. oauth olis kyllä kans kiva. Vaaleaa teemaa myös kaipailisin.

 

[Nigel]

Oliko joku syy, miksi et käyttäisi Herokua, jos se kerran jo Herokussa nätisti pyörii @Nigel? Hobby-dyno maksaa $7/kk.

Itseasiassa Heroku voikin olla ihan varteenotettava vaihtoehto. Vaihtoa mietin oikeastaan vain sen takia, että ympäri nettiä porukka tuntuu suosittelevan aina jotain muuta vaihtoehtoa. Ehkä minun tapauksessa on paras pysyä Herokussa ja miettiä vaihtoja jos huomaan jotain erityisiä puutteita tai hinta nousee liikaa.

Hieno ja toimiva sivu @Nigel Ainakin mobiililla sanoo, että ei ole https. Tuo varmaan kannattaa korjata ennen rekisteröitymistä. oauth olis kyllä kans kiva. Vaaleaa teemaa myös kaipailisin.

Herokun ilmaisessa dynossa ei saa SSL:ää. Tämä on korjautuu tässä jossain vaiheessa. Laitan OAuthin tehtävälistalle.

 

[Joonikko]

Ei nyt ehkä kovin mielenkiintoinen, teknisesti hieno tai mullistava sivu, mutta omaa elämänlaatua parantanut selaimen starttisivu omilla kirjainmerkeillä, suodatuksella, hakukoneilla jne. Hyödyllinen jos on monta selainta & laitetta ja haluaa välttyä synkronoinnin määrältä kirjainmerkkien kanssa.



Ominaisuuksia

• Hakukentät DuckDuckGo:hon, Googleen, englanninkieliseen Googleen (hyödyllinen matkustaessa), Wikipediaan, Hinta.fi:hin ja YouTubeen.
• Pikanäppäimet hakukenttiin numeroilla 1-7.
• Suodatus linkeistä. Tällä hetkellä himmentää linkit, jotka eivät täsmää hakuun.

Sivun voi kloonata, muokata ja laittaa omalle palvelimelle, Github Sivuille tai jättää paikalliseksi versioksi. Itselläni tuo on pääsääntöisesti paikallisena versiona ja mobiililaitteille Githubin sivuilla.

Alla oleva Shell-skripti parsii Chromesta viedyt kirjainmerkit tälle sivulle sopivaan muotoon, jolloin omat kirjainmerkit saa suoraan liitettyä tähän pohjaan:

#!/usr/bin/env bash

cat bookmarks.html | \
sed -e '1,6d' | \
sed -e 's/ICON=.*"//' | \
sed -e 's/ADD_DATE=.*"//' | \
awk '{gsub("<DT>","");print}' | \
awk '{gsub("</DT>","");print}' | \
awk '{gsub("<DL>","");print}' | \
awk '{gsub("</DL>","");print}' | \
awk '{gsub("<p>","");print}' | \
awk '{gsub("<A","<a class=\"b\"");print}' | \
awk '{gsub("</A>","</a>");print}' | \
sed 's/^[[:space:]]*//' | \
awk NF > bookmarks_out.txt

Demo, Repositorio: Joonikko/browser-start-page ja versio ilman mitään linkkejä: Joonikko/browser-start-page

2019-09-18 Edit: lisätty skripti bookmarks.html parsimista varten.

 

[nnaku]

Onko jotain helppoa tapaa testata sivua monella eri selaimella vai pitääkö kaikki eri versiot vaan asentaa ja testailla manuaalisesti?

Jos löytyy taskunpohjalta dollareita niin browserstack on aika hemmetin huikkee työkalu! Freelancer paketin saa edullisesti (vissiin alle 20$) yhdeksi kuukaudeksi kerrallaan. OSS projekteille taitaa olla ilmainen.