The JDI company is looking for a developer who can rewrite the website from React to Next.js with a complete migration of functionality. The project is long-term, lasting from 4-6 months, with a monthly payment ranging from 40,000 to 60,000 UAH depending on your knowledge and experience.
Mandatory technical skills:
Next.js and React
- Experience with Next.js 14+ (App Router)
- Server Components and Client Components
- Server Actions and Route Handlers
- Working with API Routes and middleware
- Optimization: ISR, SSG, SSR
- Image Optimization and static assets
- Routing and navigation
TypeScript
- Experience with TypeScript 5+
- Typing of components, API, state
- Generics and utility types
- Working with typing of external libraries
To get the job, you will need to complete this technical task:
## Test Task
Demonstration of working with Server Components and Client Components
Create a simple Next.js project (App Router) that demonstrates working with Server Components and Client Components.
Requirements:
1. Server Component:
- Create a Server Component that fetches data from an API or database
- Show the use of async/await in the Server Component
- Use the Server Component to render static content
2. Client Component:
- Create a Client Component with interactivity (for example, a form with validation or an interactive list)
- Show the use of React hooks (useState, useEffect)
- Demonstrate user event handling
3. Integration:
- Show how the Server Component passes data to the Client Component
- Demonstrate proper separation between Server and Client Components
- Use the "use client" directive where necessary
4. Additional Requirements:
- Use TypeScript with proper typing
- Add basic styling (CSS Modules or Tailwind CSS)
- Show error handling and loading states
Example Structure:
app/
page.tsx (Server Component - main page)
components/
ProductList.tsx (Server Component - fetches data)
ProductCard.tsx (Client Component - interactive card)
AddToCartButton.tsx (Client Component - button with logic)
Expected Result:
- A working Next.js project with minimal functionality
- Clear separation between Server and Client Components
- Comments in the code explaining the choice between Server and Client Component
- README with a description of the architecture and justification of decisions
Time for completion: 2-4 hours
Evaluation Criteria:
- Correct use of Server/Client Components
- Code quality and typing