{"id":1343,"date":"2018-02-28T22:21:36","date_gmt":"2018-02-28T21:21:36","guid":{"rendered":"http:\/\/yarogniew.net\/arduino\/?page_id=1343"},"modified":"2018-05-11T19:20:37","modified_gmt":"2018-05-11T17:20:37","slug":"instalacja-p5-js","status":"publish","type":"page","link":"https:\/\/arduino.net.pl\/index.php\/javascript\/instalacja-p5-js\/","title":{"rendered":"Instalacja P5.js"},"content":{"rendered":"<p>\u22a5\u0179r\u00f3d\u0142o:\u00a0<a href=\"https:\/\/www.youtube.com\/watch?v=HZ4D3wDRaec&amp;list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA&amp;index=2\">1.2: p5.js Workflow &#8211; p5.js Tutorial<\/a><\/p>\n<h4>Krok pierwszy: instalowanie p5-manager<\/h4>\n<ol>\n<li><em>Instalujemy Node.js ze strony<\/em>\u00a0<a href=\"https:\/\/nodejs.org\/en\/\" target=\"_blank\" rel=\"noopener\">https:\/\/nodejs.org\/en\/<\/a><\/li>\n<li><span style=\"text-indent: 0em;\"><strong>$ sudo npm install p5-manager -g<\/strong>\u00a0<\/span><span style=\"text-indent: 0em;\"><span style=\"text-indent: 0em;\">Password:<br \/>\nnpm WARN deprecated babel-preset-es2015@6.24.1: &#x1f64c; Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io\/env to update!<br \/>\n\/usr\/local\/bin\/p5 -&gt; \/usr\/local\/lib\/node_modules\/p5-manager\/bin\/p5-manager.js<\/span><\/span>&gt; fsevents@1.1.3 install \/usr\/local\/lib\/node_modules\/p5-manager\/node_modules\/fsevents<br \/>\n&gt; node install[fsevents] Success: &#8222;\/usr\/local\/lib\/node_modules\/p5-manager\/node_modules\/fsevents\/lib\/binding\/Release\/node-v57-darwin-x64\/fse.node&#8221; already installed<br \/>\nPass &#8211;update-binary to reinstall or &#8211;build-from-source to recompile<br \/>\n+ p5-manager@0.4.2<br \/>\nadded 440 packages in 13.828s<br \/>\nMac-mini-Jarogniew:~ yarogni7ew$<\/li>\n<li><strong>$ p5<\/strong><br \/>\np5-manager version 0.4.2<br \/>\nMac-mini-Jarogniew:~ yarogni7ew$<\/li>\n<li><strong>$ pwd<\/strong> \u00a0<em>[print working directory,\u00a0informacja gdzie na komputerze znajduje si\u0119 folder roboczy]<\/em><br \/>\n\/Users\/yarogni7ew<br \/>\nMac-mini-Jarogniew:~ yarogni7ew$<\/li>\n<li><strong>$ cd Desktop\/\u00a0<\/strong><br \/>\nMac-mini-Jarogniew:Desktop yarogni7ew$\u00a0pwd<br \/>\n\/Users\/yarogni7ew\/Desktop<br \/>\nMac-mini-Jarogniew:Desktop yarogni7ew$<\/li>\n<li><strong>$ p5 generate -b p5js_testowy<\/strong><br \/>\np5-manager version 0.4.2<br \/>\ncreate : p5js_testowy<br \/>\ncreate : p5js_testowy\/sketch.js<br \/>\ncreate : p5js_testowy\/index.html<br \/>\ncreate : p5js_testowy\/libraries<br \/>\ncreate : p5js_testowy\/libraries\/p5.js<br \/>\ncreate : p5js_testowy\/libraries\/p5.sound.js<br \/>\ncreate : p5js_testowy\/libraries\/p5.dom.js<br \/>\nMac-mini-Jarogniew:Desktop yarogni7ew$<\/li>\n<\/ol>\n<h4>Krok drugi: instalowanie edytora<\/h4>\n<ol>\n<li>\u015aci\u0105gamy ze strony\u00a0<a href=\"https:\/\/atom.io\">https:\/\/atom.io<\/a>\u00a0edytor i instalujemy go<\/li>\n<li>Otwieramy nasz folder:\u00a0<strong>p5js_testowy<\/strong><\/li>\n<li>Dokonujemy ma\u0142ej zmiany, ja doda\u0142em \u0142adniejsz\u0105 ziele\u0144\u00a0\u2192 background(120, 255, 120);\n<pre class=\"brush: plain; light: false; title: Kod:; toolbar: true; notranslate\" title=\"Kod:\">function setup() {\r\n\tcreateCanvas(windowWidth, windowHeight);\r\n}\r\n\r\nfunction draw() {\r\n\r\n\tbackground(120, 255, 120);\r\n\r\n}<\/pre>\n<\/li>\n<li>Zapisujemy! <strong>cmd-S<br \/>\n<\/strong><\/li>\n<li>Klikamy w index.html i w przegl\u0105darce otwiera si\u0119 zielone okno z adresem:\u00a0file:\/\/\/Users\/yarogni7ew\/Desktop\/p5js_testowy\/index.html<\/li>\n<\/ol>\n<h4>Krok trzeci: instalowanie edytora<\/h4>\n<p>W edytorze <strong>ATOM<\/strong> wchodzimy w <em>Preferences&#8230;\u00a0\u21d2 +Install\u00a0\u21d2 atom-live-server<\/em><br \/>\nPo instalacji wchodzimy w zak\u0142adk\u0119 <em>Packages\u00a0\u21d2\u00a0atom-live-server\u00a0\u21d2 Start server (ctrl-alt-L)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u22a5\u0179r\u00f3d\u0142o:\u00a01.2: p5.js Workflow &#8211; p5.js Tutorial Krok pierwszy: instalowanie p5-manager Instalujemy Node.js ze strony\u00a0https:\/\/nodejs.org\/en\/ $ sudo npm install p5-manager -g\u00a0Password: npm WARN deprecated babel-preset-es2015@6.24.1: &#x1f64c; Thanks for using Babel: we&#8230;<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":1327,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-1343","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/pages\/1343","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/comments?post=1343"}],"version-history":[{"count":6,"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/pages\/1343\/revisions"}],"predecessor-version":[{"id":1350,"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/pages\/1343\/revisions\/1350"}],"up":[{"embeddable":true,"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/pages\/1327"}],"wp:attachment":[{"href":"https:\/\/arduino.net.pl\/index.php\/wp-json\/wp\/v2\/media?parent=1343"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}