Przyszłość renderowania w React 🤖
Artykuły
⭐ Uczysz się programować? Nie marnuj swojego czasu! ⭐
Nauka programowania nie jest usłana różami.
Brak postępów w nauce, spadek motywacji, ogrom wiedzy do przyswojenia - to tylko niektóre z problemów, które na Ciebie czekają.
Jak z głową rozplanować swoją naukę i jakich błędów unikać?
Oto kilka porad, które sam chciałbym usłyszeć kilka lat temu, gdy stawiałem swoje pierwsze kroki w kodowaniu 🙏
Przyszłość renderowania w React
Streaming SSR, React 18, Server Components... jak się w tym nie pogubić?
Sposoby renderowania aplikacji ewoluują - warto być na bieżąco :)
Twórca Emotion nie poleca CSS-in-JS
Nie będę ściemniał - nigdy nie byłem fanem podejścia CSS-in-JS.
Ten artykuł to czyste złoto, polecam każdemu, kto miał do czynienia z tą technologią. Co najlepsze, jest od twórców jednego z najpopularniejszych frameworków, które implementują takie podejście
Hot tip
Accessibility & przyciski / linki z samymi ikonami - jak to zrobić dobrze? 🤔
Założę się, że na co dzień spotkacie się z wieloma przyciskami / linkami, które zamiast tekstu mają pojedynczą ikonkę. Przycisk do zamykania modala, wybierania zdjęć / emoji na Messengerze, jest tego masa...
Od strony developmentu jest z nimi jeden, poważny problem. Osoby, które przeglądają nasze strony za pomocą czytników ekranowych, mogą mieć trudności z ich zrozumieniem.
Jeśli w środku <button> zostawimy samą ikonkę, bez dodania odpowiedniej nazwy, to nasz przycisk będzie niedostępny dla screen readerów.
Dwa sposoby jak to ogarnąć:
1. Dodajemy atrybut aria-label do <button>
2. Wstawiamy <span>, ze specjalną klasą "visually-hidden", dzięki temu tekst będzie "widoczny" tylko dla czytników
Stosując jeden z tych sposób, nasz przycisk będzie dostępny dla każdego, zachowując swój oryginalny design ✨
Jak pisać lepsze wiadomości błędów?
Tworząc profesjonalne aplikacje musimy brać pod uwagę sytuacje, w której coś pójdzie nie tak.
Właściwe informowania użytkownika o błędach to klucz do dobrego UX!
Vercel + Accessibility - case study
Vercel, czyli firma odpowiedzialna za Next.js przygotowała bardzo fajne case study na temat dostępności ich nowej strony dla konferencji Next.js Conf.
Super przedstawione, pokazują klilka fajnych sposobów, które przydadzą się w Waszych aplikacjach - polecam w opór :)
Wideo
Szybki React Context z useSyncExternalStore
Performance jest jednym z minusów React Context...
A co jeśli by rozwiązać ten problem? Filmik pokazuje dość innowacyjną metodę tworzenia contextu, bo z wykorzystaniem świeżego hooka useSyncExtenralStore.
Narzędzia
JetBrains Fleet - pogromca VSCode?
Na rynku pojawił się nowy edytor ze stajni JetBrains.
Przez niektórych określany jako "pogromca" VSCode, ponieważ jest to w pełni darmowe narzędzie!
Sprawdzicie, czy zostajecie przy swoich obecnych edytorach? :)
Kontakt
Twój feedback jest dla mnie bardzo wartościowy, dlatego będzie mi mega miło jak dasz znać jak Ci się podobał dzisiejszy mail 🙏🏼
Do usłyszenia!