Codenames
This project tries to reproduce a web version of the board game Codenames.
There is a running instance of the game accessible at https://codenames.landazuri.fr.
Dictionaries
The dictionaries used to generate the games are in the dictionaries
folder:
-
dictionary.en.txt
: English -
dictionary.fr.txt
: French
Any correction or addition is very welcome, so we can spice up the game :)
Roadmap
Here is an unordered list of improvements coming up:
General features
-
Whose turn is it currently?
-
Counter for the time for each turn --> Time restricted games ?
Frontend
-
Fix leaving a room
-
Fix when a number of failed on token expiry
-
Mobile friendly! So that the spymasters can be even more discrete! --> Be clear if you need to scroll right
-
Icon to start a game? https://thenounproject.com/search/?q=new%20game
-
Party seed in Title
-
Join a game / New game in different menus
-
Dark theme
Backend
-
Websocket server
-
Security:
- Helmet package? NestJS security page.
-
Backend with websocket rooms:
- to assign roles in a game (no more cheating!)
- chat (background colours by team)
- check for words sent through chat
Installation
If you want to run the project locally, here are the basic requirements:
-
Node.js: The recommended way is via
nvm
. You can then install the version used for this project:nvm install lts/erbium
. -
Yarn: If you have
nvm
installed, you'd prefer to installyarn
without the node dependency. To do so, thebash
install is easier:curl -o- -L https://yarnpkg.com/install.sh | bash
.
This repository uses the Yarn workspaces as a tool to manage the different packages.
From the root folder, simply run the classic command:
yarn install
This will install all package dependencies in a common node_modules
folder at the root of the project using a single yarn.lock
file to avoid conflicts package dependencies.
Applications
You can learn more about each application in their respective README:
-
Frontend: written in TypeScript, developed with React and bundled with Parcel.
-
API: written in TypeScript, developed with NestJS and bundled with Webpack.
Development
For both the Frontend and the Backend (API), you can navigate to the appropriate folder (packages/frontend
or packages/api
) and run the following commands:
-
To run a local dev server of the application with Hot Module Reload:
yarn start:dev
For the API, you can also run local server in [debug mode]((https://nodejs.org/en/docs/guides/debugging-getting-started/):
yarn start:debug
-
To produce a distribution build in the corresponding
dist
folder:yarn build
Regenerate dictionaries
To regenerate the packages/frontend/src/data.json
file based on the dictionaries/dictionary.**.txt
file, you can run:
yarn generate-dictionaries
Legacy frontend deployment
Once built, if you want to send the packages/frontend/dist
folder to a static content hosting service accessible via SSH, you can run the scripts/deploy_static.sh
script. But first, you'll need to set up your hosting information at the beginning of the script:
# Hosting information
FULL_HOST_ADDRESS="username@host.address"
PORT="21"
DESTINATION_FOLDER="/absolute/path/to/www/"
Technical aspects
This projects uses the following technologies:
-
NestJS: ^7.0.0
-
React + React DOM: ^16.12.0
-
Parcel: ^1.12.4
-
TypeScript: ^3.7.3
This project also includes some development dependencies (devDependencies
in package.json
) with their respective configuration file for a better developer experience:
-
EditorConfig:
.editorconfig
— not adevDependency
but allows consistant configuration across IDEs and editors. -
ESLint with TypeScript parser and React
-
React Hooks configuration:
.eslintrc
following this article as a starting point. -
Prettier:
.prettierrc
— formatting options
Author
Paul Landázuri