Jeśli tak jak ja uwielbiasz znajdować małe perełki w katalogu NPM, aby usprawnić proces programowania, dzisiaj jest Twój szczęśliwy dzień.

Rozpoczynam nową serię artykułów, w których zaprezentuję kilka małych i mniej znanych bibliotek, które znalazłem i z których korzystam na co dzień, a które oszczędzą Ci niejednego bólu głowy.

A więc zacznijmy!

1. Urlcat

Urlcat to niewielka biblioteka JavaScript, która sprawia, że ​​tworzenie adresów URL jest bardzo wygodne i zapobiega typowym błędom.

Tak, możesz użyć interfejsu API URL do zbudowania adresów URL. Ale nadal będziesz musiał zadbać o pewne szczegóły dla siebie, zamiast po prostu budować adres URL.

Dlatego kocham tę bibliotekę. To po prostu „plug-and-play”. Nie musisz uczyć się skomplikowanych wzorców ani spędzać godzin na dokumentacji.

Więc nie wahaj się spróbować: https://github.com/balazsbotond/urlcat.

2. Użyj Hooks-ts

Jeśli jesteś programistą React, używasz haków (mam nadzieję). W takim przypadku prawdopodobnie wiele razy będziesz musiał stworzyć niestandardowy haczyk do bardzo małych rzeczy. Na przykład do obsługi trybu ciemnego. Lub dla zdarzenia zmiany rozmiaru okna. Lub wiele innych przypadków.

UseHooks to mała biblioteka z dobrze zakodowanymi, dobrze udokumentowanymi i w pełni wpisanymi (dla użytkowników TypeScript) hakami do wszystkich małych przypadków, dzięki czemu możesz skupić się na samym projekcie.

Możesz to sprawdzić tutaj: https://github.com/juliencrn/usehooks-ts.

3. Logt

Lubię mieć logi wszędzie, więc jeśli zajdzie potrzeba sprawdzenia, co się dzieje, mogę je sprawdzić.

A kiedy koduję interfejs, chcę też mieć te dzienniki. Ale z pewnymi wymaganiami:

  • Musi być w całości napisany (aby móc go używać w maszynopisie bez żadnych problemów)
  • Musi być mały
  • Musi mieć kolorowe etykiety (aby szybko poznać typ dziennika)
  • Musi mieć poziomy dziennika
  • Musi istnieć jakiś sposób na ukrycie niektórych dzienników zgodnie z warunkami (np. czy jest to wersja produkcyjna, czy nie)
  • Musi istnieć możliwość wysłania tych logów gdzie indziej (np. do Sentry)

Po długim czasie spędzonym na szukaniu informacji (i prawie rozpoczęciu pisania własnego) znalazłem Logta, który spełnia wszystkie moje wymagania i jeszcze kilka innych.

W 100% zalecane! https://github.com/sidhantpanda/logt

4. Ładowalne komponenty

Jeśli próbujesz zoptymalizować swoją aplikację React, prawdopodobnie używasz React.lazy i Suspense do leniwego ładowania komponentów.

W porządku.

Ale są jeszcze lepsze sposoby! Na przykład ta biblioteka. Oczywiście w tym artykule nie mogę podać pełnego wyjaśnienia, dlaczego powinieneś przejść z React.lazy na tę bibliotekę, ale możesz sprawdzić ten post autora.

Zasadniczo kilka kluczowych rzeczy to obsługa SSR (renderowanie po stronie serwera), dzielenie bibliotek, a nawet pełny dynamiczny import mocny>. Nieźle, co?

I najlepsze. Jest naprawdę łatwy w użyciu. Prawie plug-and-play. Więc spróbuj! https://github.com/gregberge/loadable-components

5. Emoji Mart

Pracując nad różnymi projektami,zawsze mam do czynienia z emoji. Jest to coś, czego używa się obecnie wszędzie. Zwykle muszę dodać do projektu komponent selektora emoji.

To nie jest skomplikowane. Ale potem zaczynasz otrzymywać więcej wymagań: musi leniwo ładować emoji, musi obsługiwać internacjonalizację, musi umożliwiać wyszukiwanie, musi zezwól na użycie tego samego tekstu zapytania co Slack…

A to wymaga czasu. Mogę to zrobić. Ale klienci zazwyczaj wolą, żebym skupił się na samym projekcie. Więc… znalazłem tę małą bibliotekę. Piękny i użyteczny.

Pozwól, że ci pokażę, Emoji Mart! https://github.com/missive/emoji-mart

Jeśli jesteś podobny do mnie, uwielbiasz znajdować tego rodzaju małe i przydatne biblioteki, łatwe w użyciu i idealne do integracji z Twoimi projektami. Więc nie martw się. Mam już dużą listę, którą chcę się podzielić. To pierwsze 5 z tej serii. Koniecznie obserwuj mnie, a wkrótce otrzymasz powiadomienie, gdy opublikuję kolejne!

W międzyczasie…

🌎 Połączmy się!

Więcej treści na PlainEnglish.io. Zapisz się na nasz „bezpłatny cotygodniowy biuletyn”. Śledź nas na Twitterze, LinkedIn, YouTube i Discord . Interesujesz się Growth hackingiem? Sprawdź Obwód.