{"id":228967,"date":"2022-11-03T11:50:00","date_gmt":"2022-11-03T08:50:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=228967"},"modified":"2022-11-09T05:10:01","modified_gmt":"2022-11-09T02:10:01","slug":"kiire-prototueuepimine-wordpressiga-kontseptsioonist-pistikprogrammini","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/kiire-prototueuepimine-wordpressiga-kontseptsioonist-pistikprogrammini\/","title":{"rendered":"Kiire protot\u00fc\u00fcpimine WordPressiga: kontseptsioonist pistikprogrammini"},"content":{"rendered":"\n<p>Olen r\u00e4\u00e4kinud eelmises artiklis WordPressi kasutamisest <a href=\"https:\/\/tommcfarlin.com\/rapid-application-development\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">rakenduste kiireks arendamiseks .<\/a><\/p>\n<p>Kuid mida kauem ma WordPressiga t\u00f6\u00f6tan ja mida rohkem koodi n\u00e4en, seda rohkem potentsiaali ma m\u00f5istan, et sellel on nii kiire protot\u00fc\u00fcpimise platvorm kui ka nende protot\u00fc\u00fcpide viimine t\u00e4ielikult v\u00e4lja t\u00f6\u00f6tatud rakendustesse.<\/p>\n<p>Need pistikprogrammid v\u00f5ivad olla veebirakendused, pistikprogrammid, teemad, veebisaidid ja mis iganes. Selle postituse jaoks pole see oluline. Selle asemel on oluline n\u00e4iteks see, et:<\/p>\n<ul>\n<li>teil on pistikprogrammi idee,<\/li>\n<li>soovite n\u00e4ha, kuidas see WordPressis toimida v\u00f5iks,<\/li>\n<li>paned kiiresti midagi kokku,<\/li>\n<li>hakkate seda viimistlema.<\/li>\n<\/ul>\n<p>Paljudel, kes tegelevad t\u00f5sisema WordPressi arendusega, arvasin, et tasub vaadata, kuidas see v\u00e4lja n\u00e4eb. Nimelt v\u00f5tan ette plugina idee, protot\u00fc\u00fcbi ja siis viimistlen h\u00e4sti organiseeritud objektorienteeritud pluginaks.<\/p>\n<p>Nii et j\u00e4rgmises artiklite seerias k\u00e4sitlen seda protsessi.<\/p>\n<h2>Kiire protot\u00fc\u00fcpimine WordPressiga: kontseptsioon<\/h2>\n<p>Kuigi see ei ole alati nii, tekivad n\u00e4iteks pistikprogrammi algsed kontseptsioonid vajadusest millegi j\u00e4rele, mida v\u00f5iksite endale v\u00f5i kellelegi teisele soovida.<\/p>\n<p>Kui olete nagu mina, aitab see visandada m\u00f5ned esialgsed ideed selle kohta, kuidas see v\u00f5iks toimida, ja teha vajalikke m\u00e4rkmeid, mis aitavad arendada.<\/p>\n<p>Minu teravad disainioskused protot\u00fc\u00fcbi jaoks.<\/p>\n<p>Muidugi v\u00f5ivad nad teiste jaoks otsustada h\u00fcpata otse IDE-sse ja hakata koodi kallal t\u00f6\u00f6tama. Ja kuna praeguses faasis on see vaid kiirprotot\u00fc\u00fcp, pole selles midagi halba.<\/p>\n<p>Nagu \u00fclaltoodud visandilt n\u00e4ete, soovin kirjutada v\u00e4ikese pistikprogrammi, mis kuvab minu kolm viimast postitust metakastis.<\/p>\n<p>Pistikprogrammi idee on j\u00e4rgmine:<\/p>\n<ul>\n<li>Kui ma postitust kirjutan, saan h\u00f5lpsalt viidata oma kolmele viimasele postitusele, kui tahan oma sisu suhtlusv\u00f5rgustikes jagada.<\/li>\n<\/ul>\n<p>V\u00f5ib-olla tundub pistikprogrammi eesm\u00e4rk rumal; v\u00f5ibolla mitte. Pidage meeles, et k\u00f5ik, mille ehitamise otsustate, peaks olema kasulik nii teile kui ka teie vaatajaskonnale. Kui keegi teine \u200b\u200bsellest aru ei saa, on h\u00e4sti.<\/p>\n<h3>Protsessi alustamine<\/h3>\n<p>N\u00fc\u00fcd, kui meil on p\u00f5hiidee paigas, teame, et vajame m\u00f5nda asja.<\/p>\n<ol>\n<li>WordPressi pistikprogrammi ekraanil kuvatav pistikprogrammi fail,<\/li>\n<li>Metabast postituste kuvamiseks,<\/li>\n<li>P\u00e4ring postituste allalaadimiseks,<\/li>\n<li>S\u00f5numi kuvamise viis, kui kuvatavaid postitusi pole.<\/li>\n<\/ol>\n<p>M\u00f5ne p\u00f5hikonksu ja WordPressi API-de kasutamisega saame midagi kiiresti kokku panna. Tehke j\u00e4rgmist.<\/p>\n<h4>Plugina p\u00e4is<\/h4>\n<p>Pidage meeles, <a href=\"https:\/\/gist.github.com\/tommcfarlin\/a78a868ff9203c1ff39365e39a2e4803#file-00-plugin-header-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">et pistikprogrammi p\u00e4is<\/a> vastutab pistikprogrammi sisu \u2013 selle pealkirja, kirjelduse, versiooni ja autori \u2013 kuvamise eest pistikprogrammi ekraanil. Veenduge, et see oleks l\u00fchike, kirjeldav ja asjakohane.<\/p>\n<pre><code>&lt;?php\n\/**\n * Three Recent Posts\n *\n * @package     TRP\n * @author      Tom McFarlin\n * @copyright   2017 Tom McFarlin\n * @license     MIT\n *\n * @wordpress-plugin\n * Plugin Name: Three Recent Posts\n * Plugin URI:  https:\/\/tommcfarlin.com\/rapid-prototyping\/\n * Description: Displays the three mot recent posts in your post editor screen.\n * Version:     0.1.0\n * Author:      Tom McFarlin\n * Author URI:  https:\/\/tommcfarlin.com\n * Text Domain: three-recent-posts\n * License:     MIT\n * License URI: http:\/\/www.gnu.org\/licenses\/gpl-3.0.txt\n *\/<\/code><\/pre>\n<p>Kui see on kirjutatud, ilmub pistikprogramm WordPressi haldusalasse, kuid see ei tee tegelikult midagi. Nii et anname pistikprogrammile m\u00f5ned tegelikud funktsioonid.<\/p>\n<h4>Meta Box<\/h4>\n<p>Esiteks peame registreerima metakasti. Selleks saame kasutada konksu <a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/add_meta_box\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">add_meta_boxes<\/a>. Seda on lihtne m\u00e4\u00e4ratleda ja <a href=\"https:\/\/gist.github.com\/tommcfarlin\/a78a868ff9203c1ff39365e39a2e4803#file-01-register-a-meta-box-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">meie metakastiga<\/a> \u00fchendada. V\u00f5tke teadmiseks kommentaarid iga meetodi argumendi kohta.<\/p>\n<pre><code>&lt;?php\n\nadd_action( 'add_meta_boxes', 'three_recent_posts_meta_box' );\n\/**\n * Registers the Meta Box with WordPress. Defines the ID, title, display function,\n * and the post type on which it will live.\n *\/\nfunction three_recent_posts_meta_box() {\n\n    add_meta_box(\n        'three-recent-posts',     \/\/ Meta Box ID.\n        'Three Recent Posts',     \/\/ Meta Box Title.\n        'three_recent_posts_display', \/\/ Function for rendering the meta box.\n        'post',               \/\/ Post type on which this meta box will live.\n        'side'                \/\/ Where the meta box will be displayed.\n    );\n}<\/code><\/pre>\n<p>Pange t\u00e4hele, et meil on teabe kuvamise eest vastutav funktsioon. Peame selle m\u00e4\u00e4ratlema, vastasel juhul proovib WordPress k\u00e4ivitada funktsiooni, mida pole olemas, ja see toob kaasa vea.<\/p>\n<p>Defineerime <a href=\"https:\/\/gist.github.com\/tommcfarlin\/a78a868ff9203c1ff39365e39a2e4803#file-02-display-recent-posts-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">n\u00fc\u00fcd selle funktsiooni<\/a> :<\/p>\n<pre><code>&lt;?php\n\n\/**\n * If there are posts to display, renders them in the metabox. Otherwise, displays\n * a note that there are no posts to display.\n *\/\nfunction three_recent_posts_display() {\n\n    $query = _three_recent_posts_get();\n\n    if ($query-&gt;have_posts()) {\n        _three_recent_posts_show_posts( $query );\n    } else {\n        _three_recent_posts_no_posts();\n    }\n\n}\n<\/code><\/pre>\n<p>Kui n\u00fc\u00fcd m\u00e4rkate, tugineb see funktsioon kolmele erinevale funktsioonile, mis aitavad tal oma t\u00f6\u00f6d teha. Seega peame ka need funktsioonid m\u00e4\u00e4ratlema. Ideaalis peaks k\u00f5igil nendel funktsioonidel olema funktsiooni eesm\u00e4rk, kuid arvestades, et teeme selle projekti kiiresti protot\u00fc\u00fcpi, v\u00f5ib meil olla tavalisest rohkem t\u00f6\u00f6d \u00fche funktsiooni kohta.<\/p>\n<h5>Postituste p\u00e4ring<\/h5>\n<p>Esiteks peame <a href=\"https:\/\/gist.github.com\/tommcfarlin\/a78a868ff9203c1ff39365e39a2e4803#file-03-query-for-recent-posts-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">otsima postitusi<\/a>. Selleks kasutame \u00e4ra <a href=\"https:\/\/codex.wordpress.org\/Class_Reference\/WP_Query\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">WP_Query<\/a>.<\/p>\n<pre><code>&lt;?php\n\n\/**\n * Defines a query for retrieving the three most recent posts and orders them by\n * descing date (with the most recent being first).\n *\n * @return WP_Query $query The query for retrieving the three most recent posts.\n *\/\nfunction _three_recent_posts_get() {\n\n    $args = array(\n        'post_type'   =&gt; 'post',\n        'post_status' =&gt; 'publish',\n        'orderby'     =&gt; 'date',\n        'order'       =&gt; 'desc',\n    );\n    $query = new WP_Query( $args );\n\n    return $query;\n}\n<\/code><\/pre>\n<p>Pange t\u00e4hele, et tagastame p\u00e4ringuobjekti eksemplari. Teeme sellega kohe rohkem.<\/p>\n<h5>Tulemuse kuvamine<\/h5>\n<p>Kui kuvada on postitusi, kasutame leitud WP_Query eksemplari postituste kordamiseks funktsiooni ning renderdame p\u00fcsilingi <a href=\"https:\/\/gist.github.com\/tommcfarlin\/a78a868ff9203c1ff39365e39a2e4803#file-04-display-recent-posts-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ja pealkirja j\u00e4rjestatud loendis<\/a>.<\/p>\n<pre><code>&lt;?php\n\n\/**\n * Creates the content for the meta box if there are posts to display. Creates a notice\n * that up to three posts will be displayed, then links to each of the three most recent\n * post.\n *\n * @param WP_Query $query The query that contains results to render in the display.\n *\/\nfunction _three_recent_posts_show_posts( $query) {\n\n    \/\/ There may not always be three posts, so display a message explaining.\n    $html = '&lt;p&gt;';\n        $html .= '&lt;span class=\"description\"&gt;';\n            $html .= 'Displays up to the three most recent posts.';\n        $html .= '&lt;\/span&gt;';\n    $html .= '&lt;\/p&gt;';\n\n    \/\/ Create an ordered lists of the most recent posts.\n    $html .= '&lt;ol&gt;';\n    while ($query-&gt;have_posts()) {\n        $query-&gt;the_post();\n\n        $html .= '&lt;li&gt;';\n            $html .= '&lt;a href=\"'. get_the_permalink(). '\"&gt;';\n                $html .= get_the_title();\n            $html .= '&lt;\/a&gt;';\n        $html .= '&lt;\/li&gt;';\n    }\n    $html .= '&lt;\/ol&gt;';\n\n    echo $html;\n}\n<\/code><\/pre>\n<p>Pange t\u00e4hele, et see loetleb kuni kolm, kuid mitte tingimata kokku kolm.<\/p>\n<h5>Tulemust ei kuvata<\/h5>\n<p>Kui tulemusi pole, peame kuvama kasutajale teate, et p\u00e4ring ei leidnud postitusi. Kood v\u00f5ib v\u00e4lja n\u00e4ha umbes <a href=\"https:\/\/gist.github.com\/tommcfarlin\/a78a868ff9203c1ff39365e39a2e4803#file-05-displaying-no-posts-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">selline<\/a> :<\/p>\n<pre><code>&lt;?php\n\n\/**\n * Displays a message in the meta box if there are no recent posts.\n *\/\nfunction _three_recent_posts_no_posts() {\n\n    $html .= '&lt;span class=\"description\"&gt;';\n        $html .= 'There are no recent posts.';\n    $html .= '&lt;\/span&gt;';\n\n    echo $html;\n}\n<\/code><\/pre>\n<p>Loomulikult saate s\u00f5numit selle jaoks ise kohandada.<\/p>\n<h2>Kiire protot\u00fc\u00fcpimine, tehtud.<\/h2>\n<p>Siin on t\u00e4isfunktsionaalne pistikprogramm. Siiski pole see probleemideta:<\/p>\n<ol>\n<li>Segame HTML-i oma PHP-ga, mille tulemuseks on tihedam seos kui vaja,<\/li>\n<li>HTML ei ole niikuinii puhastatud ega turvaline,<\/li>\n<li>Nendel funktsioonidel pole absoluutselt mingit objektorientatsiooni, mis, kuigi m\u00f5ned v\u00f5ivad v\u00e4ita, et pole vajalik, muudab selle v\u00e4ga ebamodulaarseks.<\/li>\n<\/ol>\n<p>Kuid selle seeria m\u00f5te on v\u00f5tta kiire protot\u00fc\u00fcp ja viia see professionaalsemasse pistikprogrammi. Seega oleme esimese osa teinud ja n\u00fc\u00fcd on aeg hakata liikuma teise faasi.<\/p>\n<p>Seni saate selle pistikprogrammi <a href=\"https:\/\/github.com\/tommcfarlin\/three-recent-posts\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">arendamist GitHubis<\/a> j\u00e4lgida. M\u00e4rgistan iga v\u00e4ljalase, mis vastab ajaveebi postitusele. Nii et selle konkreetse postituse leiate <a href=\"https:\/\/github.com\/tommcfarlin\/three-recent-posts\/tree\/0.1.0\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">0.1.0<\/a> sildist.<\/p>\n<p>P\u00f5hiharu sisaldab ka kogu \u00fchendatud koodi uusimat versiooni ja arendusharu koodi, mille kallal ma t\u00f6\u00f6tan, kuid mis pole t\u00e4ielik (ega stabiilne) <a href=\"https:\/\/github.com\/tommcfarlin\/three-recent-posts\/tree\/master\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">.<\/a><\/p>\n<p>Ja ma hakkan seda j\u00e4rgmises postituses tegema.<\/p>\n<h2>Sarja postitused<\/h2>\n<ol>\n<li><a href=\"https:\/\/tommcfarlin.com\/rapid-prototyping\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Kiire protot\u00fc\u00fcpimine WordPressiga: kontseptsioonist pistikprogrammini<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.mediadoma.com\/et\/kiire-prototueuepimine-wordpressiga-kontseptsiooni-analueues\/\" title=\"Kiire protot\u00fc\u00fcpimine WordPressiga: kontseptsiooni anal\u00fc\u00fcs\">Kiire protot\u00fc\u00fcpimine WordPressiga: kontseptsiooni anal\u00fc\u00fcs<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.mediadoma.com\/et\/kiire-prototueuepimine-prototueuep-koodiks-1-osa\/\" title=\"Kiire protot\u00fc\u00fcpimine: protot\u00fc\u00fcp koodiks, 1. osa\">Kiire protot\u00fc\u00fcpimine: protot\u00fc\u00fcp koodiks, 1. osa<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.mediadoma.com\/et\/kiirprototueuepimine-prototueuep-koodiks-2-osa\/\" title=\"Kiirprotot\u00fc\u00fcpimine: protot\u00fc\u00fcp koodiks, 2. osa\">Kiirprotot\u00fc\u00fcpimine: protot\u00fc\u00fcp koodiks, 2. osa<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.mediadoma.com\/et\/kiire-prototueuepimine-automaatse-laadimise-tutvustamine\/\" title=\"Kiire protot\u00fc\u00fcpimine: automaatse laadimise tutvustamine\">Kiire protot\u00fc\u00fcpimine: automaatse laadimise tutvustamine<\/a><\/li>\n<\/ol>\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>WordPress t\u00f6\u00f6tab nii platvormina kiireks protot\u00fc\u00fcpimiseks kui ka nende protot\u00fc\u00fcpide viimiseks t\u00e4ielikult v\u00e4ljat\u00f6\u00f6tatud rakendustesse.<\/p>\n","protected":false},"author":1,"featured_media":223885,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[718,916,842],"tags":[1165],"class_list":["post-228967","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-arendaja","category-muud","category-opetused","tag-affiai-et"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/228967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/comments?post=228967"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/228967\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media\/223885"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media?parent=228967"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/categories?post=228967"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/tags?post=228967"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}