Skip to content

ramortegui/phoenix_trivia

Repository files navigation

Trivia

Build Status

Trivia is an experiment with Phoenix LiveView. https://phx-trivia.gigalixirapp.com/.

trivia screenshot

Architecture

The process to build this app in summary was divided in 6 steps:

  1. Modules to define the datastructure to play a trivia

    • Trivia.Game
    • Trivia.Player
    • Trivia.Question
  2. A GenServer to maintain the state of the application

    • Trivia.GameServer
  3. A Dynamic Supervisor link the games

    • Trivia.DynamicSupervisor
  4. A live view definition integration and a definition of a template

    • Trivia.TriviaView
  5. Some refactoring (still far from what I want)

  6. Add bulma css to style

TODO

"test everything!!!, improve UI, Refactor code, etc.etc. The main goal was to use live view, and it has been accomplished"

About the game

Trivia is getting 5 Computer/IT questions from Trivia API, the players can join to other trivias on the waiting period. On the bottom of the page are diplayed the point and positions of the players during the game.

The player(s) with the higher score are the winners of the game.

About the app

Trivia app is reactive, but I only use javascript to load a predefined libraries and config the app. :D. https://github.com/phoenixframework/phoenix_live_view it's awesome!

The application can befound at: https://phx-trivia.gigalixirapp.com/

To start your Phoenix server locally:

  • Have elixir installed :)
  • Clone the repo with git clone https://github.com/ramortegui/phoenix_trivia
  • Install dependencies with mix deps.get
  • Install Node.js dependencies with npm install --prefix assets
  • Start Phoenix endpoint with mix phx.server

Now you can visit localhost:4000 from your browser.

Update comment: 2019-10-17