Środowisko jsbin.com: Różnice pomiędzy wersjami
(Utworzono nową stronę "Po wejściu na stronę jsbin.com oczom naszym ukazuje się środowisko programistyczne - ekran podzielony na około 3 części (ogólnie od 0 do 5). Typowo po lewej ma...") |
|||
Linia 11: | Linia 11: | ||
Po założeniu konta na githubie (github.com) można zalogować się do jsbina na konto z githuba. Dzięki temu jsbin będzie przechowywał wszystkie nasze programy i pozwoli na większą customizację środowiska (kolory, podświetlanie błędów itd.). Zachęcam. | Po założeniu konta na githubie (github.com) można zalogować się do jsbina na konto z githuba. Dzięki temu jsbin będzie przechowywał wszystkie nasze programy i pozwoli na większą customizację środowiska (kolory, podświetlanie błędów itd.). Zachęcam. | ||
− | Aby móc pisać w p5 musimy podpiąć odpowiednie biblioteki w sekcji HTML | + | Aby móc pisać w p5 musimy podpiąć odpowiednie biblioteki w sekcji HTML pomiędzy np. tagami "body" |
− | + | ||
− | <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/ | + | <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/wersja/p5.min.js"> </script> |
− | <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/ | + | <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/wersja/addons/p5.dom.min.js"> </script> |
− | + | ||
W miejsce słowa <wersja> podajemy numer aktualnej wersji, który podglądamy na stronie https://cdnjs.cloudflare.com [[https://cdnjs.cloudflare.com]] po odszukaniu biblioteki p5. Najprościej w wyszukiwarce wpisać "p5 js cdns" - zazwyczaj pierwszy link prowadzi do najnowszej wersji p5. | W miejsce słowa <wersja> podajemy numer aktualnej wersji, który podglądamy na stronie https://cdnjs.cloudflare.com [[https://cdnjs.cloudflare.com]] po odszukaniu biblioteki p5. Najprościej w wyszukiwarce wpisać "p5 js cdns" - zazwyczaj pierwszy link prowadzi do najnowszej wersji p5. |
Wersja z 11:59, 3 sty 2019
Po wejściu na stronę jsbin.com oczom naszym ukazuje się środowisko programistyczne - ekran podzielony na około 3 części (ogólnie od 0 do 5).
Typowo po lewej mamy szczątkowy kod strony WWW, w której będziemy uruchamiali nasz kod. W tej części podłączamy bibliotekę p5 (patrz niżej) oraz inne, potrzebne nam do pracy. Kolejne elementy edytora to CSS, JavaScript, Console i Output. Do pracy będziemy potrzebowali sekcji JavaScript i Output. Sekcja Console przydaje się do debuggowania i wypisywania testowych komunikatów podczas uruchamiania programu. Niestety konsola nie jest zrobiona najlepiej i nie pokazuje automatycznie palcem gdzie jest błąd, ale przydaje się mimo wszystko.
Odkrywanie/zakrywanie sekcji – klikamy w nazwę w „pasku poleceń” na środku ekranu. Po prawej na górze mamy guzik „Run with JS” i checkbox „Auto-run JS”. Kiedy włączona jest opcja auto-run środowisko jsbin będzie starało się wykonać nasz kod jak tylko będzie on miał sens.
Dwukrotne kliknięcie w niebieski napis Javascript na górze sekcji edytora włącza numerowanie linii.
Po założeniu konta na githubie (github.com) można zalogować się do jsbina na konto z githuba. Dzięki temu jsbin będzie przechowywał wszystkie nasze programy i pozwoli na większą customizację środowiska (kolory, podświetlanie błędów itd.). Zachęcam.
Aby móc pisać w p5 musimy podpiąć odpowiednie biblioteki w sekcji HTML pomiędzy np. tagami "body"
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/wersja/p5.min.js"> </script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/wersja/addons/p5.dom.min.js"> </script>
W miejsce słowa <wersja> podajemy numer aktualnej wersji, który podglądamy na stronie https://cdnjs.cloudflare.com [[1]] po odszukaniu biblioteki p5. Najprościej w wyszukiwarce wpisać "p5 js cdns" - zazwyczaj pierwszy link prowadzi do najnowszej wersji p5.