Przyjrzyjmy się natywnym hookom w Reakcie i zastanówmy się czy i kiedy warto je używać. Czym są i jak używać takie hooki jak: useLayoutEffect, useDeferredValue, useTransition, czy useReducer
Po pierwszym roku pracy w zawodzie na chwilę spoglądam wstecz, by uświadomić sobie, co dała mi praca i jak dzięki niej się rozwinąłem. Jest to wiedza, która różni się od wiedzy zdobytej podczas bycia developerem Wannabe. Diametralnie.
Po konfiguracji prostego SPA za pomocą Webpacka przechodzimy do stylowania z wykorzystaniem tego bundlera. Zobacz, jak sonfigurować projekt, tak by css i sass budował nam się w locie.
Myślałeś kiedyś o tym jak działa CRA czy rozwiązania Single Page Application under the hood? W kolejnym wpisie z serii o Webpacku, skonfigurujemy go do imitacji zachowania Create React App. Konfiguracja Webpacka od zera z wyjaśnieniem poszczególnych kroków.
Webpack, czyli prawdopodobnie najpopularniejszy bundler na rynku, służy do transpilacji kodu i plików źródłowych do postaci jednej, gotowej produkcyjnie paczki. We współczesnym frontendzie trudno by było tworzyć zaawansowane aplikacje webowe bez bundlerów. Omówmy zatem ich temat na przykładzie Webpacka.
Świat wypracował kilka różnych sposobów renderowania stron i serwowania ich dla użytkownika. Końcowym rezultatem jest strona internetowa wyrenderowana przez "czytanie" przez przeglądarkę kodu złożonego z trzech języków: HTML, CSS i JS. To, jak możemy to osiągnąć, zależy tylko od nas
HackYeah to największy coroczny hackathon w Europie organizowany przez polskie firmy IT. W tym roku odbywał się w trybie zdalnym i stacjonarnym. Rok 2021 kończę udziałem w programowaniu na czas w katowickim spodku. Przeczytaj, jakie mam wrażenia i co wiąże się z uczestnictwem w wydarzeniu, takim jak hackathon.
Intersection Observer to natywne API JavaScript, dzięki któremu można osiągnąć wiele przydatnych rozwiązań. To na nim oparte jest wiele bibliotek służących do optymalizacji strony.
Ekosystem Node i React jest ogromny. Na rynku do dyspozycji programistów dostępna jest masa gotowych już rozwiązań i bibliotek, które śmiało można wykorzystywać w projektach. Dziś użyjemy je, by stawić czoła dość popularnemu przypadkowi kodowemu na froncie, jakim jest infinite scrolling.
Dostępność to najczęściej niedoceniany i pomijany aspekt tworzenia stron internetowych. Czym jest i dlaczego accessibility jest w dzisiejszym świecie webdevelopmentu szalenie istotne?
TypeScript istnieje na rynku już ładnych parę lat, jednak to w ostatnich dwóch latach zyskał największą popularność. Nie ma się czemu dziwić, bo TS wprowadza wiele zalet do pisania kodu opartym na czystym Javascripcie.
Dziś chciałbym podzielić się dość osobistymi przemyśleniami. Opowiem, jak wyglądały moje poczynania w ostatnich kilku miesiącach i jak udało mi się znaleźć w jednym z najlepszych software housów w Polsce
Za każdym razem, gdy uczymy się czegoś nowego, wkraczamy w chaos, który musimy zwalczyć, by był porządek. Porządek w głowie, dzięki któremu wszystko, co było kiedyś trudne, staje się łatwe.
Przyjrzyjmy się prawdopodbnie najważniejszym konstrukcjom języka javascript w pracy frontendowca, które mnie oraz wielu innym frontendowcom spędziły sen z powiek. Porozmawiajmy o obietnicach, fetchach, async await oraz starszym XMLHttpRequest. Wszystko w pigułce.
Operator nullowego scalania, opcjonalnego dostępu, czy nullowego przypisania. Operatory te są przykładami nowych konstruckji składniowych w javascript. Sprawdźmy czym się charakteryzują nowe operatory i w jakich sytuacjach mogą być przydatne.
Operatorów w JavaScript jest mnóstwo, a nadal wychodzą co nowsze i bardziej nowoczesne, stanowiące lukier składniowy do starszych konstrukcji. Przeczytaj o takich operatorach jak: ternary operator, OR, END, czy double negation.
Typy danych w javascript dzielą się na typy prymitywne (proste) oraz złożone. Przyjrzyjmy się im bliżej.
Praca z api, requestami, wymianą danych z serwerem jest integralną częścią codziennej pracy frontend developera. Z tego względu postanowiłem napisać wpis o mechanizmie CORS, który podczas nauki potrafi wprowadzić w zakłopotanie.
Struktura plików jest istotnym elementem współczesnego budowania aplikacji internetowych. Warto zadbać o przejrzystość naszych plików i uporządkować je tak, aby powrót do nich po czasie sprawiał jak najmniejsze problemy. Dzięki temu ciężej będzie również pogubić się w tworzeniu kodu.
Ostatnio napisałem dość przydatną funkcję, którą fajnie by było się podzielić. Dodajmy więc ją do rejestru npm, tak by każdy programista mógł skorzystać z jej dobroci
Sam JavaScript nie posiada tego typu funkcji ani zdarzeń, a kiedy w sieci szukałem gotowego kodu do obsługi javascriptowych zdarzeń typu swipe, niczego fajnego nie znalazłem. Postanowiłem więc, że napiszę własne rozwiązanie
Zmienne w kaskadowych arkuszach stylów to bardzo przydatne narzędzie w pracy nad projektem, jak również integracji stylów z JavaScriptem. Przyjrzyjmy się im bliżej.
CSS shorthands to skróty stanowiące sposób na zaoszczędzenie dużej ilości czasu podczas pisania stylów. Pod warunkiem, że ich konstrukcje znamy na pamięć. Dziś chciałbym przedstawić większość obecnych w kaskadowych arkuszach stylów shorthandów (skrótów).
Nauka programowania to ciężka i żmudna rzecz. By osiągnąć w nim profesjonalizm, trzeba poświęcić setki - a może nawet - tysiące godzin czasu na klikanie w klawiaturę. Mimo to, zawód programista oznacza naukę przez całe życie. Jak więc robić to dobrze?
Początkujący programista często natrafia na swej drodze na przeszkody w postaci nie tylko zagadnień technicznych, ale też w samym podejściu do nauki programowania. Z jakimi problemami natury miękkiej się mierzymy oraz co się wiąże z wypaleniem do nauki dla początkujących programistów?
Hooki jako natywne API Reacta znacząco odmieniło podejście do tego frameworka. Zyskał on na piękności oraz sprawił, że nie potrzebujemy już używać komponentów klasowych. Jednym z najczęściej używanych hooków jest useEffect, czyli funkcja odpowiadająca w dużej mierze za operacje w cyklu życia komponentu. Z useEffect jednak wiążą się pewne smaczki. Jakie?
Podczas nauki Reacta często natrafiałem na przeszkody w postaci smaczków, których się nie spodziewałem. Jednym z nich były referencje do elementów JSX. Wyjaśniam dlaczego tradycyjne refy nie działają na komponentach funkcyjnych i jak je przekazać do innych komponentów.
Pisząc na co dzień w tym edytorze nie przejmujemy się ewentualną utratą danych, jakimi są nasze ustawienia. A jako, że o dane trzeba dbać, to zajmijmy się ich zabezpieczeniem.
Git dla początkujących może wydawać się zbędnym narzędziem do nauki na samym starcie. Nic bardziej mylnego. Pomijając fakt, że gita wymaga prawie każdy pracodawca na rynku, to narzędzie to daje ogromne korzyści. Jakie?
By zaoszczędzić trochę czasu programistom stawiającym swoje pierwsze kroki w Reakcie, chciałbym przedstawić sposoby importowania plików oraz grafik svg w projekcie reactowym. Zapraszam serdecznie
React i create-react-app to dwie odmienne frazy, a o fakcie tym developerzy są świadomi. Używają tych terminów zamiennie. Wyjaśniam z czego to wynika
Wyróżniamy 5 głównych typów dependencji w menadżerach pakietów, takich jak yarn lub npm. Zapraszam do omówienia ich wszystkich, dogłębnie i szczegółowo
Praca z menadżerem pakietów npm oraz zrozumienie, jak działa cały ekosystem zarządzania pakietami w projekcie, sprawiały mi, jako początkującemu programiście, dość duże problemy. Mam nadzieję, że po przeczytaniu tego tekstu, nikt nie pójdzie moją drogą.
"Node.js to środowisko uruchomieniowe języka JavaScript oparte na silniku V8 przeglądarki Chrome" - taką definicję możemy przeczytać na oficjalnej stronie Node. W mojej opinii, jest to hasło, które nie mówi zbyt dużo początkującym developerom. Dziś chciałbym rozwiać ich wątpliwości. Zapraszam do lektury.
Jest wiele powodów, dlaczego blogowanie jest dobre i daje dużo korzyści. Paradoksalnie, nie gra tu największej roli odbiór i jak najliczniejsza baza czytelników, ani tym bardziej korzyści majątkowe. Wręcz przeciwnie - przyczyny startu mojej kariery bloggera leżą na całkowicie innych płaszczyznach. Jakich?
Jak każda strona w sieci, reactywny.pl musi posiadać swój hosting, domenę, ewentualnie bazę danych. W przypadku tego bloga, strona korzysta z większej liczby zależności. W tym poście chciałbym przedstawić funkcjonowanie bloga od strony technologicznej i mój sposób działania w prowadzeniu serwisu. Na jakie rozwiązania postawiłem?