Epische coole app door bazen
Our app consists of three main parts: the rules, the book (story), and the state of the story. The main difference between these three is where they change. The rules are set throughout the app and tell the players how the game is played and thus don't change between different books. The book contains an actual story with it's own characters, locations, items, etc. Multiple books can be written, like The Tutorial and The Plane of Water. The state tracks all the changes during a playthrough of a book to maintain what's happened in the book. So there's one rules, there can be multiple books, which each can have multiple states for each time you play.
The rules tell the players how Basements & Lizards is played. It explains how the book interacts with the state and does this through actions. For example, the move to [direction] action changes the location state to the direction that's chosen by the BM. This requires a direction from the book.
Actions:
move to [direction]: changes location state to directionThe books contain all the information needed for the story and are much like traditional books, but the story is broken down in a more structered manner. For example, the locations are extracted and so are the characters and the items. The players themselves decide which character they play or interact with, which items they interact with or pick up, which direction they go. Besides that, the book explains the main storyline while moving between places.
The idea is to make story writing available for everyone, which is why we use a standard json structure to do this. Basement Masters (BMs) can thus write their own books to be played with friends. This should also allow them to alter existing stories to their liking. The structure of the book is well defined and should be validated for completeness.
// name-of-book.json
{
name: string,
description: string,
start-location: int, // initial state of the location
locations: {
<int>: {
name: string,
description: string,
destinations: [
int
]
}
}
}Whenever the players perform a certain action on a book component, this will be stored in the state. For example, if the party move to [direction], the location state will change to the location the party moves towards. Or when a player picks up an item, this should be represented in his inventory state.
States:
This project was bootstrapped with Create React App.
We generally follow the Storybook Driven Development (SDD) pattern described in this article for reasons described here as well. This restricts us from using React.Context, so we will not use patterns similar to that. For any additional design decisions, we will use this article's content to make sensible decisions.
Weekly meetings follow this agenda: B&L Meeting Agenda
Requirements are documented using Notes and Issues. Tasks are tracked using Issues and Pull Requests.
We use Github Projects to monitor our work. The project board contains the following columns:
Certain automation rules apply to the project board:
Further things to consider:
cd <path>git clone https://github.com/fabianvanhummel/basements-and-lizards.gitcd basements-and-lizardsnpm installnpm startIn the project directory, you can run:
npm startRuns the app in the development mode.\ Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.\ You will also see any lint errors in the console.
npm run buildBuilds the app for production to the build folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\ Your app is ready to be deployed!
See the section about deployment for more information.
npm run storybookStarts Storybook in development mode
We use Storybook for easier development with isolated components. View the Storybook website for more information.
For more UI ideas, we can also use Kometa or any other Tailwind library.