Mojo: The Summoning is a card-collecting game where players battle 1 on 1 using their decks of Cards.
GOAL: Construct the backend database for Mojo: The Summoning by configuring Sequelize, defining models (User, Deck, Card, and Attack), defining associations, and test the models and associations in corresponding test file.
This is an existing codebase that your team have already been working on. You will be working in the server folder to set up the database layer. The front end is contained in the client folder and you do not need to modify anything contained within this folder.
To preview the database output, read the section Trying Out the App
Once you have the project locally on your machine, you're ready to start your work!
cdinto theserverdirectory- Then, use
npmto install thesqlite3,sequelizeandjestpackages.
cd into server first! This project has multiple folders and you do not want to install dependencies into the wrong one.
- In
server/src/db/config.jsconnect to your database using Sequelize.
- Work in the
server/src/modelsdirectory to create the following models according to the corresponding class diagrams:
UserDeckCardAttack
- When defining your models, make sure to do the following so that the front end will work:
-
The model name should be the same name as your model
-
Use titlecase (i.e. uppercase) for the model name:
let Example = db.define("Example", { // properties });
If using this style
class Example extends Model {} Example.init( { // properties }, { sequelize: db } );
you don't need to do anything as the titlecase model name is provided for you by default.
classDiagram
class User {
+int id
+string username
}
(This file has been created but is empty.)
classDiagram
class Deck {
+int id
+string name
+integer xp
}
(This file does not exist. You need to create it in the models directory.)
classDiagram
class Card {
+int id
+string name
+int mojo
+int stamina
+string imgUrl
}
classDiagram
class Attack {
+int id
+string title
+int mojoCost
+int staminaCost
}
- One test file has been started for you in
models/User.test.js. - Continue to write unit tests which check that each of your models functions correctly with each model getting its own testing file (e.g.
Card.test.js). - It is recommended to import into your test files from
models/index.js. - Run the tests with
npm run test.
- In
models/index.js, create associations according to the specifications outlined below.
classDiagram
class User {
+int id
+string username
}
class Deck {
+int id
+string name
+integer xp
}
class Card {
+int id
+string name
+int mojo
+int stamina
+string imgUrl
}
class Attack {
+int id
+string title
+int mojoCost
+int staminaCost
}
User "1" o-- "1" Deck : owns
Deck "1" *-- "*" Card : contains
Card "*" o-- "*" Attack : has
You should set up the associations in models/index.js.
Each User may create exactly one Deck. For example, a User gandalf might create a Deck called The Fellowship.
- Associate Users and Decks with a one-to-one relationship.
- Add tests to check the association.
Each Deck may contain many Cards. A Card may only belong to one Deck. For example, The Fellowship might contain Cards called Lizard Wizard and Bulk Brogan. Two Decks might contain Cards with the same name, but these are considered different Cards, and would have different IDs.
- Associate Decks and Cards with a one-to-many association
- Add tests to check the association
Each Card may have many Attacks. Each Attack may belong to many Cards. For example, Lizard Wizard and Bulk Brogan might both have a Charge attack. Lizard Wizard might have a Thunderbolt and Bulk Brogan a Piledriver.
- Associate Cards and Attacks with a many-to-many association
- Add tests to check the association
If you're models are successfully defined, you should be able to run the app and view the results in the browser.
In the server folder:
- In a terminal,
cdintoserverand run
npm install
npm run seed
npm run devThis will start the development server (the back-end).
In the client folder:
- In a separate terminal,
cdintoclientand run
npm install
npm run devThis will start the client (the front-end). You should see a url (usually localhost:5173). Visit this url in your browser to see the client displaying data requested from the database.
Tip: to stop the servers running, click in the terminal and press ctrl + c
