mirror of
https://github.com/monkeytypegame/monkeytype.git
synced 2025-02-11 08:14:11 +08:00
* Renamed command line setting timer-progress bar * Added table of contents * Fixed some mistakes * More small changes * Update CONTRIBUTING.md * updated guidelines * Update CONTRIBUTING.md Note that one of the table of contents links is broken, fixing that later * Added missing sections in table of contents * Fixed typos * Fixed typos * Update CODE_OF_CONDUCT.md Co-authored-by: Jack <bartnikjack@gmail.com>
117 lines
7.1 KiB
Markdown
117 lines
7.1 KiB
Markdown
# Contributing
|
|
|
|
### **Table of Contents**
|
|
<!-- TODO: check if all anchor links work -->
|
|
- [Getting Started](#getting-started)
|
|
- [Prerequisites](#prerequisites)
|
|
- [Prerequisite - Text Editor](#prerequisite---text-editor)
|
|
- [Prerequisite - Git ](#prerequisite---git )
|
|
- [Prerequisite - NodeJS](#prerequisite---nodejs)
|
|
- [Prerequisite - Firebase Setup](#prerequisite---firebase)
|
|
- [Building and Running](#building-and-running-monkeytype)
|
|
- [Standards and Guidelines](#standards-and-guidelines)
|
|
- [Theme Guidelines](#theme-guidelines)
|
|
- [Language Guidelines](#language-guidelines)
|
|
- [Quote Guidelines](#quote-guidelines)
|
|
- [Questions](#questions)
|
|
|
|
|
|
|
|
## Getting Started
|
|
|
|
When contributing to Monkeytype, it's good to know our best practices, tips, and tricks. First, Monkeytype is written in JavaScript; thus we assume you are comfortable in JavaScript or have basic knowledge of it. We use Prettier to format our code. Our backend is in NodeJS and we use Firebase to store our user data.
|
|
|
|
|
|
### Prerequisites
|
|
While most contributions don't require that you install dependencies, there are a few minimum requirements you will need to meet to be able to run the project(this is useful and almost always necessary for tasks like creating features and fixing bugs, running the project is also useful if you are contributing a theme and want to view it on the site before you contribute it). You will need a computer with a stable internet connection, NodeJS with a version < 14 and Firebase, and a text editor.
|
|
|
|
#### Prerequisite - Text Editor
|
|
If you are not a developer and wish to contribute themes, new languages, or quotes, having a text editor will make the process *much* easier. A popular and relatively lightweight editor is the free and open-source [Visual Studio Code](https://code.visualstudio.com/) or VS Code for short from Microsoft. Once you have downloaded the binary for your operating system, run the installer and follow the prompts. You will be given some options, but enabling them is just preference. Once you have VS Code installed, you are ready to start contributing.
|
|
|
|
#### Prerequisite - Git
|
|
Git is optional but is one thing that is highly recommended. Monkeytype used the Git source control management system for its version control. Without Git, you will be limited to using GitHub's basic online editor for making commits or will need to make changes and copy-paste them into GitHub. You also won't be able to create save points in your code that you can revert to (`git revert [commit hash]`)Using Git allows you to make that process more seamless. Assuming you don't have experience with using a command line, I suggest installing [Sourcetree](https://www.sourcetreeapp.com/). You will be able to utilize the power of Git without needing to remember any cryptic commands. Note that using Git from a Git client won't give you access to its full functionality. Once you have downloaded Sourcetree, run the installer. If you don't have Git installed and get the option to install it in the Sourcetree installer, install it. Once you have completed that, you are one step closer to contributing your change.
|
|
|
|
#### Prerequisite - NodeJS
|
|
Note that this section only covers the installation of NodeJS
|
|
The installation process of NodeJS is fairly simple, navigate to the NodeJS [website](https://nodejs.org/en/) and download the `xx.xx.x LTS`. Your operating system will be detected and the website will ask to save a binary relevant to your operating system. Run the binary and follow the installer.
|
|
|
|
#### Prerequisite - Firebase
|
|
|
|
Note that you will need to create a Firebase account to ensure the further steps are successful.
|
|
1. Create a Firebase account if you already haven't done so.
|
|
1. [Create a new Firebase project.](https://console.firebase.google.com/u/0/)
|
|
|
|
- The project name doesn't matter, but the name `monkeytype` would be preferred.
|
|
- Google Analytics is not necessary.
|
|
|
|
1. [Install the Firebase CLI](https://firebase.google.com/docs/cli)
|
|
1. Run `firebase login` on your terminal to log in to the same google account as you just used to create the project.
|
|
1. Git clone this project.
|
|
1. Duplicate `.firebaserc_example`, rename the new file to `.firebaserc` and change the project name of default to the firebase project id you just created.
|
|
|
|
- If `.firebaserc_example` does not exist after cloning, create your own with:
|
|
|
|
```.firebaserc
|
|
{
|
|
"projects": {
|
|
"default": "your-firebase-project-id"
|
|
}
|
|
}
|
|
```
|
|
|
|
- Run `firebase projects:list` to find your firebase project id.
|
|
|
|
1. Generate a Firebase Admin private key
|
|
|
|
- In your Firebase console, go to Project Settings > Service Accounts
|
|
- Click "Generate New Private Key"
|
|
- Save as `serviceAccountKey.json` in the `functions/` directory
|
|
|
|
1. Enable Firebase Authentication
|
|
|
|
- In the Firebase console, go to Authentication
|
|
- Click on `Email/Password`, enable it, and save
|
|
- Click on `Google`, add a support email and save
|
|
|
|
1. Enable Firebase Firestore
|
|
|
|
- In the Firebase console, go to Cloud Firestore
|
|
- Create database
|
|
- Start in test mode
|
|
- Select default location and enable
|
|
|
|
### Building and Running Monkeytype
|
|
|
|
Once you have completed the above steps, you are ready to build and run Monkeytype.
|
|
1. Run `npm install` in the project root directory to install dependencies.
|
|
1. Run `npm run start:dev` to start a local dev server on port 5000. It will watch for changes and rebuild when you edit files in `src/` or `public/` directories. Use <kbd>control c</kbd> to abort it.
|
|
- Run `firebase use {your-project-id}` if you run into any errors for this.
|
|
|
|
### Standards and Guidelines
|
|
|
|
Code style is enforced by [Prettier](https://prettier.io/docs/en/install.html), which automatically runs every time you `git commit` (if you've followed the above instructions properly).
|
|
|
|
Following the guidelines below will increase your chance of getting your change accepted.
|
|
|
|
#### Theme Guidelines
|
|
<!-- TODO: add screenshots to provide examples for dos and don'ts -->
|
|
- Make sure your theme is unique and a similar looking one is not already available
|
|
- The text color is either black or white (or very close to)
|
|
- Your theme has been added to the `_list` file and the `textColor` property is the theme's main color
|
|
- Your theme is clear and readable with both `flip test colors` and `colorful mode` enabled and disabled
|
|
|
|
#### Language Guidelines
|
|
- Do not include swear words
|
|
- Ensure that your contribution meets JSON standards (no trailing comma at the end of a list)
|
|
- Be sure to add your language to the `_list` and `_groups` files
|
|
- Make sure the number of words corresponds to the file name (for example: `languageName.json` is 200 words, `langugeName_1k.json` is 1000 words, and so on)
|
|
|
|
#### Quote Guidelines
|
|
- Do not include swear words
|
|
- Ensure that your contribution meets JSON standards (no trailing comma at the end of a list)
|
|
- Verify the `length` property is correct (length of the text in characters)
|
|
- Verify the `id` property is incremented correctly
|
|
|
|
## Questions
|
|
|
|
If you have any questions, comments, concerns, or problems let me know on [GitHub](https://github.com/Miodec) or [Discord](https://discord.gg/monkeytype) in the `#development` channel.
|