Firma JDI poszukuje dewelopera, który będzie w stanie przepisać stronę z React na Next.js z pełną migracją funkcjonalności, projekt długoterminowy od 4-6 miesięcy z miesięcznym wynagrodzeniem od 40 000 do 60 000 UAH w zależności od Twojej wiedzy i doświadczenia.
Wymagane umiejętności techniczne:
Next.js i React
- Doświadczenie z Next.js 14+ (App Router)
- Komponenty serwerowe i komponenty klienckie
- Akcje serwerowe i obsługa tras
- Praca z trasami API i middleware
- Optymalizacja: ISR, SSG, SSR
- Optymalizacja obrazów i zasoby statyczne
- Routing i nawigacja
TypeScript
- Doświadczenie z TypeScript 5+
- Typowanie komponentów, API, stanu
- Generics i typy pomocnicze
- Praca z typowaniem zewnętrznych bibliotek
Aby uzyskać pracę, będziesz musiał wykonać to zadanie techniczne:
## Zadanie testowe
Demonstracja pracy z komponentami serwerowymi i komponentami klienckimi
Stworzyć prosty projekt Next.js (App Router), który demonstruje pracę z komponentami serwerowymi i komponentami klienckimi.
Wymagania:
1. Komponent serwerowy:
- Stworzyć komponent serwerowy, który pobiera dane z API lub bazy danych
- Pokazać pracę z async/await w komponencie serwerowym
- Użyć komponentu serwerowego do renderowania statycznej treści
2. Komponent kliencki:
- Stworzyć komponent kliencki z interaktywnością (na przykład formularz z walidacją lub interaktywną listę)
- Pokazać użycie hooków React (useState, useEffect)
- Zademonstrować obsługę zdarzeń użytkownika
3. Integracja:
- Pokazać, jak komponent serwerowy przekazuje dane do komponentu klienckiego
- Zademonstrować poprawne rozdzielenie między komponentami serwerowymi a klienckimi
- Użyć dyrektywy "use client" tam, gdzie to konieczne
4. Dodatkowe wymagania:
- Użyć TypeScript z poprawnym typowaniem
- Dodać podstawową stylizację (CSS Modules lub Tailwind CSS)
- Pokazać obsługę błędów i stany ładowania
Przykład struktury:
app/
page.tsx (Komponent serwerowy - strona główna)
components/
ProductList.tsx (Komponent serwerowy - pobiera dane)
ProductCard.tsx (Komponent kliencki - interaktywna karta)
AddToCartButton.tsx (Komponent kliencki - przycisk z logiką)
Oczekiwany wynik:
- Działający projekt Next.js z minimalną funkcjonalnością
- Wyraźne rozdzielenie między komponentami serwerowymi a klienckimi
- Komentarze w kodzie wyjaśniające wybór między komponentem serwerowym a klienckim
- README z opisem architektury i uzasadnieniem decyzji
Czas na wykonanie: 2-4 godziny
Kryteria oceny:
- Poprawne użycie komponentów serwerowych/klienckich
- Jakość kodu i typowanie