Prepare small demo for meeting (Frontend)

[igdel]

(Frontend) Create Basic CRUD Frontend for Animal Data in Shelter Management System

Task Description

Develop a simple React frontend application that interacts with the CRUD API for animal data in a shelter management system. (THIS WON'T GO INTO THE MAIN BRANCH)

Acceptance Criteria

1. CRUD operations interface for animal data
2. Responsive design for desktop and mobile
3. Form validation and error handling
4. Data fetching and state management
5. Basic routing for different views

Technical Details

• React with TypeScript
• State management (e.g., React Query, Redux Toolkit)
• Styled-components or Tailwind CSS for styling
• React Router for navigation

Subtasks

1. Project setup with Create React App or Vite
2. Design and implement main layout
3. Create components for listing animals
4. Implement forms for adding/editing animals
5. Set up routing between views
6. Integrate with backend API
7. Implement error handling and loading states
8. Add basic animations and transitions
9. Implement responsive design
10. Write unit tests for components

Definition of Done

• Acceptance criteria met
• Code adheres to React best practices
• Unit tests passed
• Responsive design works on various devices
• Successfully interacts with backend API
• README updated with setup and usage instructions

Estimated Time

3-4 days

Additional Notes

• Focus on user experience and intuitive design
• Ensure accessibility standards are met
• Use TypeScript for improved code quality
• Consider implementing dark mode
• Prepare demo data for offline development

[igdel]

Frontend has not been needed, this has been discussed in person.