https://github.com/hasims2001/codingassignment6
Coding Assignment 6 | GenAI
https://github.com/hasims2001/codingassignment6
Last synced: 9 months ago
JSON representation
Coding Assignment 6 | GenAI
- Host: GitHub
- URL: https://github.com/hasims2001/codingassignment6
- Owner: Hasims2001
- Created: 2023-11-17T12:03:04.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2023-11-17T12:12:19.000Z (over 2 years ago)
- Last Synced: 2025-05-07T07:53:03.244Z (about 1 year ago)
- Language: JavaScript
- Size: 351 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Building a React Location Search Application with Google Place Autocomplete and Redux
Objective:
Design a React application that allows users to find places using Google Place
Autocomplete and displays search results on a map. The application must utilize Redux
to store and manage search results, and you can choose one of the following methods
in combination with Redux: Redux Thunk, Redux Promise, Redux Saga, or Redux-Observable
Epics. The UI should be implemented using Material Design Kit for a simple and user-
friendly experience.
Requirements:
Google Place Autocomplete:
Implement a textbox with autocomplete functionality using the Google Place
Autocomplete API (https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete).
Fetch and display results based on user input.
Redux Integration:
Utilize Redux for state management.
Store and manage search results using one of the following methods: Redux Thunk,
Redux Promise, Redux Saga, or Redux-Observable Epics.
Display Search History:
Display all searches that the user has tried.
Leverage Redux to store and manage the search history.
Material Design UI:
Use the Material Design Kit (https://github.com/mui-org/material-ui) for building the
UI.
Create a simple and user-friendly interface, showcasing your creativity as a Front-
end developer.
Code Structure:
Implement a scalable code structure using ES6 features.
Use High Order Components (HOC) where necessary for code reusability.
Functional Programming:
Apply great functional programming practices throughout the codebase to enhance
maintainability and readability.
Redux-Observable Epic:
If you choose Redux-Observable, implement epics to handle complex asynchronous
actions in a scalable way.
Additional Considerations:
Scalability:
Design the codebase in a way that it is scalable for potential future enhancements.
ESLint:
Use ESLint for static code analysis to maintain code quality.
Testing:
Implement unit tests to validate the functionality of key components, actions, and
reducers.
Documentation:
Provide clear documentation for setting up the project, running the application, and
any other relevant details.
Code Comments:
Add comments in the code to explain complex logic or any crucial implementation
details.
Delivery:
Submit the React codebase along with any necessary setup instructions, documentation,
and a brief overview of the implemented features. The goal is to demonstrate your
ability to design a scalable and well-structured React project with Google Place
Autocomplete and Redux integration.