devpebe.com | blog frontendowy
Hoisting to kolejny z podstawowych terminów w JavaScript. Znajomość tego zagadnienia często wymagana jest procesu rekrutacyjnego i pomaga w zrozumieniu działania kodu JavaScript. Czym jest hoisting? Hoisting (windowanie) mówi o tym jak działa JavaScript. W języku JavaScript podczas wykonywania kodu wszystkie deklaracje zmiennych oraz funkcji „przenoszone są na początek”,
Domknięcia to jeden z podstawowych mechanizmów działania JavaScript. Zobacz czym są domknięcia.
Efekt fali w CSS przedstawiony w artykule jest kreatywny i prosty w wykonaniu. Do animacji wykorzystałem tylko CSS! Jak zrobić efekt fali? Wystarczy kilka linijek kodu :). Kod HTML Kod CSS (SCSS) Jak działa powyższy kod Animacja opiera się na zwykłych divach z tłem oraz zaokrąglonymi rogami (border-radius), które obracają
Dokumentacje komponentów UI stają się standardem w pracy front-end dewelopera. W artykule przedstawiam jak stworzyć dokumentację za pomocą Storybooka.
Kilka linijek kodu CSS, który doda piękny efekt gradientowego tekstu do strony internetowej.
a – frontmana – frontman
Cześć! Przyszedł czas na spięcie wszystkich modułów razem. Na koniec dzisiejszego wpisu otrzymasz aplikację spełniającą podstawowe wymagania… Artykuł Podstawy rxjs! pochodzi z serwisu a - frontman.
a – frontman
Wykorzystanie Angular Material Table w prostym przykładzie. Artykuł Praca z tablicami. Tabele w angularze. pochodzi z serwisu a - frontman.
a – frontman
Cześć! Pora postawić kolejny krok w naszej aplikacji. Dzisiaj zobaczysz moją propozycję implementacji modułu bazy danych. Oczywiście… Artykuł #start_angular zarządzanie danymi. Wstrzykiwanie interfejsów pochodzi z serwisu a - frontman.
a – frontman
Przykład wykrozystania ReactiveForms w angularze. Artykuł Formularze w angularze. Wykorzystanie ReactiveForms pochodzi z serwisu a - frontman.
a – frontman
Opis modelu danych reprezentujących wymagania biznesowe. Artykuł Pierwsze kroki w projekcie. Tworzymy model danych. pochodzi z serwisu a - frontman.
Kody, triki, sztuczki
Jest to najprostszy sposób na dodanie InPost do sklepu - Woocommerce. Nie użyjemy tutaj żadnego dedykowanego pluginu. Przykład ten dodaje jedynie pole gdzie możemy wybrać, czy wyszukać nasz paczkomat. Dodamy te dane do zamówienia ale ich nie przeliczymy. Informacje o paczkomacie pojawiają się również w zamówieniu oraz mailu który jest
Dlaczego ciekawy zapytacie, a no dla tego że z zachowaniem hierarchii zaznaczania elementów. Zaczynamy od html, prosta budowa więc nie ma co tłumaczyć. Zwykłe UL a w nim następne UL 😉 Oczywiście mozliwość zagnieżdżenia wielu ul. <ul> <li><a href="#">onion, chopped</a> <ul> <li><a href="#">tomato, chopped</a></li> <li><a href="#">cloves garlic, chopped, or more
Dzisiaj będzie o stylowaniu radio oraz checkbox butonów. Przykład jest w połączeniu z przekreślaniem treści, przydało się ostatnio w budowaniu składników przepisów. Zacznę od html, są to dwa formularze z butonami po kliknięciu których wstawimy w h3 te opcje (value) które zaznaczyliśmy. Poniżej skrócona wersja html, zaś na samym końcu
Mała odskocznia i trochę styli na wieczór. Dzisiaj prosty przykład użycia text-shadow. Zaczynamy oczywiście od prostego html. Na podstawie klasy 'add-shadow' pobieramy tekst i każdą literę owijamy w span <div class="content"> <h1 class="add-shadow">Frontend development</h1> </div> Teraz przejdźmy do styli. Najlepszym wyborem będzie wąska czcionka i oczywiście musi być pogrubiona. Importujemy
Jakiś czas temu przygotowałem zbór przykładów użycia leaflet z mapami OSM. Jeżeli ktoś ma jakieś propozycje co można by jeszcze tam umieścić to poproszę podać w komentarzach. Całe repo znajduje się pod tym adresem - leaflet-examples
overment
Closure w JavaScript występuje niemal na każdym kroku i daje ogromne możliwości. Z tego powodu często pojawia się w rozmowach rekrutacyjnych. I nawet pomimo tego często sprawia wiele problemów nawet doświadczonym programistom. W tym filmie wyjaśnię: 👉 Czym jest closure? 👉 Kilka istotnych definicji (np. funkcje jako First-Class Objects)
Tworzenie prostych gier to świetny sposób nauki programowania. Dlatego w tym filmie pokażę w jaki sposób możemy stworzyć grę Snake, wykorzystując programowanie funkcyjne (a raczej jego podstawy) w JavaScript z pomocą biblioteki Ramda.js. Wykorzystamy tutaj techniki omówione w serii o Programowaniu Funkcyjnym (https://www.youtube.com/playlist?list=PLjHmWifVUNMLR1Oz3WYK7XRLEY5LvSOPu), dlatego jeżeli ten materiał jest dla Ciebie