I completed this challenge but when I tried to submit it the FCC site went into maintenance. Now it’s back but this project is not in front-end certificate anymore…
But I want you to see it anyway because I spent so much time doing this…
CodePen (The link to Twitch does not work due to CodePen iframe)
GitHub Page (The link works)
Now you have to implement a filter for “All/Online/Offline”
@sidemt,I like your twitch.
Also, it is my understanding that you may still use the Twitch API project toward your front end cert. Login to freecodecamp and then visit your settings page. Scroll all the way down toward the bottom of the page. You should find a section named “Legacy Front End Projects”.
The UI and design looks very good. Like the old skool terminal-bitmap font, very nice.
Just some minor stuffs you may apply, to make it great.
First, add a loading indicator at the startup, or before you call the twitch API to grab the data. it tells the user something is being under progress and should wait.
I also suggest a dedicated way to inform user if a chanel is offline, rather than a simple offline text. One good solution is fading out the offline channel row(simply set the
opacity or any other solution).
This is also good to remove the transparency when user hover or clicks/taps on it.
You may also refresh the channels every 10 min(or less, or more). refreshing results is sort of required. Also able the user manually ask for refreshing data using a button for example, but if the refresh time is not so long, you may not add it.
The great part also is you used the relative units in most css rules, this is very good.
Overall looks very good. Could have much more stuffs, but really great as start. Awesome.
Keep going on great work, happy programming.
Thank you all for your comments! Great suggestions and useful information.
I modified the parts which I could come up with the solution right now, but not yet for most of them… I decided to move on to the brand new curriculum now, but I will keep your suggestions in my mind. It will be a great help when I do similar projects. I might come back and fix this later. Thank you!