{"id":228648,"date":"2022-10-29T17:51:00","date_gmt":"2022-10-29T14:51:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=228648"},"modified":"2022-11-09T03:32:20","modified_gmt":"2022-11-09T00:32:20","slug":"homebrew-node-i-gulp-dla-rozwoju-wordpress","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/homebrew-node-i-gulp-dla-rozwoju-wordpress\/","title":{"rendered":"Homebrew, Node i Gulp dla rozwoju WordPress"},"content":{"rendered":"\n<p>Chocia\u017c mam zestaw narz\u0119dzi, kt\u00f3re wol\u0119 u\u017cywa\u0107 w projektach, nad kt\u00f3rymi pracuj\u0119 od podstaw, natura pracy kontraktowej polega na tym, \u017ce nie zawsze mo\u017cesz z nich korzysta\u0107.<\/p>\n<p>Zamiast tego musisz pracowa\u0107 przy u\u017cyciu narz\u0119dzi dostarczonych przez klienta, kt\u00f3re zwykle wchodz\u0105 w gr\u0119, gdy dziedziczysz projekt od poprzedniego programisty.<\/p>\n<p>\u017beby by\u0142o jasne, nie przeszkadza to w wyborze narz\u0119dzi. Nie mam tu ani tam stanowiska w tej sprawie. Zamiast tego uwa\u017cam, \u017ce wa\u017cne jest, aby wiedzie\u0107, jak \u0142atwo rozpocz\u0105\u0107 korzystanie z niekt\u00f3rych z tych narz\u0119dzi.<\/p>\n<p>Na przyk\u0142ad pracowali\u015bmy nad projektem, kt\u00f3ry wymaga Gulpa, kt\u00f3ry z kolei wymaga Node, kt\u00f3ry mo\u017cna \u0142atwo zainstalowa\u0107 za pomoc\u0105 Homebrew. To du\u017co krok\u00f3w, \u017ceby si\u0119 cofn\u0105\u0107, prawda?<\/p>\n<p>Rozpocz\u0119cie pracy z <a href=\"https:\/\/brew.sh\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Homebrew<\/a>, <a href=\"https:\/\/nodejs.org\/en\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Node<\/a> i <a href=\"http:\/\/gulpjs.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Gulp<\/a> w programowaniu WordPress jest do\u015b\u0107 \u0142atwe. Przedstawi\u0142em poni\u017csze kroki i zrobi\u0142em, co mog\u0119, aby wyja\u015bni\u0107, co robi ka\u017cdy pakiet, aby\u015b wiedzia\u0142, co instalujesz i co robisz, je\u015bli lub kiedy napotkasz taki projekt.<\/p>\n<h2>Homebrew, Node i Gulp<\/h2>\n<p>Dla tych, kt\u00f3rzy maj\u0105 pewne poj\u0119cie o tym, czym s\u0105 Gulp i Node, prawdopodobnie widzieli\u015bcie sposoby na ich instalacj\u0119 na sw\u00f3j spos\u00f3b. Je\u015bli to dzia\u0142a dla Ciebie i masz \u015bwietn\u0105 konfiguracj\u0119, to dobrze jest i\u015b\u0107 i nie martwi\u0119 si\u0119 zbytnio o reszt\u0119 tego postu.<\/p>\n<p>Je\u015bli z drugiej strony jeste\u015b w tym zupe\u0142nie nowy, to jest to proces, kt\u00f3ry stosuj\u0119 podczas pracy z tego typu konfiguracj\u0105.<\/p>\n<p>Ale pami\u0119taj: chocia\u017c przechodz\u0119 przez trzy programy do zainstalowania, ka\u017cdy z nich mo\u017cna zainstalowa\u0107 na sw\u00f3j spos\u00f3b, ale instalowanie ich za pomoc\u0105 pakietu takiego jak Homebrew zapewnia r\u00f3wnie\u017c czysty spos\u00f3b na zainstalowanie innego oprogramowania w ten sam spos\u00f3b.<\/p>\n<p>Najpierw zajm\u0119 si\u0119 Homebrew, potem zajm\u0119 si\u0119 Node i Gulp. A wi\u0119c zaczynamy: Homebrew, Node i Gulp, wszystko dla rozwoju WordPressa.<\/p>\n<h3>1 piwo domowe<\/h3>\n<p>Kr\u00f3tko m\u00f3wi\u0105c, Homebrew to mened\u017cer pakiet\u00f3w dzia\u0142aj\u0105cy na macOS. Pozwala nam \u0142atwo instalowa\u0107 i odinstalowywa\u0107 oprogramowanie z wiersza polece\u0144.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-167315-61e7a19c4bf8e.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-167315-61e7a19c4bf8e.png\" alt=\"Homebrew, Node i Gulp dla rozwoju WordPress\" ><\/a><\/p>\n<p>Strona g\u0142\u00f3wna Homebrew<\/p>\n<p>Mened\u017cer pakiet\u00f3w pozwala nam \u0142atwo zainstalowa\u0107 i zarz\u0105dza\u0107 ogromn\u0105 ilo\u015bci\u0105 oprogramowania, z kt\u00f3rego wiele jest przydatnych dla programist\u00f3w.<\/p>\n<p>Strona g\u0142\u00f3wna twierdzi:<\/p>\n<blockquote>\n<p>Homebrew instaluje potrzebne rzeczy, kt\u00f3rych Apple nie zrobi\u0142.<\/p>\n<\/blockquote>\n<p>Ale \u017ceby zobaczy\u0107, co mam na my\u015bli, sp\u00f3jrz na <a href=\"https:\/\/github.com\/Homebrew\/homebrew-core\/tree\/master\/Formula\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">repozytorium<\/a>. Jest ogromny, prawda? W tym po\u015bcie skupiam si\u0119 tylko na instalacji Node.<\/p>\n<p>Zdecydowa\u0142em si\u0119 na w\u0142\u0105czenie tej informacji do Homebrew przed zainstalowaniem pozosta\u0142ych pakiet\u00f3w, poniewa\u017c uwa\u017cam, \u017ce warto to zbada\u0107, je\u015bli nigdy wcze\u015bniej nie pr\u00f3bowa\u0142e\u015b.<\/p>\n<h3>2 w\u0119z\u0142y<\/h3>\n<p>Aby zainstalowa\u0107 Gulp, musisz zainstalowa\u0107 node, kt\u00f3ry jest \u015brodowiskiem wykonawczym JavaScript, na kt\u00f3rym zbudowany jest Gulp. Tak, oferuje wiele innych funkcji, ale to wszystko wykracza poza zakres tego postu.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-167315-61e7a1a4a32c2.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-167315-61e7a1a4a32c2.png\" alt=\"Homebrew, Node i Gulp dla rozwoju WordPress\" ><\/a><\/p>\n<p>Strona g\u0142\u00f3wna w\u0119z\u0142a<\/p>\n<p>Strona g\u0142\u00f3wna twierdzi:<\/p>\n<blockquote>\n<p>Ekosystem pakiet\u00f3w Node.js, npm, to najwi\u0119kszy ekosystem bibliotek open source na \u015bwiecie.<\/p>\n<\/blockquote>\n<p>Mo\u017cesz te\u017c przeszukiwa\u0107 wszystkie pakiety dost\u0119pne <a href=\"https:\/\/www.npmjs.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">na stronie g\u0142\u00f3wnej NPM<\/a>. Proste wyszukiwanie has\u0142a \u201egulp&quot; da prawie 10 000 wynik\u00f3w pakiet\u00f3w, kt\u00f3re mog\u0105 wsp\u00f3\u0142pracowa\u0107 z mechanizmem uruchamiania zada\u0144 (niekt\u00f3re z nich robi\u0105 to samo, ale masz pomys\u0142).<\/p>\n<h3>3 \u0141yki<\/h3>\n<p>Wreszcie, Gulp to prosty program uruchamiaj\u0105cy zadania z wiersza polece\u0144, kt\u00f3ry pozwala zautomatyzowa\u0107 wiele r\u00f3\u017cnych rzeczy w procesie rozwoju. Jako jeden z przyk\u0142ad\u00f3w, ma pakiet, kt\u00f3ry b\u0119dzie <a href=\"https:\/\/www.npmjs.com\/package\/gulp-sass\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ogl\u0105da\u0142 pliki Sass,<\/a> transpilowa\u0142 i \u0142\u0105czy\u0142 je przy ka\u017cdym zapisie pliku.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-167315-61e7a1ab085e4.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-167315-61e7a1ab085e4.png\" alt=\"Homebrew, Node i Gulp dla rozwoju WordPress\" ><\/a><\/p>\n<p>Strona g\u0142\u00f3wna Gulp<\/p>\n<p>Kr\u00f3tko m\u00f3wi\u0105c:<\/p>\n<blockquote>\n<p>gulp to zestaw narz\u0119dzi do automatyzacji bolesnych lub czasoch\u0142onnych zada\u0144 w przep\u0142ywie pracy programistycznej, dzi\u0119ki czemu mo\u017cesz przesta\u0107 si\u0119 bawi\u0107 i co\u015b zbudowa\u0107.<\/p>\n<\/blockquote>\n<p>Poprzez tak zwany plik gulp musisz do\u0142\u0105czy\u0107 szereg zale\u017cno\u015bci \u2013 takich jak te, kt\u00f3re pozwalaj\u0105 na transpilacj\u0119 i \u0142\u0105czenie plik\u00f3w CSS \u2013 a nast\u0119pnie automatycznie zrobi\u0107 to w razie potrzeby.<\/p>\n<p>Ale to nie koniec: mo\u017cesz te\u017c pracowa\u0107 z obrazami, szablonami, plikami minifikacyjnymi, plikami lintowymi <a href=\"https:\/\/github.com\/gulpjs\/gulp\/tree\/master\/docs\/recipes\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">i tak dalej<\/a>.<\/p>\n<h2>Instalowanie Homebrew, Node i Gulp<\/h2>\n<p>Wszystko to jest wprowadzeniem do oprogramowania, ale jak mo\u017cemy to wszystko zainstalowa\u0107 w naszym systemie?<\/p>\n<p>Najpierw zainstaluj homebrew. Aby to zrobi\u0107, uruchom Terminal i wprowad\u017a nast\u0119puj\u0105ce polecenie:<\/p>\n<pre><code>$ \/usr\/bin\/ruby -e \"$(curl -fsSL https:\/\/raw.githubusercontent.com\/Homebrew\/install\/master\/install)\"<\/code><\/pre>\n<p>Je\u015bli to wygl\u0105da troch\u0119 dziwnie, po prostu wiedz, \u017ce u\u017cywa cURL i zainstalowanego pliku wykonywalnego Ruby, aby pobra\u0107 pakiet Homebrew i zainstalowa\u0107 go w swoim systemie.<\/p>\n<p>Nast\u0119pnie zainstaluj Node. Po zainstalowaniu Homebrew jest to \u0142atwe. Wystarczy wpisa\u0107 nast\u0119puj\u0105ce polecenie:<\/p>\n<pre><code>$\u00a0brew <\/code><\/pre>\n<p>\u0141atwe, prawda? I na koniec konieczne jest zainstalowanie Gulpa, i to s\u0105 wymagane pakiety. B\u0119dzie to zale\u017ca\u0142o od twojego projektu, ale do projektu, kt\u00f3ry mam, potrzebuj\u0119:<\/p>\n<ul>\n<li><a href=\"https:\/\/www.npmjs.com\/package\/gulp\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">\u0142yk<\/a><\/li>\n<li><a href=\"https:\/\/www.npmjs.com\/package\/gulp-cli\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">\u0142yk-cli<\/a><\/li>\n<li><a href=\"https:\/\/www.npmjs.com\/package\/gulp-sass\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">prze\u0142ykaj-sass<\/a><\/li>\n<li><a href=\"https:\/\/www.npmjs.com\/package\/gulp-watch\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">\u0142yk-obserwuj<\/a><\/li>\n<\/ul>\n<p>Mo\u017cesz ich potrzebowa\u0107 lub nie, wi\u0119c przedstawi\u0119 tutaj, jak zainstalowa\u0107 zale\u017cno\u015bci gulp i gulp-sass przy u\u017cyciu Node. Wpisz w terminalu:<\/p>\n<pre><code>$ npm install gulp\n$ npm install gulp-sass<\/code><\/pre>\n<p>Nast\u0119pnie wpisz:<\/p>\n<pre><code>$ gulp sass:watch<\/code><\/pre>\n<p>To zainstaluje niezb\u0119dne zale\u017cno\u015bci, a nast\u0119pnie powie Gulpowi, aby obserwowa\u0142 modyfikacje twoich plik\u00f3w Sass. Opiera si\u0119 r\u00f3wnie\u017c na pomy\u015ble, \u017ce masz ju\u017c zdefiniowany plik Gulp.<\/p>\n<p>Je\u015bli nie, musisz sam go stworzy\u0107. Na szcz\u0119\u015bcie <a href=\"https:\/\/github.com\/gulpjs\/gulp\/tree\/master\/docs\/recipes\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">dost\u0119pnych jest wiele przepis\u00f3w<\/a>.<\/p>\n<h2>Inne zasoby<\/h2>\n<p>Jak wida\u0107, jest to do\u015b\u0107 proste, ale program uruchamiaj\u0105cy zadania dotyczy twojego \u015brodowiska. Zalecam przeczytanie dokumentacji dla ka\u017cdego z powy\u017cszych pakiet\u00f3w, aby uzyska\u0107 g\u0142\u0119bsze zrozumienie ni\u017c kr\u00f3tki opis, kt\u00f3ry poda\u0142em:<\/p>\n<ul>\n<li><a href=\"http:\/\/docs.brew.sh\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Dokumentacja Homebrew<\/a><\/li>\n<li><a href=\"https:\/\/nodejs.org\/api\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Interfejs API w\u0119z\u0142a<\/a><\/li>\n<li><a href=\"https:\/\/github.com\/gulpjs\/gulp\/blob\/master\/docs\/README.md\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Dokumentacja prze\u0142yku<\/a><\/li>\n<\/ul>\n<p>I pami\u0119taj: nie zast\u0105pi to \u017cadnych narz\u0119dzi ani przep\u0142ywu pracy, kt\u00f3re ju\u017c masz. Zamiast tego ma pokaza\u0107, jak zainstalowa\u0107 zestaw narz\u0119dzi, kt\u00f3rych mo\u017ce potrzebowa\u0107 dziedziczony projekt. A je\u015bli to nie Gulp, mo\u017ce to <a href=\"https:\/\/gruntjs.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Grunt<\/a> lub jaki\u015b inny biegacz. Chodzi o to, \u017ce jest na to proces.<\/p>\n<p>Tym, kt\u00f3rzy interesuj\u0105 si\u0119 konkretnie Homebrew (kt\u00f3ry jest podstaw\u0105 wszystkiego powy\u017cej), polecam r\u00f3wnie\u017c przeczytanie postu <a href=\"https:\/\/twitter.com\/twigpress\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Carla Alexandra na temat<\/a> <a href=\"https:\/\/carlalexander.ca\/2016-macbook-pro-setup\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">jego aktualnej konfiguracji<\/a>. Ma dzia\u0142 w ca\u0142o\u015bci po\u015bwi\u0119cony Homebrew, dlaczego go u\u017cywa i nie tylko.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\u0179r\u00f3d\u0142o nagrywania:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/tommcfarlin.com\" class=\"external external_icon\">tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Rozpocz\u0119cie pracy z Homebrew, Node i Gulp w programowaniu WordPress jest do\u015b\u0107 \u0142atwe. Opisa\u0142em i wyja\u015bni\u0142em kroki w tym po\u015bcie.<\/p>\n","protected":false},"author":1,"featured_media":223785,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[721,919,897,866],"tags":[1169],"class_list":["post-228648","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-deweloper","category-inny","category-kod","category-wordpress-7","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/228648","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/comments?post=228648"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/228648\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/223785"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=228648"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=228648"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=228648"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}