Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/teekaytech/catalogue-of-trivia-questions

A single page application that fetches data from a Opentbd API into Redux store. Visitors can view categories and filter the questions based on a category. Built with React, Redux & React Hooks.
https://github.com/teekaytech/catalogue-of-trivia-questions

css-modules react-hooks redux-store redux-thunk

Last synced: about 1 month ago
JSON representation

A single page application that fetches data from a Opentbd API into Redux store. Visitors can view categories and filter the questions based on a category. Built with React, Redux & React Hooks.

Awesome Lists containing this project

README 

        
# Catalogue-of-Trivia-Questions



> A single page application that fetches data from [Open Trivia API](https://opentdb.com/) into Redux store. Visitors can see all available categories and also filter the trivia questions based on the selected difficulty. Built with React, Redux & React Hooks. This project is one of the **Catalogue of Statistics** project: a React/Redux capstone project in microverse curriculum.



![First Screenshot here...](public/screenshots/screenshot.png)

![Second screenshot here...](public/screenshots/screenshot2.png)



## Built With



- CSS Modules

- npm & ES6

- React/Redux

- React Hooks

- React-Create-App

- React Testing Library

- [![Netlify Status](https://api.netlify.com/api/v1/badges/781b0a1d-c0ad-4305-8c83-df21a1bf38aa/deploy-status)](https://app.netlify.com/sites/cat-of-trivia-questions/deploys)



## Live Demo



[Catalogue of Trivia Questions](https://cat-of-trivia-questions.netlify.app/)



## Project presentation links (9minutes)



[Part 1](https://www.loom.com/share/c906f204e82843f8bd6348b83e9f7562)

[Part 2](https://www.loom.com/share/6a358307f9f04bce9a93b812f63367e3)



## Getting Started



To get a local copy up and running follow these simple example steps.



- On the project GitHub page, navigate to the main page of the repository [this page](https://github.com/teekaytech/Catalogue-of-Trivia-Questions).

- Under the repository name, locate and click on a green button named `Code`.

- Copy the project URL as displayed.

- If you're running Windows Operating System, open your command prompt. On Linux, Open your terminal.

- Change the current working directory to the location where you want the cloned directory to be made. Leave as it is if the current location is where you want the project to be.

- Type `git clone`, and then paste the URL you copied in Step 3.


  `$ git clone https://github.com/teekaytech/Catalogue-of-Trivia-Questions.git` Press Enter key


- Press Enter. Your local copy will be created.



Please Note that you must have github installed on your PC, this can be done



### Making Changes / Running the app locally



- `npm install` to install the dependencies and packages

- `npm start` to test the app before or after changes were made



### Prerequisites



- [Git](https://gist.github.com/derhuerst/1b15ff4652a867391f03).

- Web browser (Chrome/Firefox)

- [Node](https://nodejs.org/en/)

- [NPM](https://www.npmjs.com/get-npm)



### Usage



Click on the live demo link and peruse the app.



## Author



built to mark th

👤 **Taofeek Olalere**



- Github: [@teekaytech](https://github.com/teekaytech)

- Twitter: [@ola_lere](https://twitter.com/ola_lere)

- Linkedin: [olaleretaofeek](https://linkedin.com/in/olaleretaofeek)

- Portfolio: [Olalere Taofeek](https://teekaytech.github.io/olaleretaofeek/)



## 🤝 Contributing



Contributions, issues and feature requests are welcome!



Feel free to check the [issues page](https://github.com/teekaytech/Catalogue-of-Papers/issues/).



## Show your support



Give a ⭐️ if you like this project!



## Acknowledgments



- [Microverse](https://.microverse.org/)

- [create-react-app boilerplate from Facebook team](https://github.com/facebook/create-react-app)

- [Netlify](https://app.netlify.com/)

- [Design idea by Nelson Sakwa on Behance]()

- [React Hooks](https://reactjs.org/docs/hooks-intro.html)

- [CSS Modules](https://css-tricks.com/css-modules-part-1-need/)

- [React Testing Library](https://github.com/testing-library/react-testing-library)



## 📝 License



This project is [MIT](/LICENSE) licensed.