https://github.com/sarukuku/retris

Remotely playable tetris
https://github.com/sarukuku/retris

Last synced: about 1 month ago
JSON representation

Remotely playable tetris

• Host: GitHub
• URL: https://github.com/sarukuku/retris
• Owner: sarukuku
• Created: 2018-10-05T10:37:12.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2022-12-10T00:22:16.000Z (about 2 years ago)
• Last Synced: 2023-12-13T18:32:45.326Z (about 1 year ago)
• Language: TypeScript
• Homepage:
• Size: 4.81 MB
• Stars: 0
• Watchers: 2
• Forks: 2
• Open Issues: 29
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Remotely Playable Tetris

## How to dev?

1. Clone the repo

2. Set the Environment variables based on `.env.example`

3. Run `yarn`

4. Run `yarn dev`

5. Open the controller and display in your browser at `http://localhost:3000` and `http://localhost:3000/display`

6. ????

7. Create a PR

8. Profit

## How to deploy?

When a PR is merged to master it's automatically deployed to https://reaktor-tetris-staging.herokuapp.com/. Master is deployed manually via Heroku to https://reaktor-retris-production.herokuapp.com/. To access the apps you'll need access. Joonas (@aki7) can help you with this.

## Bug tracking

Clientside bugtracking uses a free version of Bugsnag. Currently Joonas and Ákos has access to the collected data. Ask them to get access.

## Good to know

When you're running `yarn pretty` and you save a file in your editor it's automatically formatted with `prettier` to match the lint rules. Imports aren't organised automatically by `yarn pretty`. That you'll need to do on your own.

## Add custom translations

Currently Google Spreadsheet based custom translation is offered.

### How to add custom translations

1. Open `src/i18n/default-translation.ts`

2. Fill an empty Google Spreadsheet's first column with the default translation keys

3. Add your translations to the second column

4. Make your Sheet publicly available (readable)

5. Go to https://console.cloud.google.com/apis/library/sheets.googleapis.com and generate an API key

6. When starting the application provide the following environment variables (you can use `.env` too):

- `SHEETS_API_KEY`: Your generated API key

- `TRANSLATION_SPREADSHEET_ID`: https://docs.google.com/spreadsheets/d/`TRANSLATION_SPREADSHEET_ID`/edit#gid=0

- `TRANSLATION_SHEET_NAME`: The name of the Sheet which can be found on the lowest part of the Spreadsheet page (by default it is `Sheet1`)

7. If the environment variables are provided, the app will try to download and merge the Spreadsheet translations into the defaults on each page load.

Check out the following sheet for an example structure: https://docs.google.com/spreadsheets/d/1KNi3vxCagcMp0x7dFKfo_CnIkWMaCwHadRPwuz23xm8/edit#gid=0

## Frontend environment variables

Some config env vars are used by the frontend, like Google Analytics tracking ID. This is separated into a `client-config.ts` file, as we want to avoid exposing sensitive configurations.

If you'd like to add additional env config that is visible to the client, you'll also have to include the variable in the `next.config.js` file's `new webpack.EnvironmentPlugin` object, so that it is injected into the frontend code during build time.