Interactive-Rating-App

The Rating App is a simple feedback collection application built with TypeScript and React. It allows users to rate their experience and provides a thank you page that displays the rating they submitted.

Features

  • Users can select a rating from 1 to 5.
  • The selected rating button is highlighted in orange.
  • The submit button is disabled until a rating is selected.
  • The selected rating is stored in local storage.
  • Upon submission, the user is navigated to a thank you page where their rating is displayed.

Learning Opportunities

By working on this project, you can gain hands-on experience with the following concepts and technologies:

React Basics

  • Building functional components with React.
  • Handling user interactions with event handling.
  • Conditional rendering based on user input and application state.
  • Managing state with React hooks (useState, useEffect).

TypeScript Integration

  • Incorporating TypeScript into a React project for type safety.
  • Defining and using interfaces to define prop types and component structure.

React Router

  • Implementing navigation and routing using React Router.
  • Configuring routes and rendering components based on URL paths.
  • Navigating to a new route programmatically using the useHistory hook.

Local Storage

  • Utilizing the browser's local storage to persist data.
  • Storing and retrieving data from local storage using localStorage API.

UI Styling

  • Styling components using TailwindCSS.
  • Adding visual feedback to selected elements based on user interaction.

Conclusion

The Rating App is a great project to practice core React concepts, TypeScript integration, routing with React Router, and local storage usage. By completing this project, you'll improve your understanding of these technologies and gain practical experience in building interactive web applications.

Feel free to customize and enhance the app with additional features and styling to further expand your skills and creativity!