freeCodeCamp Challenge Guide: Use the Twitch JSON API

freeCodeCamp Challenge Guide: Use the Twitch JSON API
0

Just currently trying to get my head around this API. I have seen the thread recommending to use hard coded data but i also found this in twitch docs so I am going to see what data I can get to play with using my client_id.

docs

Once you create a Developer Application, you are assigned a client id. Some authentication flows also require a client secret. You can generate one on the same page as the client ID. Client IDs are public and can be shared (e.g. embedded in the source of a web page), but client secrets are equivalent to a password for your application and must be kept confidential.

could you link to where it says its getting retired please? I couldn’t find it in search.

I might sack this one off if it’s being retired… I had fun doing the quote machine, weather app and wiki viewer but this one doesn’t interest me the same. So if something more interesting might be coming along i could do that instead :yum:

Note: Simon, Tic Tac Toe, Twitch, Wikipedia Viewer, Local Weather, Roguelike Dungeon Crawler, Markdown Previewer and Camper Leaderboard will become just some of many bonus practice projects.

2 Likes

Any word on how long it’ll be until it’s removed? I’m hoping to finish up Front-End by February and if the Twitch App is out of rotation by that point I’d just as soon skip it and move onto Algorithms/Advanced projects.

I’d like to know this too - I’ve found all the Intermediate Front End projects to be a real drag thanks to issues with getting the APIs to work on Code Pen. Would definitely prefer to come back to this stage once they’ve been revised if it’s happening soon.

You could (or in my opinion, you should) make your projects locally and then host them on GitHub pages, that way you can get more comfortable with your workflow and tools.

5 Likes

I’m making my projects locally, then hosting on GitHub pages (or surge.sh).

The issue is still that the workaround for the Twitch API seems flaky. Several times today, it times out and gives this message:

{“status”:“Error”,“statusCode”:503,“statusDetail”:“Waiting To Serve for wind-bow: No service found running on port”}

The only option I have is to hard code the json into a var but this almost doesn’t seem worth it, I mean why learn about using an API without actually using an API? So I’d prefer to skip it if it is going to be retired.

What is the latest on this challenge being retired?

1 Like

For people having problems with this project, go ahead, create a twitch.tv account and get a Client ID.

The twitch.tv api uses OAuth 2 authentication. This means you will have access to two things when creating an account.

  1. Client ID: "The client ID is considered public information, and is used to build login URLs, or included in Javascript source code on a page. "

  2. Client Secret: “The client secret must be kept confidential. If a deployed app cannot keep the secret confidential, such as Javascript or native apps, then the secret is not used.”

learn more about Oauth2 here.

For the interaction needed in this project you do not need to worry about the client secret. You can make the requests only with the client ID.

I wrote about this in the github issue. But seem to have been ignored by everyone :cry:

The only reason I see to not do it like this, is if you are against the need to create an account on a third party website, just to pass a freecodecamp challenge. I understand that some people may not want to do that, but want to make my point clear: A Client ID is public information. There is no security problem in having it on the front end javascript code.

11 Likes

I guess I’m late to reply so I will just leave a link to my latest version of this challenge using React. https://rafase282.github.io/Twitchtv-JSON-API/

1 Like

So since the new link ( https://wind-bow.hyperdev.space/twitch-api ) yall gave us isnt working now do we just go back to using the twitch api and just let the API key be exposed or what?

Here’s my Twitch TV https://thomasbullock.github.io/TweaknTwitchTV/
My first effort with Knockout JS and Bourbon.
I really really like bourbon/neat.
I didn’t have too many problems with the api thanks to @gobees posts.
Mine worked locally and on github - didn’t try codepen - I really hate working on that site!

3 Likes

Hi @fuecisla , Just wondering which text editor and theme you are using. Really like it and want to use it. Can you please reply? Thanks

Oh dear, it appears the Free Code Camp Twitch API Pass-through (https://wind-bow.gomix.me/) is broken.

It was working fine yesterday. But today when I make json request I get: SyntaxError: expected expression, got '<'

I tested it here too, same problem :frowning:

Anyone from FCC available to look into this?

Regards,

They changed the url. You need to call https://wind-bow.gomix.me in your requests.

7 Likes

Thanks! I didn’t notice the links was changed… It suddenly happened yesterday while I was almost done with it. I thought I’d have to do it again completely.

Thanks. I was asking myself why my page stopped working all of a sudden.

Apologies if it’s already been mentioned but the FreeCodeCamp pen doesn’t seem to be working.

I tried forking it and updating the API URL and that seemed to fix it.

1 Like

I don’t know if anyone solved this, bu tI think that, to use data, you need to call a function WITHIN the embedded function = ie, just after getting this.response, do foo(…), and process the data in foo. That way, you will not outrun the request, which could be waiting for a reply.

Is that clear??

Here’s my solution.

Sorry for the late reply.

If you want access the **data// variable you would have to either return it, or make it public. But based on the code itself, I would suggest you use promises to handle this case.