freeCodeCamp/curriculum/challenges/english/10-coding-interview-prep/take-home-projects/use-the-twitch-json-api.eng...

52 lines
2.2 KiB
Markdown

---
id: bd7158d8c442eddfaeb5bd1f
title: Use the Twitch JSON API
challengeType: 3
isHidden: false
isRequired: false
forumTopicId: 19541
---
## Description
<section id='description'>
<strong>Objective:</strong> Build a <a href='https://codepen.io' target='_blank'>CodePen.io</a> app that is functionally similar to this: <a href='https://codepen.io/freeCodeCamp/full/Myvqmo/' target='_blank'>https://codepen.io/freeCodeCamp/full/Myvqmo/</a>.
Fulfill the below <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>user stories</a>. Use whichever libraries or APIs you need. Give it your own personal style.
<strong>User Story:</strong> I can see whether freeCodeCamp is currently streaming on Twitch.tv.
<strong>User Story:</strong> I can click the status output and be sent directly to the freeCodeCamp's Twitch.tv channel.
<strong>User Story:</strong> if a Twitch user is currently streaming, I can see additional details about what they are streaming.
<strong>Hint:</strong> The relevant documentation about Twitch.tv's JSON API is here: <a href='https://dev.twitch.tv/docs/api/reference/#get-streams' target='_blank'>https://dev.twitch.tv/docs/api/reference/#get-streams</a>.
<strong>Hint:</strong> Here's an array of the Twitch.tv usernames of people who regularly stream: <code>["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]</code>
<strong>UPDATE:</strong> Due to a change in conditions on API usage, Twitch.tv requires an API key, but we've built a workaround. Use <a href='https://wind-bow.glitch.me' target='_blank'>https://wind-bow.glitch.me/helix</a> instead of twitch's API base URL (i.e. https://api.twitch.tv/helix ) and you'll still be able to get account information, without needing to sign up for an API key.
When you are finished, click the "I've completed this challenge" button and include a link to your CodePen.
You can get feedback on your project by sharing it with your friends on Facebook.
</section>
## Instructions
<section id='instructions'>
</section>
## Tests
<section id='tests'>
```yml
tests: []
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js
// solution required
```
</section>