Główna zawartość
Kurs: Programowanie > Rozdział 4
Lekcja 8: Zaawansowanie narzędzia dla deweloperówKorzystanie z ProcessingJs poza Khan Academy
Mamy tu całkiem przyjemne środowisko deweloperskie - aktualizacje kodu są w czasie rzeczywistym i daje pomocne informacje o błędach w kodzie. Posiada poznane wcześniej narzędzie do przesuwania liczb i narzędzie do wybierania kolorów. Nasze tutejsze środowisko jest zaprojektowane z myślą o nowych programistach -- mamy ich tysiące każdego dnia i chcemy im ułatwić naukę JavaScript.
Po zapoznaniu się z JavaScript i rozpoczęciu tworzenia dłuższych i bardziej złożonych programów możesz zechcieć w swoim środowisku programistycznym innych funkcjonalności. Może nie chcesz aktualizacji w czasie rzeczywistym, albo będziesz chciał rozłożyć swój program na wiele plików albo połączyć jego używanie z systemem kontroli wersji. Albo po prostu będziesz chciał móc osadzić twój program ProcessingJS na swojej stronie internetowej.
W takim przypadku rozważ rozwijanie swoich programów ProcessingJS poza Khan Academy. Nie możesz po prostu skopiować i wkleić kod swojego programu do pliku na lokalnym komputerze i zobaczyć działający program. Czemu nie?
ProcessingJS jest biblioteką zbudowaną na szczycie stosu technologii internetowych. Kiedy programujesz w nim na Khan Academy, to w zasadzie my, za kulisami tworzymy stronę internetową (plik HTML). Przyczepiamy do niego etykietę w postaci tagu html
<canvas>, wczytujemy bibliotekę JavaScript ProcessingJS a później uruchamiany kod twojego programu.Oznacza to, że jeśli chcesz pracować nad swoim programem poza Khan Academy, musisz stworzyć plik HTML który robi dokładnie to co my robimy.
Tu jest przykład od którego możesz zacząć:
Ten przykład jest zbudowany przy użyciu naszego środowiska do tworzenia stron internetowych. Możesz wkleić jego zawartość do pliku HTML lub każdego innego edytora stron internetowych.
Jeśli wkleisz swój kod programu do tego szablonu, może się okazać, że wszystko działa idealnie i wtedy będziesz skakać z radości! (Skacz z trampoliny, jeśli jesteś na basenie).
Jeśli coś nie całkiem działa poprawnie to pewnie dlatego, że szablon nie używa tej samej wersji ProcessingJS, której używamy w Khan Academy. Nasza wersja jest zaprojektowana specjalnie na użytek wewnątrz Khan Academy, więc gdy programujesz poza KA zalecamy korzystać z oficjalnej biblioteki ProcessingJS
Istnieje kilka istotnych różnic między naszym ProcessingJS i oficjalnym:
- KA używa metody
mouseIsPressedzamiastmousePressed, dla globalnej wartości logicznej. Podobnie KA używakeyIsPressedzamiastkeyPressed. To oznacza, że musisz zmienićmouseIsPressedikeyIsPressed, kiedy wklejasz kod swojego programu do szablonu. - KA domyślnie korzysta ze stopni do wszystkich parametrów związanych z kątami, zamiast radianów. Jeśli używasz stopni do kątów, możesz zamienić je na radiany korzystając z metody
radians(). - KA do zdjęć i dźwięków używa metod
getImage()igetSound(). Metody te nie istnieją w oficjalnej wersji. Możesz skorzystać zPImagedo zdjęć, ale by odtworzyć dźwięk musisz samemu stworzyć tag HMTL<audio>.
Oficjalna wersja ma także szerszy zakres funkcji, takich jak praca z obrazami i szersze możliwości operowania obiektami 3D. Odkryj wszystkie możliwości biblioteki sprawdzając w oficjalnej dokumentacji.
Oczywiście nadal chcielibyśmy zobaczyć programy które tworzysz poza Khan Academy, więc mam nadzieję, że podzielisz się nimi, gdy skończysz. Czy poprzez konwersję do naszej wersji ProcessingJS czy poprzez podzielenie się nimi na naszym środowisku tworzenia stron internetowych.
W dalszym ciągu opowiem nieco więcej o lokalnych środowiskach deweloperskich i narzędziach do debugowania.
Chcesz dołączyć do dyskusji?
Informacje o tym, jak uruchamiać kod poza KA powinny być na samym początku każdego kursu. Brakuje mi (a może nie znalazłem) informacji o różnicach pomiędzy różnymi wersjami JS. Głownie pod względem zastosowań i tego jak bardzo różni się składnia.(2 głosy)