The project is build as a web application that lets a user play the “Would You Rather?” game. The game goes like this: A user is asked a question in the form: “Would you rather [option A] or [option B] ?”. Answering "neither" or "both" is against the rules.
Using the app, users will be able to
- answer questions,
- see which questions they haven’t answered,
- see how other people have voted,
- post questions, and
- see the ranking of users on the leaderboard
This project was bootstrapped with Create React App.
react-scripts from npm registry is used to build and run the app.
Please refer dependencies and scripts section in package.json
for more details.
In the project directory, you can run the below scripts:
- install all project dependencies with
npm install
- start the development server with
npm start
- the app can be accessed in the browser using
http://localhost:3000/
Additional information:
- project can be build with
npm run build
React UI Library
is used to design the presentational and controlled UI componentsReact-Bootstrap
UI Foundation libraryRedux
is used to improve the predictability of the application’s state; establish strict rules for getting, listening, and updating the store; and identify what state should live inside of Redux and what state should live inside of React components. For this application, most of the application’s state is managed by Redux. However, component state has been used to handle form input fields and controlled components. Otherwise, the rest of the state for the application is controlled by the reducers.- Dispatch of async actions to reducers is managed via
Redux Thunk
middleware. Also logger middleware is used for debugging purpose. React Router
is used for managing application routes
- Home Page:
/
- New Question:
/add
- LeaderBoard:
/leaderboard
- Specific Poll Question:
questions/:question_id
The App leverages the _DATA.js
which serves as a backend server
and provies the following methods to perform necessary operations on the backend:
_getUsers
_getQuestions
_saveQuestion
_saveQuestionAnswer
Limitation: The app uses a dummy backend database server so the application state will not persist after refresh