Animacje – setInterval() vs requestAnimationFrame()

Tym razem zajmiemy się animacjami w JS. Porównamy sobie rozwiązania wykorzystujące setInterval() oraz requestAnimationFrame(). Postaram się przedstawić zalety tego drugiego rozwiązania i wyjaśnić na jakie zasadzie ono działa.

Struktura strony w HTML5

HTML5 przyniósł nam ze sobą nowe znaczniki, które lepiej definiują semantykę naszej strony. Postaram się w tym wpisie opisać znaczenie tych najbardziej popularnych (<header/>, <footer/>, <nav/>, <article/>, <section/>, <aside/>) i przedstawić ich sposób użycia w różnych przypadkach.

Pseudo-elementy (before, after) i JavaScript

Pseudo-elementy w CSS są bardzo użytecznym narzędziem, który pozwala uzupełnić listę dzieci o pierwszy i ostatni element selektora. Dla wspomnianych elementów możemy definiować dowolne reguły CSS (więc mogą być typu inline lub block itp.), co pozwala nam osiągnąć niezwykle ciekawe efekty. Poniżej zamieszczam prosty przykład użycia pseudo-elementów before i after.

GIT – system kontroli wersji, wprowadzenie

Jak czytamy na wikipedii GIT to rozproszony system kontroli wersji (jeden z wielu) udostępniany na licencji GNU GPL w wersji 2. Jednak sama definicja nie wiele mówi. Postaram się przybliżyć w tym wpisie czym jest GIT, jakie korzyści płyną z korzystania z niego oraz opis podstawowych komend, bez których korzystanie z tego systemu kontroli wersji będzie niemożliwe.

Node.js – wprowadzenie

Node.js jest środowiskiem, w którym możemy uruchomić aplikacje JavaScript. Oznacza to, że teraz nasz kod JS uruchomimy nie tylko za pomocą przeglądarki internetowej, ale również bez niej. Node.js używa silnika V8, który został napisany przez firmę Google i zaimplementowany w jego przeglądarkę internetową tj. Chrome. Platforma ta powstała w 2009r., a jej twórcą jest Ryan Dahl.

Implementacja metody .sort() w JavaScript

W poprzednim wpisie opisywałem zasadę działania metody .sort(). Teraz nadszedł czas na przemyślenia dotyczące samej implementacji. Postaram się pokazać w jaki sposób silnik JavaScript implementuje funkcje .sort(). To jeszcze lepiej pozwoli nam zrozumieć na jakiej zasadzie działa sortowanie elementów tablicy w JS.

Metoda .sort() w JavaScript jako wprowadzenie do programowania funkcyjnego

Wpis ten ma za zadanie wyjaśnić zasadę działania funkcji sortującej, która jest dostępna dla obiektu Array. Pozwala ona sortować dowolne elementy dodane do tablicy. Wszystko dzięki przekazywanej jako parametr funkcji, która definiuje nam co chcemy ze sobą porównać. Takie rozwiązanie (funkcja jako parametr) jest stosowane w programowaniu funkcyjnym, które staje się bardzo popularne.

Wyśrodkowanie Google Maps na podstawie pozycji markerów

Korzystając z Google Maps dodajemy do niej zazwyczaj więcej niż jeden marker (punkt na mapie). Następnie chcemy, aby nasza mapa była wyśrodkowana względem tych wszystkich punktów. Na szczęście nie musimy obliczać tego sami. Google udostępnia nam narzędzie „bounds”. Jak z niego skorzystać dowiesz się z tego wpisu.

slideUp w Vanilla JS

jQuery posiada w swojej bibliotece bardzo dużo przydatnych animacji. Ja w tym wpisie postaram się przedstawić rozwiązanie napisane w czystym JS, które przedstawi jak napisać funkcję slideUp() znaną z jQuery, która zmniejsza wysokość elementu do zera w zadanym odstępie czasu. 

JSONP – sposób na obejście Same-origin policy

Nazwa JSONP  pochodzi od JSON with Padding. Jest to rozwiązanie pozwalające obejść zabezpieczenie Same-origin policy (SOP). Opiera się ono na wyjątku, w którym zewnętrze zasoby możemy  załadować przez znacznik <script/>.