{"id":230248,"date":"2022-11-22T15:41:00","date_gmt":"2022-11-22T12:41:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=230248"},"modified":"2022-11-09T20:47:43","modified_gmt":"2022-11-09T17:47:43","slug":"iterointi-wordpressin-hallintanaeytoen-suunnittelussa","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fi\/iterointi-wordpressin-hallintanaeytoen-suunnittelussa\/","title":{"rendered":"Iterointi WordPressin hallintan\u00e4yt\u00f6n suunnittelussa"},"content":{"rendered":"\n<p>Ajatus &quot;iteratiivisesta prosessista&quot; ei ole mik\u00e4\u00e4n uusi ohjelmistokehityksess\u00e4, vaan se on l\u00e4sn\u00e4 useissa eri menetelmiss\u00e4 ja todenn\u00e4k\u00f6isesti siksi, ett\u00e4 se toimii hyvin erityisesti asiakaspalautteen saamisessa.<\/p>\n<p>Yksi paikoista, joista pid\u00e4n sit\u00e4 my\u00f6s hy\u00f6dyllisen\u00e4, on WordPress-laajennusten hallintaliittymien rakentaminen.<\/p>\n<p>Selvyyden vuoksi totean, ett\u00e4 en ole suunnittelija, joten front-end-t\u00f6iden suhteen viittaan aina tyylioppaaseen ja suunnittelijan minulle toimittamiin malleihin projektin alusta l\u00e4htien. (Mainin t\u00e4m\u00e4n vain, koska mielest\u00e4ni se on k\u00e4yt\u00e4nt\u00f6, jonka jokaisen, joka ei ole suunnittelija, tulisi noudattaa, mutta min\u00e4 poikkean).<\/p>\n<p>Mutta kun on kyse WordPressin hallintan\u00e4yt\u00f6ist\u00e4 tai taustan\u00e4ytt\u00f6ist\u00e4, noudatan tiukkaa s\u00e4\u00e4nt\u00f6\u00e4: Varmista, ett\u00e4 se n\u00e4ytt\u00e4\u00e4 mahdollisimman luonnolliselta.<\/p>\n<p>Miten iteratiivisella kehityksell\u00e4 ja WordPress-hallintaruutujen k\u00e4ytt\u00f6liittym\u00e4ll\u00e4 sitten on mit\u00e4\u00e4n tekemist\u00e4 kesken\u00e4\u00e4n?<\/p>\n<h2>WordPress-hallinnan n\u00e4yt\u00f6n suunnittelu<\/h2>\n<p>T\u00e4ss\u00e4 artikkelissa ei puhuta asioista, joita odotetaan tietojen tallentamiseksi. Eli oletan kaiken:<\/p>\n<ul>\n<li>desinfiointi,<\/li>\n<li>validointi,<\/li>\n<li>nonce shekkej\u00e4,<\/li>\n<li>lupien tarkastukset,<\/li>\n<\/ul>\n<p>Ja vastaavat ymm\u00e4rret\u00e4\u00e4n ja k\u00e4sitell\u00e4\u00e4n.<\/p>\n<p>T\u00e4t\u00e4 viesti\u00e4 varten aion pit\u00e4\u00e4 asian yksinkertaisena. Oletetaan, ett\u00e4 haluamme:<\/p>\n<ul>\n<li>pari tekstikentt\u00e4\u00e4,<\/li>\n<li>tallennuspainike,<\/li>\n<li>nollauspainike,<\/li>\n<li>ja ehk\u00e4 jotain ylim\u00e4\u00e4r\u00e4ist\u00e4 lopussa.<\/li>\n<\/ul>\n<p>Miten t\u00e4m\u00e4 voi toteutua iteratiivisen prosessin kautta sit\u00e4 suunniteltaessa?<\/p>\n<h3>1 Sen luonnosteleminen<\/h3>\n<p>Oletetaan, ett\u00e4 ty\u00f6skentelet jonkin asian parissa ja suunnittelet, milt\u00e4 hallinnollinen n\u00e4ytt\u00f6 tulee n\u00e4ytt\u00e4m\u00e4\u00e4n. Ottaen huomioon sen, mit\u00e4 meill\u00e4 oli yll\u00e4, alkuper\u00e4inen luonnos voisi ehk\u00e4 n\u00e4ytt\u00e4\u00e4 t\u00e4lt\u00e4:<\/p>\n<p>Tarpeeksi helppoa, eik\u00f6? Se edustaa sit\u00e4, mit\u00e4 projektin on yll\u00e4pidett\u00e4v\u00e4, ja se n\u00e4ytt\u00e4\u00e4 kaiken, mit\u00e4 tarvitsemme t\u00e4h\u00e4n hallintaruutuun.<\/p>\n<h3>2 Sen rakentaminen<\/h3>\n<p>Kun se on koottu, sen pit\u00e4isi n\u00e4ytt\u00e4\u00e4 mahdollisimman alkuper\u00e4iselt\u00e4. Ottaen huomioon WordPressiss\u00e4 saatavilla olevat tyylit, on suhteellisen helppoa rakentaa t\u00e4m\u00e4 saatavilla olevien API:iden ja merkint\u00f6jen avulla:<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-164847-61e76fc6c5f0d.jpg\" data-rel=\"lightbox\" ><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-164847-61e76fc6c5f0d.jpg\" alt=\"Iterointi WordPressin hallintan\u00e4yt\u00f6n suunnittelussa\" ><\/a><\/p>\n<p>Ja mit\u00e4 kukin kentt\u00e4 ja painike tekev\u00e4t?<\/p>\n<h3>3 Sen jalostaminen<\/h3>\n<p>T\u00e4ss\u00e4 tulee esiin toiminnallisuuden hiominen. Esimerkiksi:<\/p>\n<ul>\n<li>Mielest\u00e4ni <strong>Tallenna<\/strong> &#8211; painiketta ei pit\u00e4isi ottaa k\u00e4ytt\u00f6\u00f6n ennen kuin vaaditut kent\u00e4t on t\u00e4ytetty,<\/li>\n<li>Mielest\u00e4ni <strong>Reset<\/strong> &#8211; painikkeen pit\u00e4isi tyhjent\u00e4\u00e4, mit\u00e4 on,<\/li>\n<li>Virheilmoituksia pit\u00e4isi olla jonkin verran, jotka kaikki kertovat, mit\u00e4 meid\u00e4n on teht\u00e4v\u00e4, kun jokin ep\u00e4onnistuu, kun jokin ei ehk\u00e4 ole oikein tai jokin on t\u00e4ysin v\u00e4\u00e4rin.<\/li>\n<\/ul>\n<p>On selv\u00e4\u00e4, ett\u00e4 on paljon helpompaa puhua t\u00e4st\u00e4, kun se ei viittaa tiettyyn projektiin, mutta ehk\u00e4 jotkut ideat ovat sovellettavissa miss\u00e4 tahansa, mit\u00e4 sinulla on meneill\u00e4\u00e4n.<\/p>\n<h2>Asynkroniset parannukset?<\/h2>\n<p>Yksi asioista, joihin olemme tottuneet puhelimiemme ja tiettyjen k\u00e4ytt\u00f6j\u00e4rjestelmien kaltaisten laitteiden kanssa, on se, ett\u00e4 kun vaihdamme kytkint\u00e4 tai teemme pienen muutoksen, tiedot tallentuvat.<\/p>\n<p>Toisin sanoen mit\u00e4\u00e4n vahvistusta ei tarvita (muuta kuin jotain tuhoisaa, kuten tiedoston poistamista, tietysti). Tiedot yksinkertaisesti tallennetaan ja vaihtoehto toimii.<\/p>\n<p>N\u00e4emme kuitenkin edelleen paljon <strong>Tallenna<\/strong> &#8211; painikkeita WordPressiss\u00e4, eik\u00f6 niin? Ent\u00e4 tulojen tallentaminen Ajaxin tai muun asynkronisen menetelm\u00e4n kautta? T\u00e4m\u00e4 on jotain, jota en ole viel\u00e4 toteuttanut, mutta olen varmasti harkinnut sit\u00e4.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/tommcfarlin.com\" class=\"external external_icon\">tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kun ty\u00f6skentelemme WordPressin hallintan\u00e4yt\u00f6n suunnittelussa, voimme seurata iteratiivista prosessia laadun vuoksi.<\/p>\n","protected":false},"author":1,"featured_media":223984,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[843,864],"tags":[1166],"class_list":["post-230248","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-opetusohjelmia","category-wordpress-5","tag-affiai-fi"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts\/230248","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/comments?post=230248"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts\/230248\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/media\/223984"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/media?parent=230248"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/categories?post=230248"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/tags?post=230248"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}