Inspiration

We wanted to create a fun AFK game to play when watching Team Liquid streamers.

What it does

It's an AFK game where views gain points for their own personal blue avatar from watching a stream. They can use the points to upgrade attributes and see how they stack up on the leaderboard.

How we built it

We used Vue and Vuetify for the frontend to quickly build UI elements. We built the backend with Express node.js. Postgres for our database. And we used Twitch's extension developer rig and API to hook it up to twitch.

Challenges we ran into

We ran into a lot of issues using JWTs because none of us had experience using them. Also we ran into some initial issues setting up the Twitch developer rig across multiple users

Accomplishments that we're proud of

We learned how to use the Twitch API and the extension javascript library as well as how to use JWTs. Also, we learned a lot about developing on the frontend and the backend using Vue, Vuetify and Express.

What we learned

We are proud of working together and finishing the hackathon. We had fun mentoring a friend on his first hackathon. Also, successfully using the JWT from the Twitch API felt great.

What's next for Twitch Extension AFK Game

We're gonna add a proper battle/dueling system with ranked MMR formula to calculate the leaderboard. Also to get it accepted by twitch and get it published on their extension store.

Share this project:

Updates