https://github.com/rahulkrsharma2004/pivot-assignment
The Pokemon Web Application is designed to showcase frontend development skills through three progressive challenges. The application is built using React, Next.js, TypeScript, and Tailwind CSS, with Pokemon API for data.
https://github.com/rahulkrsharma2004/pivot-assignment
next-js react-forms react-hooks react-router-dom reactjs tailwindcss typescript vercel-deployment zod
Last synced: about 2 months ago
JSON representation
The Pokemon Web Application is designed to showcase frontend development skills through three progressive challenges. The application is built using React, Next.js, TypeScript, and Tailwind CSS, with Pokemon API for data.
- Host: GitHub
- URL: https://github.com/rahulkrsharma2004/pivot-assignment
- Owner: Rahulkrsharma2004
- Created: 2024-12-21T08:36:57.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-20T15:39:48.000Z (about 1 year ago)
- Last Synced: 2025-05-18T03:10:29.028Z (9 months ago)
- Topics: next-js, react-forms, react-hooks, react-router-dom, reactjs, tailwindcss, typescript, vercel-deployment, zod
- Language: TypeScript
- Homepage: https://pivot-pokemon.vercel.app
- Size: 141 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pokemon Web Application
## Overview
The Pokemon Web Application is designed to showcase frontend development skills through three progressive challenges. The application is built using React, Next.js, TypeScript, and Tailwind CSS, with optional backend support using Node.js, Express, and MongoDB. The primary goal is to create an interactive, responsive, and accessible Pokemon Explorer Web Application.
## Image
### Primary Technologies
- React
- Next.js
- TypeScript
- Tailwind CSS
- Pokemon API
## Project Challenges
### Challenge 1: Pokemon Card Component
**Objective:** Create a reusable Pokemon card component.
#### Requirements
- Design a `` component that displays:
- Pokemon name
- Unique ID
- Type(s)
- Sprite/Image
- Basic stats (optional)
```tsx
interface PokemonCardProps {
id: number;
name: string;
types: string[];
sprite: string;
}