{"id":230381,"date":"2022-11-24T10:45:00","date_gmt":"2022-11-24T07:45:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=230381"},"modified":"2022-11-24T10:50:55","modified_gmt":"2022-11-24T07:50:55","slug":"ide-wordpressin-kehittaemiseen-kokemuksesta-riippumatta","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fi\/ide-wordpressin-kehittaemiseen-kokemuksesta-riippumatta\/","title":{"rendered":"IDE WordPressin kehitt\u00e4miseen (kokemuksesta riippumatta)"},"content":{"rendered":"\n<p>Edellisess\u00e4 <strong><a href=\"https:\/\/wordpress.mediadoma.com\/fi\/wordpress-kehitysympaeristoe-kaeyttaemaellae-paketinhallintaa\/\" title=\"artikkelissa\">artikkelissa<\/a><\/strong> k\u00e4vin l\u00e4pi paikallisen kehitysymp\u00e4rist\u00f6n m\u00e4\u00e4ritt\u00e4misen paketinhallinnan avulla. Erityisesti puhuin <strong><a href=\"https:\/\/brew.sh\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Homebrew&#8217;n k\u00e4ytt\u00e4misest\u00e4<\/a><\/strong> <strong><a href=\"https:\/\/laravel.com\/docs\/5.5\/valet\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Valetin<\/a><\/strong> ja <strong><a href=\"https:\/\/getcomposer.org\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Composerin<\/a><\/strong> asentamiseen .<\/p>\n<p>Edellinen tarjoaa Nginx-verkkopalvelimen, MySQL-tietokantapalvelimen, kun taas Homebrew antaa sinun asentaa PHP:n. Composer antaa sinulle mahdollisuuden k\u00e4sitell\u00e4 PHP-riippuvuuksia. Jos et ole lukenut viesti\u00e4, suosittelen sit\u00e4, koska t\u00e4m\u00e4 viesti perustuu koko ymp\u00e4rist\u00f6\u00f6n.<\/p>\n<\/p>\n<p>Erityisesti aion puhua IDE:ist\u00e4. Se on varmaan kuuma aihe, mutta jos sinulla ei ole mieltymyksi\u00e4, opastan sinut valitsemaan mielest\u00e4ni parhaan (ainakin aluksi), m\u00e4\u00e4ritt\u00e4m\u00e4\u00e4n sen ja k\u00e4ytt\u00e4m\u00e4\u00e4n sit\u00e4. <strong><a href=\"https:\/\/wordpress.mediadoma.com\/fi\/wordpress-kehitysympaeristoe-kaeyttaemaellae-paketinhallintaa\/\" title=\"viime viikolla perustetun ymp\u00e4rist\u00f6n\">viime viikolla perustetun ymp\u00e4rist\u00f6n<\/a><\/strong> yhteydess\u00e4 .<\/p>\n<h2>IDE WordPressin kehitt\u00e4miseen<\/h2>\n<p>Monet ammattimaiset WordPress-kehitt\u00e4j\u00e4t kuulet todenn\u00e4k\u00f6isesti heid\u00e4n puhuvan <strong><a href=\"https:\/\/www.jetbrains.com\/phpstorm\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">PhpStormista<\/a><\/strong>. Ja hyv\u00e4st\u00e4 syyst\u00e4. Olen k\u00e4ytt\u00e4nyt t\u00e4t\u00e4 tietty\u00e4 IDE:t\u00e4 nyt yli vuoden ja se on todella tehokas.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-164596-61e768df76d6e.png\" 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-164596-61e768df76d6e.png\" alt=\"IDE WordPressin kehitt\u00e4miseen (kokemuksesta riippumatta)\"><\/a><\/p>\n<p>Siin\u00e4 on suuri tuki useille edistyneille ominaisuuksille, se on laajennettavissa ja siin\u00e4 on paljon integroituja ominaisuuksia, jotka tekev\u00e4t siit\u00e4 erinomaisen ty\u00f6ymp\u00e4rist\u00f6n. Olen kuitenkin huomannut, ett\u00e4 kaikista kokeilmistani IDE:ist\u00e4 siin\u00e4 on my\u00f6s jyrkin oppimisk\u00e4yr\u00e4. Se on my\u00f6s maksullinen IDE, joka saattaa joillekin sammuttaa. Mutta ei se mit\u00e4\u00e4n. K\u00e4sittelemme sit\u00e4 koko t\u00e4m\u00e4n postauksen ajan.<\/p>\n<p>T\u00e4m\u00e4 ei v\u00e4ltt\u00e4m\u00e4tt\u00e4 ole huono asia: Joskus oppimisen arvoisimmat asiat ovat vaikeimpia k\u00e4ytt\u00e4\u00e4. Mutta on olemassa vaihtoehtoja, ja yrit\u00e4n varmistaa, ett\u00e4 kaikki t\u00e4m\u00e4n lukevat ovat samalla sivulla.<\/p>\n<p>Kuten edellisess\u00e4 viestiss\u00e4 <strong><a href=\"https:\/\/wordpress.mediadoma.com\/fi\/wordpress-kehitysympaeristoe-kaeyttaemaellae-paketinhallintaa\/\" title=\"sanoin :\">sanoin :<\/a><\/strong><\/p>\n<blockquote>\n<p>Jos aion kirjoittaa t\u00e4st\u00e4 materiaalista pitk\u00e4\u00e4n, pit\u00e4isik\u00f6 minun olettaa, ett\u00e4 k\u00e4yt\u00e4mme kaikki samaa ymp\u00e4rist\u00f6\u00e4?<\/p>\n<\/blockquote>\n<p>Koska olen erehtynyt kyll\u00e4, niin mielest\u00e4ni on sopivaa valita IDE, jonka uskon toimivan hyvin kenen tahansa kanssa \u2013 vasta oppivista hieman edistyneempiin. Anna <strong><a href=\"https:\/\/code.visualstudio.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Visual Studio Code<\/a><\/strong>.<\/p>\n<h3>Huomautus t\u00e4st\u00e4 IDE:st\u00e4<\/h3>\n<p>Jos olet lukenut t\u00e4t\u00e4 blogia jonkin aikaa (tai olet vasta aloittamassa), huomaat, ett\u00e4 minulla on arkisto t\u00e4m\u00e4n tietyn IDE:n viesteist\u00e4. Jotkut kirjoittamistani viesteist\u00e4 ovat:<\/p>\n<ul>\n<li><a href=\"https:\/\/tommcfarlin.com\/vs-code-wordpress\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Visual Studio Code WordPressin kehitt\u00e4miseen<\/a><\/li>\n<li><strong><a href=\"https:\/\/tommcfarlin.com\/php-codesniffer-in-visual-studio-code\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">PHP CodeSnifferin m\u00e4\u00e4ritt\u00e4minen Visual Studio Codessa<\/a><\/strong><\/li>\n<li><strong><a href=\"https:\/\/tommcfarlin.com\/visual-studio-code-todo\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">TEHT\u00c4V\u00c4T, ARVOSTELUT ja KORJAUKSET<\/a><\/strong> ,<\/li>\n<li>ja niin edelleen.<\/li>\n<\/ul>\n<p>Itse asiassa minulla on koko <strong><a href=\"https:\/\/tommcfarlin.com\/tag\/visual-studio-code\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ruuhka<\/a><\/strong>, jonka voit k\u00e4yd\u00e4 l\u00e4pi. Ongelma: Se on hieman vanhentunut. PhpStormia k\u00e4ytett\u00e4ess\u00e4 Visual Studio Code (tai Code, lyhennettyn\u00e4) on tehnyt merkitt\u00e4vi\u00e4 parannuksia sen j\u00e4lkeen, kun olen sit\u00e4 viimeksi k\u00e4ytt\u00e4nyt.<\/p>\n<p>Osa t\u00e4st\u00e4 materiaalista saattaa kuitenkin kuulostaa turhalta, mutta lopulta se saa meid\u00e4t kaikki samalle sivulle.<\/p>\n<h3>Visual Studio Code<\/h3>\n<p>Ennen kuin aloitat, kannattaa mainita kaksi asiaa:<\/p>\n<ul>\n<li>Miksi Visual Studio Code?<\/li>\n<li>Visual Studio Coden k\u00e4yt\u00f6n aloittaminen<\/li>\n<\/ul>\n<p>J\u00e4lkimm\u00e4inen on v\u00e4h\u00e4n iso aihe, koska se sis\u00e4lt\u00e4\u00e4 useita asennettavia, konfiguroitavia ja m\u00e4\u00e4ritett\u00e4vi\u00e4 asioita, joten k\u00e4sittelen niit\u00e4 alkaen t\u00e4st\u00e4 viestist\u00e4 ja muutamasta uudesta, mutta ainakin on syyt\u00e4 puhua siit\u00e4, miksi Visual Studio Code on vankka IDE WordPressin kehitt\u00e4miseen.<\/p>\n<h3>1 Miksi Visual Studio Code?<\/h3>\n<p>Sen lis\u00e4ksi, ett\u00e4 se on yhteensopiva kaikkien t\u00e4rkeimpien k\u00e4ytt\u00f6j\u00e4rjestelmien kanssa, yksi ensimm\u00e4isist\u00e4 Codessa huomioitavista asioista on se, ett\u00e4 se s\u00e4ilytt\u00e4\u00e4 kopion asetuksistaan \u200b\u200bomassa tiedostossaan, jotta voit aina palata siihen, mutta voit mukauttaa sen omien asetustesi mukaan. .<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-164596-61e768e50ca51.png\" 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-164596-61e768e50ca51.png\" alt=\"IDE WordPressin kehitt\u00e4miseen (kokemuksesta riippumatta)\"><\/a><\/p>\n<p>Lis\u00e4ksi sit\u00e4 kaikkia yll\u00e4pidet\u00e4\u00e4n JSON-tiedostossa, jonka avulla voit mukauttaa sen sopimaan ymp\u00e4rist\u00f6\u00f6n, jossa ty\u00f6skentelet. Ehk\u00e4 se on PHP, ehk\u00e4 se on JavaScript tai ehk\u00e4 se on jotain aivan muuta.<\/p>\n<p>Lis\u00e4ksi asetusten pit\u00e4minen siirrett\u00e4vin\u00e4 tekee niiden jakamisesta helppoa tietokoneiden kesken. T\u00e4m\u00e4 tarkoittaa, ett\u00e4 voit pudottaa tiedoston esimerkiksi Dropbox-kansioon ja saada asetukset viittauksiksi kaikissa koneissasi.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-164596-61e768e9bc315.png\" 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-164596-61e768e9bc315.png\" alt=\"IDE WordPressin kehitt\u00e4miseen (kokemuksesta riippumatta)\"><\/a><\/p>\n<p>T\u00e4m\u00e4 on tietysti hy\u00f6dyllist\u00e4, jos sinulla on vain useita koneita. Ja jos teet niin, saatat haluta, ett\u00e4 kehitysymp\u00e4rist\u00f6t ovat synkronoituja, jotta niiden v\u00e4lill\u00e4 on helppo liikkua.<\/p>\n<h3>2 Visual Studio Coden k\u00e4yt\u00f6n aloittaminen<\/h3>\n<p>IDE:st\u00e4 aloittaminen on helppoa. Kyse on todellakin seuraavista:<\/p>\n<ol>\n<li>Navigoimalla <strong><a href=\"https:\/\/code.visualstudio.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ohjelmiston kotisivulle,<\/a><\/strong><\/li>\n<li>Lataa k\u00e4ytt\u00f6j\u00e4rjestelm\u00e4llesi sopiva versio,<\/li>\n<li>Sitten sen asentaminen.<\/li>\n<\/ol>\n<p>Mutta pelkk\u00e4 sen asentaminen ei riit\u00e4, vai mit\u00e4?<\/p>\n<p>Tarkoitan, ett\u00e4 meid\u00e4n on viel\u00e4 puhuttava ty\u00f6tilojen lis\u00e4\u00e4misest\u00e4 jokaiseen projektiimme, asetusten m\u00e4\u00e4ritt\u00e4misest\u00e4 ja laajennusten asentamisesta, jotka auttavat tekem\u00e4\u00e4n ty\u00f6st\u00e4mme tuottavampia.<\/p>\n<p>Seuraavien viestien aikana aiomme tehd\u00e4 juuri niin. Loppujen lopuksi, jos n\u00e4ist\u00e4 postauksista tulee liian pitki\u00e4, et saa loppup\u00e4iv\u00e4n\u00e4 oikeastaan \u200b\u200bmit\u00e4\u00e4n aikaan \ud83d\ude42.<\/p>\n<h3>Ent\u00e4 laajennukset?<\/h3>\n<p>Muista kuitenkin, ett\u00e4 koska ty\u00f6skentelemme ensisijaisesti WordPressin ja siihen liittyvien ohjelmistojen kanssa t\u00e4ss\u00e4 sarjassa ja tulevassa artikkelissa, meid\u00e4n on varmistettava, ett\u00e4 meill\u00e4 on asennettuna muutamia asioita, jotta voimme hoitaa tekemisemme oikein.<\/p>\n<p>T\u00e4m\u00e4 sis\u00e4lt\u00e4\u00e4 esimerkiksi tukea:<\/p>\n<ul>\n<li><a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=wordpresstoolbox.wordpress-toolbox\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">WordPress<\/a>. Yksi mukavista asioista \u00e4lykk\u00e4\u00e4n IDE:n k\u00e4yt\u00f6ss\u00e4 on, ett\u00e4 se voi tarjota koodin t\u00e4ydennyksen. Useimmat IDE:t tarjoavat yleens\u00e4 PHP:n kaltaisen kielen k\u00e4ytt\u00f6\u00e4. T\u00e4m\u00e4 laajennus lis\u00e4\u00e4 tuen WordPressille.<\/li>\n<li><a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=ikappas.phpcs\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">PSR2-koodausstandardit<\/a>. Vaikka olen joskus ollut WordPress-koodausstandardien fani, olen sittemmin siirtynyt k\u00e4ytt\u00e4m\u00e4\u00e4n <strong><a href=\"https:\/\/www.php-fig.org\/psr\/psr-2\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">PSR<\/a><\/strong> -koodausstandardeja (monista syist\u00e4).<\/li>\n<li><a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=felixfbecker.php-debug\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Virheenkorjaus<\/a>. <strong><a href=\"https:\/\/xdebug.org\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Xdebugin<\/a><\/strong> k\u00e4ytt\u00f6 on v\u00e4ltt\u00e4m\u00e4t\u00f6nt\u00e4, jos haluat p\u00e4\u00e4st\u00e4 l\u00e4pi k\u00e4ytt\u00e4m\u00e4ll\u00e4 koodissasi <strong>echo-<\/strong> ja <strong>var_dump-<\/strong> lauseita. Lis\u00e4ksi se auttaa tutkimaan syvemm\u00e4lle WordPress-l\u00e4hdekoodia mahdollisten ongelmien l\u00e4pik\u00e4ymisess\u00e4.<\/li>\n<li><a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=wayou.vscode-todo-highlight\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">TODO-hallinta<\/a>. Useimmiten koodia kirjoitettaessa on paikkoja, jotka sinun t\u00e4ytyy palata ja tarkistaa, korjata tai yksinkertaisesti tehd\u00e4 ennen kuin julkaiset jotain lavastusta tai tuotantoa. T\u00e4llaisen ty\u00f6kalun k\u00e4ytt\u00e4minen auttaa sinua l\u00f6yt\u00e4m\u00e4\u00e4n ne helposti ennen koodin sitomista l\u00e4hdehallintaan tai sen k\u00e4ytt\u00f6\u00f6nottoa.<\/li>\n<li>Ja enemm\u00e4n.<\/li>\n<\/ul>\n<p>Ilmeisesti yll\u00e4 linkitetyt asiat viev\u00e4t sinut kunkin laajennuksen etusivulle, mutta on mahdollista \u2013 ja todenn\u00e4k\u00f6isesti parempi \u2013 asentaa ne editorin sis\u00e4lt\u00e4, jotta voit hallita niit\u00e4 helpommin.<\/p>\n<p>Muista, ett\u00e4 edellisen viestin tarkoituksena oli saada tapa hallita helposti kaikkia asentamiamme ohjelmistoja. Ja laajennusten asentaminen IDE:n kautta tarjoaa t\u00e4sm\u00e4lleen saman kokemuksen IDE:lle.<\/p>\n<p>Lopuksi, n\u00e4m\u00e4 ovat ne laajennukset, jotka olen havainnut hy\u00f6dyllisiksi WordPressin kanssa ty\u00f6skennelless\u00e4ni.<\/p>\n<h2>Seuraavaksi<\/h2>\n<p>Vaikka olen antanut yhteenvedon monista yll\u00e4 olevista asioista, se ei vaadi syv\u00e4llist\u00e4 sukeltamista joihinkin niist\u00e4 tai siihen, mit\u00e4 on odotettavissa k\u00e4ytett\u00e4ess\u00e4 niit\u00e4.<\/p>\n<p>Lis\u00e4ksi siin\u00e4 ei puhuta tavallisista sarkaimista vs. v\u00e4lily\u00f6nneist\u00e4, mielest\u00e4ni k\u00e4ytt\u00f6kelpoisista fonteista, Sass-lintumisesta, JavaScript-tyylist\u00e4 ja lintingist\u00e4 ja niin edelleen.<\/p>\n<p>Asenna siihen asti Visual Studio Code -koodi ja m\u00e4\u00e4rit\u00e4 se yll\u00e4 linkitettyjen laajennusten avulla. Se on helppo tehd\u00e4 IDE:n sis\u00e4ll\u00e4. Ja jos sinulla on kysytt\u00e4v\u00e4\u00e4, j\u00e4t\u00e4 ne kommentteihin.<\/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>Ilmainen IDE WordPress-kehitykseen, joka on laajennettavissa, tehokas ja jatkuvasti parannettava, mik\u00e4 palvelee meit\u00e4 hyvin.<\/p>\n","protected":false},"author":1,"featured_media":164597,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[834,843,1066,864],"tags":[1166],"class_list":["post-230381","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-opas-aloittelijoille","category-opetusohjelmia","category-tietokone","category-wordpress-5","tag-affiai-fi"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts\/230381","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=230381"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts\/230381\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/media\/164597"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/media?parent=230381"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/categories?post=230381"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/tags?post=230381"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}