Moje wesołe zdjęcie
Cześć! Jestem Bartek i witam Cię na moim blogu!
Piszę tutaj głównie o JavaScript i React ale pojawiają się też wpisy na temat innych obszarów frontendu. Więcej o mnie tutaj.

Wszystkie wpisy

react-1 Created with Sketch.

Kurs "Podstawy React" jest już dostępny!
Zapraszam do sprawdzenia mojej oferty.

Sprawdź
  • Miniaturka obrazka do posta

    Dzisiejszym wpisem zakończymy serię o Server Side Rendering w React. W zasadzie to po poprzednich 4 wpisach wiesz już wszystko by stworzyć swoją pierwszą aplikację izomorficzną React. Postanowiłem jednak, że pokażę Ci jeszcze pewną alternatywę do tego, co zostało dotychczas pokazane. Istnieje bowiem coś takiego, jak Next.js, czyli specjalny framework pozwalający w łatwy sposób stworzyć aplikację React, która “z pudełka” posiada obsługę renderowania po stronie serwera!

  • Miniaturka obrazka do posta

    Dziś będzie krótko! Bardzo prawdopodobne, że już o tym słyszałeś - sam publikowałem tę informację u siebie na Twitterze - ale zostało opublikowane bardzo ciekawe zestawienie najpopularniejszych projektów świata JavaScript znajdujących się na GitHubie. Myślę, że warto się z nim zapoznać - kto wie, może nie słyszałeś, o którymś z tych projektów, a bardzo by Ci się on przydał?

    Na jakiej podstawie stwierdzono, które projekty są najpopularniejsze? Po prostu policzono ile nowych “gwiazdek” zyskały poszczególne z nich w przeciągu ostatnich 12 miesięcy. Oprócz ogólnego zestawienia mamy też podział na frameworki front-endowe, frameworki node.js i kilka innych kategorii.

    A który JavaScriptowy projekt zyskał w zeszłym roku największą popularność? Otóż okazuje się, że Vue.js (+40.0 tys. “gwiazdek”)! Na drugim miejscu React (+27.8 tys. “gwiazdek”), a na trzecim create-react-app (+22.5 tys. “gwiazdek”). To pokazuje, że z jednej strony “hype” na Vue wciąż trwa - i dobrze bo to świetna biblioteka. Z drugiej strony, zestawienie pokazuje też, że najsilniejszym obecnie “ekosystemem” dysponuje React - sporo bibliotek z czołówki zestawienia jest z nim związanych (wspomniany create-react-app na drugim miejscu, a do tego takie projekty jak np. Next.js czy Redux). Co ciekawe, Angular znalazł się dopiero na 18 miejscu zestawienia…

    Na koniec linki - moim zdaniem warto zajrzeć:

  • Miniaturka obrazka do posta

    Ostatnio dało się odczuć trochę mniejszą moją aktywność na blogu ale to nie znaczy, że z nim kończę (zresztą pisałem już o tym nieco w poście noworocznym). Mam przecież rozpoczętą serię o Server Side Rendering w React… A skoro, podobno, mężczyznę poznaje się nie po tym jak zaczyna ale jak kończy, to wydaje mi się, że moim obowiązkiem jest dokończyć to co zacząłem! Dlatego też dziś przedstawiam czwartą cześć moich wpisów na temat SSR, w której pokażę, jak zaprząc do działania bibliotekę react-router zarówno po stronie klienta jak i serwera. Zapraszam do lektury!

  • Miniaturka obrazka do posta

    Jak pewnie zauważyłeś, w grudniu jakoś tak wyszło, że zrobiłem sobie przerwę od blogowania. Po części jest to wynik tego, że więcej czasu poświęcam na pracę (biorę udział w ciekawym start-upie, więc jest co robić). Do tego doszedł chyba pewien kryzys twórczy… Stąd też dziś krótki wpis noworoczny, którym wpisuję się w ogólny trend robienia blogowych podsumowań roku minionego i przedstawiania planów na przyszłość!

  • Miniaturka obrazka do posta

    W ostatnim, dosyć długim wpisie pokazałem jak skonfigurować Server Side Rendering w React w oparciu o framework ExpressJS po stronie serwera. To jednak nie wszystko - podstawowy zestaw narzędzi używanych w większości aplikacji React, zawiera też przecież bardzo często bibliotekę Redux… Dlatego też dziś, rozszerzę przedstawiony tydzień temu przykład o wsparcie dla tej biblioteki. Jak sam się przekonasz, nie jest to nic trudnego!

  • Miniaturka obrazka do posta

    Ostatnio, we wstępie do serii na temat Server Side Renderingu w React, opowiedziałem co nieco czym jest aplikacja izomorficzna/uniwersalna. W poście tym przedstawiłem też kilka zalet oraz wad tego podejścia. Dziś natomiast przejdziemy do rzeczy. Zajmiemy się bowiem praktyczną stroną tego zagadnienia - skonfigurujemy uniwersalną aplikację React przy użyciu frameworka ExpressJS po stronie serwera!

  • Miniaturka obrazka do posta

    Server Side Rendering w React to temat, do napisania którego zabierałem się już od dość dawna… W dobie rozbudowanych aplikacji internetowych typu SPA rozwiązanie to sprawdza się znakomicie i nie mogę pozwolić sobie na jego pominięcie na moim blogu! Ogólnie tematyka ta jest szeroka, postanowiłem więc podzielić to zagadnienie na mniejsze części i zrobić z tego serię. Z dzisiejszego wpisu dowiesz się więc, co to jest aplikacja izomorficzna/uniwersalna, czym jest Server Side Rendering oraz jakie są jego największe zalety. W kolejnych postach przedstawię natomiast różne sposoby konfiguracji tego podejścia w Twojej aplikacji.

  • Miniaturka obrazka do posta

    Będąc programistą trzeba nieustanie trzymać rękę na pulsie, śledzić nowości i cały czas poszerzać swoją wiedzę. Nie jest to łatwe, szczególnie w świecie front-endu, gdzie (podobno) codziennie wypuszczany jest jeden nowy framework oraz dziesięć nowych bibliotek. Jak to wszystko ogarnąć? Postaram się odpowiedzieć na to pytanie w dzisiejszym wpisie… albo raczej pokazać Ci jak ja do tego podchodzę.

  • Miniaturka obrazka do posta

    Zgodnie z obietnicą z poprzedniego wpisu tej serii, dziś przedstawię drugą część na temat migracji mojego bloga z Wordpressa do Jekylla. Jej tematem będzie deployment do Heroku czyli hostowanie bloga w chmurze. Ogólnie nie jest to nic specjalnie skomplikowanego - zresztą sam się zaraz przekonasz. Zapraszam do lektury!

  • Miniaturka obrazka do posta

    Dziś krótko! Właśnie pojawiła się nowa wersja Reacta oznaczona numerem wersji: 16.0.0! Na pewno zdążyłeś już gdzieś przeczytać, że w wersji tej następuje bardzo istotna zmiana dotycząca licencji - wszystkie media społecznościowe o tym trąbiły… Fakt, ta nowość na pewno wiele osób ucieszyła, bo skończą się wreszcie te wszystkie dyskusje na temat patentów. Niemniej jednak, wprowadzona właśnie wersja Reacta przynosi ze sobą więcej nowości, o których na pewno warto przeczytać!

    Na końcu tego artykułu znajdziesz linka do oficjalnego komunikatu Facebooka w tej sprawie. Natomiast, jeśli nie chce Ci się go czytać, to masz tutaj ode mnie krótką ściągawkę z jego zawartości:

    • zwracanie tablic i ciągów znaków z metody render - nie trzeba będzie wreszcie otaczać elementu dodatkowym “wrapperem”
    • lepsza obsługa błędów - mniejsza podatność na zawieszenie się aplikacji w przypadku wystąpieniu wyjątku
    • portale - renderowanie children wewnątrz elementu DOM, który jest poza hierarchią DOM rodzica
    • poprawa Server Side Renderingu - renderowanie na serwerze zostało napisane od nowa, więcej w tym artykule
    • wsparcie dla własnych atrybutów DOM - głównie zmiana wydajnościowa
    • redukcja rozmiaru plików modułów react, react-dom - zmniejszono ich rozmiar o 32%
    • przejście na licencję MIT - o tym już na pewno wiesz!
    • nowa “core’owa” architektura o nazwie “Fiber” - zmiany są spore (pod spodem), a więcej przeczytasz tutaj

    W skrócie to tyle! Zachęcam jednak do samodzielnego zapoznania się z artykułem na temat Reacta w wersji 16.0:

    React v16.0 - wpis na blogu Facebooka na temat Reacta