A responsive Single-Page Application made with Reactjs and React-Router.
ReacTwitch is a responsive React Single-Page Application that utilises React Select dropdown library to search dynamically and load data via Twitch API asynchronously. This project was bootstrapped with Create React App.
Tool | Description |
---|---|
React | A JavaScript library for building user interfaces |
React Router | Declarative routing for React |
React Bootstrap | The most popular front-end framework Rebuilt for React. |
React Select | A flexible and beautiful Select Input control for ReactJS with multiselect, autocomplete, async and creatable support. |
Node-Sass | Node-sass allows you to natively compile .scss files to css at incredible speed and automatically via a connect middleware. |
Axios | Promise based HTTP client for the browser and node.js |
Moment.js | Parse, validate, manipulate, and display dates and times in JavaScript. |
Toastr | Simple Javascript toast notifications |
Lodash | A modern JavaScript utility library delivering modularity, performance & extras. |
PropTypes | Runtime type checking for React props and similar objects. |
Jest | Jest is a delightful JavaScript Testing Framework with a focus on simplicity. |
Enzyme | Enzyme is a JavaScript Testing utility for React that makes it easier to test your React Components’ output. |
Node.js is required to get npm
.
$ git clone https://github.com/buralog/react-twitch-app.git
$ cd react-twitch-app
$ npm install
Twitch API Key is required to run the project.
Note: This app is currently using Twitch API v5. Make sure you use the correct version of API.
You need to have an .env
environment file for your API key:
REACT_APP_TWITCH_KEY = your key
Use your key in src > services > Twitch.js
file:
const client_id = process.env.REACT_APP_TWITCH_KEY;
$ npm start
Open http://localhost:3000 to view it in the browser.
The page will automatically reload if you make changes to the code.
You will see the build errors and lint warnings in the console.
$ npm test
Runs the test watcher in an interactive mode.
By default, runs tests related to files changed since the last commit.