anthonykoch / trivia-app

A trivia app built with react and typescript

Trivia App

Live Preview

 ______                                     ______
/\__  _\       __           __             /\  _  \
\/_/\ \/ _ __ /\_\  __  __ /\_\     __     \ \ \L\ \  _____   _____
   \ \ \/\`'__\/\ \/\ \/\ \\/\ \  /'__`\    \ \  __ \/\ '__`\/\ '__`\
    \ \ \ \ \/ \ \ \ \ \_/ |\ \ \/\ \L\.\_   \ \ \/\ \ \ \L\ \ \ \L\ \
     \ \_\ \_\  \ \_\ \___/  \ \_\ \__/.\_\   \ \_\ \_\ \ ,__/\ \ ,__/
      \/_/\/_/   \/_/\/__/    \/_/\/__/\/_/    \/_/\/_/\ \ \/  \ \ \/
                                                        \ \_\   \ \_\
                                                         \/_/    \/_/

What is it

A completely overkill trivia app using:

• Typescript alongside BabelJS
• redux-saga
• react-emotion
• jest
• Storybook
• Custom webpack config (but inspired by create-react-app)

Todo

• Moar tests
• Should probably move types to their own files/to the root types file
• Reorganize imports
• Rename generic types to best practice
• Write a generic reducer for allIds?
• Fetch requests should have { type: string, status: { id: string } } instead { type: string, id: string }
• Add the current quiz to local storage
• Better use of theming

Setup

1. Clone the repository
2. Run npm install

Running the app

Development mode

npm run dev

The site will be available at localhost:5600

Production mode

npm run build
npx http-server build -p 4200 -a localhost

Linting

View linting errors by running:

npm run lint

Typescript

View tsc errors by running:

npm run tsc