Cześć, witam cię na kanale The Bugger, ja jestem Mateusz a to jest 1. odcinek kursu programowania w technologii WebGL. Jest to kurs przeznaczony dla programistów, więc wymagam od ciebie na starcie umiejętności programowania wmiarę sprawnie w języku Java Script i znajomości technologii webowych, ale nie wymagam od ciebie znajomości rzeczy związanych z grafiką, bo tego właśnie będziemy się tutaj uczyć.

Co będzie w tym kursie: będą przede wszystkim:

• podstawowe zagadnienia związane z samą grafiką 3D, jak np. co to są siatki, co to są tekstury, jak się tworzy materiały itd.
• podstawy matematyki i geometrii które są niestety niezbędne takie jak np. co to są wektory, operacje na wektorach
• implementacja tego wszystkiego w Javascripcie

A więc co to jest WebGL? Jest to API dostępne z poziomu przeglądarki. Jest dostępne w języku Java Script. Wszyscy myślą, że umożliwia ono wyświetlanie grafiki 3D, co nie do końca jest prawdą, bo tak naprawdę daje nam tylko dostęp do GPU (karty graficznej), przy czym aby wyświetlić grafikę 3D musimy sami zadbać o obliczenia geometryczne itd.

Dlatego uprościmy sobie sprawę i skorzystamy z biblioteki. Taką biblioteką jest Three.js. Jest to biblioteka open source, dostępna na GitHubie. Ma 63 tys gwiazdek na GitHubie, więc patrząc na wszystkie biblioteki Javascriptowe, które są na GitHubie, jest na 8. miejscu, zaraz za Node.js, przed Material-UI. Jest to biblioteka dostępna na licencji MIT, więc można ją spokojnie wykorzystywać do celów komercyjnych.

Na swoim GitHubie przygotowałem demko. Można sobie ściągnąć to repozytorium. Jest to standardowy projekt na Webpacku, więc z konsoli wykonujemy najpierw yarn install, nastepnie yarn start, i na http://localhost:8080/ mamy kręcący się sześcian.