Tandemonium is a quiz app that allows users to take random quizzes, see their scores, and compare them to other user's top scores. Tandemonium also allows users to chat live while taking their quizzes.
Live site: https://tandemonium.herokuapp.com
- Frontend: React, Webpack
- Backend: Ruby on Rails, Action Cable/WebSockets
- Database: Postgres
- Hosting: Heroku
Envirornment/engines:
- ruby 2.5.1
- node 10.3.0
- npm 6.4.1
- Clone this respository
- npm install and bundle install
- Start up Postgres
- rails db:setup
- Start rails server (rails s)
- Navigate to http://localhost:3000
The quiz is managed though several React components. State is used to keep track of the currently selected answers, and then some helper function calculate the number of correct answers upon submission.
Action Cable was used to implement WebSockets with the Rails backend. An example of a subscription to the chat room is shown below:
App.cable.subscriptions.create(
{channel: "ChatChannel", },
{
received: data => {
this.setState({
messages: [...this.state.messages, [data.message, data.username, data.color]],
})
},
speak: function(data) {
return this.perform("speak", data)
}
}
)
And on the backend
def subscribed
# stream_from "some_channel"
stream_for "chat_room"
end
def speak(data)
broadcastMessage = {message: data['body'], username: data['username'], color: data['color']}
ChatChannel.broadcast_to("chat_room", broadcastMessage)
end
I setup the project for Unit Testing with Jest / Enzyme. I did not get to write any tests yet, but that will be a future endevor.