Jump to content

Inne Rekomendacje

Zdajemy sobie sprawę z tego, że biblioteki które zawiera Create T3 App nie są lekarstwem na wszystko. Polecamy zaczynać projekty z rzeczami, które są już dołączone - przyjdzie jednak czas, kiedy będziesz musiał dodać swoje paczki. Tylko ty wiesz, czego twój projekt potrzebuje. Polecamy przejrzeć jednak poniższą listę naszych rekomendacji.

Są to rekomendacje pojedynczych kontrybutorów i nie powinny być postrzegane jako “oficjalne” sposoby na rowiązywanie danych problemów od zespołu Create T3 App czy też T3-OSS. Zrób swój research, szczególnie zanim skorzystasz z płatnych usług.

State Management

Informacja: Biblioteki do state managementu mogą być niezłe, jednak często nie są one potrzebne. Hooki od tRPC (a dokładniej od React Query) powinny być w stanie zarządzać statem od strony serwera. W przypadku state’a klienta, zacznij od hooka useState oferowanego przez Reacta i skorzystaj z poniższych opcji jeśli będziesz potrzebować czegoś więcej.

Zustand

Aby nigdy więcej nie używać Reduxa

“Nowoczesny, prosty Redux”, o którym nie wiedziałeś, że go potrzebujesz. Poimandresowi zawsze można zaufać. Zbudować możesz wszystko, począwszy od aplikacji do rozmów wideo a skończywszy na grach czy też serwerach.

Jotai

Aby nigdy więcej nie używać kontekstu

Przy bardziej “niepodzielnym” podejściu, ciężko jest pobić Jotai. Także wykonana przez Poimandres, Jotai pozwala ci definiować singletony które sprawiają wrażenie, jakby były globalnym hookiem useState. Świetna opcja do zachowań wymagających zachowania ze statem i takich, które jeszcze nie potrzebują maszyny state’a.

Biblioteki Komponentów

Wiele aplikacji wymaga tej samej garści komponentów - przełączników, dropdownów czy też modali. Biblioteki te zaopatrzą cię w znakomite i przystępne komponenty, z których możesz korzystać, i które możesz dostosowywać jak tylko chcesz.

Biblioteki Komponentów Bez Narzuconych Stylów

Znane także jako biblioteki “headless”, zapoatrzą cię w znakomite, przystępne komponenty bez narzuconych stylów, które będziesz mógł dostosować jak tylko chcesz. Tu znajdziesz kilka rekomendacji.

  • Radix UI zaopatrzy cię w olbrzymi zestaw praktycznych i przystępnych prymitywów, które będziesz mógł dostosować do swoich potrzeb z czystym CSSem lub Tailwind CSS.

  • Headless UI wykonane przez zespół stojący za Tailwind CSS, przekazuje ci przystępne komponenty bez narzuconych stylów, które bezproblemowo integrują się z Tailwind CSS.

  • React Aria zaopatrzy cię w przystępne prymitywy do UI dla twojego design systemu.

Biblioteki Komponentów Z Gotowymi Stylami

W przypadku, kiedy chcesz żeby twoja aplikacja wyglądała OK

Czasem budując projekt, chcesz aby Ui wyglądało po prostu przyzwoicie. Do projektów takich jak panele administratora i podobnych, każda z tych bibliotek da sobie doskonale radę.

Class Variance Authority

Gdy budujesz własną bibliotekę UI

Zbuduj bibliotekę UI z różnymi kolorami, rozmiarami, wariantami itp. Gdy twój projekt osiągnie skalę na tyle dużą, że będziesz musiał skorzystać z ustandaryzowanego zestawu komponentów z wieloma wariantami (korzystając przy tym z Tailwind CSS), CVA stanie się doskonałym narzędziem.

Animacje

Rekomendacje na sytuacje, kiedy w aplikacji potrzebować będziesz animacji :)

AutoAnimate

Aby animacje były pojedynczą linią kodu

Wiele bibliotek od animacji stara się rozwiązać każdy możliwy problem, stając się przy tym uciężałe i niezbyt praktyczne. AutoAnimate to narzędzie niewymagające konfiguracji, które pozwoli ci uzyskać znaczącą poprawę w UX twojej aplikacji bez dodatkowego wysiłku.

Framer Motion

Złożone animacje z deklaratywnym kodem

Framer Motion pozwala Ci w prosty sposób i z deklaratywną składnią napisać mało kodu, a w zamian zaopatrzy twoją aplikację w złożone animacje, czy nawet reakcje na gesty.

Wdrażanie, Infrastruktura, Bazy Danych i CI

Vercel

Aby zhostować swoją aplikację

Vercel zamienił prawdziwe piekło deploymentu aplikacji w łatwą integrację z GitHubem. Przeskalowaliśmy się do setek tysięcy użytkowników bez problemu. Napędzany przez AWS, o wiele lepszy interfejs :)

PlanetScale

Bazy danych bez obaw

PlanetScale to najlepsza platforma “serverless” do baz danych, z której kiedykolwiek korzystaliśmy. Znakomicie się skaluje, dostarcza świetny DX, zawiera doskonałe ceny. Jeżeli korzystasz z SQLa (i miejmy nadzieję z Prismy), ciężko jest tą usługę pobić.

Railway

Aby hostować swoją infrastrukturę

“Nowoczesne Heroku”. Najłatwiejszy sposób aby uzyskać prawdziwy działający serwer. Jeżeli Vercel i PlanetScale nie są dla Ciebie wystarczające, prawdopodobnie Railway będzie. Połącz go z repozytorium GitHuba i gotowe.

Upstash

Redis dla aplikacji “serverless”

Kochamy Prismę i PlanetScale, ale niektóre projekty wymagają bardziej wydajnego rozwiązania. Upstash pozwala na prędkość bliską tej przy bezpośrednim odczycie z pamięci w twoim projekcie “serverless”, przy tym nie obciążając Cię zarządzaniem infrastruktury i skalowania.

Pusher

WebSockety “serverless”

Jeżeli WebSockety stanowią główną część projektu, możesz chcieć rozważyć bardziej tradycyjny backend taki jak Fastify (który również działa z tRPC!). Jesli jednak chcesz szybko dodać WebSockety do aplikacji T3, Pusher to doskonały wybór.

Soketi

Soketi to prosta w użyciu alternatywa do Pushera, którą hostuje się samemu. Jest w pełni kompatybilna z SDK Pushera, z którego możesz korzystać, aby połączyć się z serwerem. Wersja “serverless” Soketi jest w becie.

Statystyki Stron (Analytics)

Budując aplikację, dane użytkowników są bardzo cenne. Znajdziesz tu parę serwisów do ich zbierania, które polecamy.

Plausible

Potrzebujesz zbierać statystyki? Plausible to jedna z najszybszych opcji aby to zrobić. Bardzo minimalna. Posiada nawet prosty plugin dla Next.js.

Umami

Umami to prosta w użyciu, open-source, szybka i skupiająca się na prywatności alternatywa dla Google Analytics, którą hostuje się samemu. Możesz go zdeploy’ować dzięki serwisom, takim jak Vercel, Railway itp., korzystając przy tym z PlanetScale jako bazy danych.

Inne

Next Bundle Analyzer

Określenie co znajdzie się w finalnym buildzie aplikacji może czasem stanowić problem. Next Bundle Analyzer to łatwy sposób na wizualizację i analizę kodu JavaScript, który zostaje wygenerowany.