├── .editorconfig ├── .github └── cryb.png ├── CODE_OF_CONDUCT.md ├── README.md ├── SECURITY.md ├── beginners-guide ├── .gitignore ├── README.md └── getting-started │ ├── Comprehensive Guide.md │ ├── assets │ ├── discord-create-01.png │ ├── discord-dashboard-01.png │ ├── discord-setup-01.png │ ├── discord-setup-02.png │ └── discord-setup-03.png │ ├── discord.md │ └── macOS │ ├── aperture.md │ ├── api.md │ ├── assets │ ├── api-env-01.png │ ├── api-run-01.png │ ├── portals-run-01.png │ ├── web-run-01.png │ └── web-run-02.png │ ├── portal.md │ ├── portals.md │ ├── setup.md │ └── web.md └── code-style ├── .editorconfig ├── README.md └── tslint.json /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | 3 | root = true 4 | 5 | [*] 6 | charset = utf-8 7 | end_of_line = lf 8 | indent_size = 2 9 | indent_style = space 10 | insert_final_newline = true 11 | trim_trailing_whitespace = true 12 | 13 | [*.md] 14 | trim_trailing_whitespace = false 15 | 16 | [{*.json,*.yml}] 17 | indent_size = 2 18 | -------------------------------------------------------------------------------- /.github/cryb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/.github/cryb.png -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Cryb Code of Conduct 2 | 3 | Cryb is dedicated to providing a harassment-free experience for everyone. 4 | We do not tolerate harassment of participants in any form. 5 | 6 | This code of conduct applies to all Cryb spaces, including Cryb repositories, both online and off. 7 | Anyone who violates this code of conduct may be sanctioned or expelled from these spaces at the discretion of Cryb. 8 | 9 | Some Cryb spaces may have additional rules in place, which will be made clearly available to participants. 10 | Participants are responsible for knowing and abiding by these rules. 11 | 12 | ## Harassment 13 | 14 | Harassment includes: 15 | 16 | * Offensive comments related to gender, gender identity and expression, sexual orientation, disability, 17 | mental illness, neuro(a)typicality, physical appearance, body size, age, race, or religion. 18 | * Unwelcome comments regarding a person’s lifestyle choices and practices, 19 | including those related to food, health, parenting, drugs, and employment. 20 | * Deliberate misgendering or use of ‘dead’ or rejected names. 21 | * Gratuitous or off-topic sexual images or behaviour in spaces where they’re not appropriate. 22 | * Physical contact and simulated physical contact (eg, textual descriptions like “*hug*” or “*backrub*”) without consent or after a request to stop. 23 | * Threats of violence. 24 | * Incitement of violence towards any individual, including encouraging a person to commit suicide or to engage in self-harm. 25 | * Deliberate intimidation. 26 | * Stalking or following. 27 | * Harassing photography or recording, including logging online activity for harassment purposes. 28 | * Sustained disruption of discussion. 29 | * Unwelcome sexual attention. 30 | * Pattern of inappropriate social contact, such as requesting/assuming inappropriate levels of intimacy with others. 31 | * Continued one-on-one communication after requests to cease. 32 | * Deliberate “outing” of any aspect of a person’s identity without their consent except as necessary to protect vulnerable people from intentional abuse. 33 | * Publication of non-harassing private communication. 34 | 35 | Cryb prioritizes marginalized people’s safety over privileged people’s comfort. Cryb reserves the right not to act on complaints regarding: 36 | 37 | * ‘Reverse’ -isms, including ‘reverse racism,’ ‘reverse sexism,’ and ‘cisphobia’. 38 | Reasonable communication of boundaries, such as “leave me alone,” “go away,” or “I’m not discussing this with you.” 39 | * Communicating in a ‘tone’ you don’t find congenial. 40 | * Criticizing racist, sexist, cissexist, or otherwise oppressive behavior or assumptions. 41 | 42 | ## Reporting 43 | 44 | If you are being harassed by a member of Cryb, notice that someone else is being harassed, or have any other concerns, 45 | **please [contact us via a GitHub issue on `@cryb/library`](https://github.com/crybapp/library/issues/new).** 46 | If the person who is harassing you is on the team, they will recuse themselves from handling your incident. We will respond as promptly as we can. 47 | 48 | This code of conduct applies to Cryb spaces, but if you are being harassed by a member of Cryb outside our spaces, 49 | we still want to know about it. We will take all good-faith reports of harassment by Cryb members, especially Cryb leadership, seriously. 50 | This includes harassment outside our spaces and harassment that took place at any point in time. 51 | The abuse team reserves the right to exclude people from Cryb based on their past behavior, 52 | including behavior outside Cryb spaces and behavior towards people who are not in Cryb. 53 | 54 | In order to protect volunteers from abuse and burnout, we reserve the right to reject any report we believe to have been made in bad faith. 55 | Reports intended to silence legitimate criticism may be deleted without response. 56 | 57 | We will respect confidentiality requests for the purpose of protecting victims of abuse. At our discretion, 58 | we may publicly name a person about whom we’ve received harassment complaints, or privately warn third parties about them, 59 | if we believe that doing so will increase the safety of Cryb members or the general public. 60 | We will not name harassment victims without their affirmative consent. 61 | 62 | ## Consequences 63 | 64 | Participants asked to stop any harassing behavior are expected to comply immediately. 65 | 66 | If a participant engages in harassing behavior, Cryb may take any action they deem appropriate, up to and including expulsion 67 | from all Cryb spaces and identification of the participant as a harasser to other Cryb members or the general public. 68 | 69 | --- 70 | 71 | We’re always adding and changing these Guidelines. We’ll keep you updated to changes on 72 | [Twitter](https://twitter.com/crybhq) and [Discord](https://discord.gg/xdhEgD5). 73 | 74 | Feel free to also [open an issue and/or Pull Request on `@cryb/library`](https://github.com/crybapp/library/issues/new) 75 | suggesting any changes or corrections. 76 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![Cryb OSS](.github/cryb.png "Cryb OSS Logo") 2 | 3 | **@cryb/library** - _Information & more_ 4 | 5 | ## Table of Contents 6 | 7 | * [Beginners Guide](beginners-guide/README.md) 8 | * [Code style](code-style/README.md) 9 | * [Code of Conduct](CODE_OF_CONDUCT.md) 10 | * [Security Policy](SECURITY.md) 11 | -------------------------------------------------------------------------------- /SECURITY.md: -------------------------------------------------------------------------------- 1 | # Security Policies and Procedures 2 | 3 | ⚠️ **Do NOT open public issues on GitHub to report security vulnerabilities.** ⚠️ 4 | 5 | In Cryb we believe in transparency, but in order to ensure the safety of everyone and that we can handle issues properly, 6 | we have a list of procedures when it comes to report security vulnerabilities in the project. 7 | 8 | We handle found security vulnerabilities in a [responsible disclosure](https://en.wikipedia.org/wiki/Responsible_disclosure) manner, 9 | based in the following procedures that will be followed: 10 | 11 | - Report gets sent to the team, which is handled in a confidential way. 12 | - Confirm the problem and determine the affected versions. 13 | - Determine any similar problems, and fix all the found issues. 14 | - Make an emergency Security issue. 15 | - Make an announcement encouraging people to update as soon as possible. 16 | - Document the found issues and steps that were provided in the report. 17 | 18 | --- 19 | 20 | If you find a security vulnerability, please follow any of the specified methods: 21 | 22 | - Send us your report to . 23 | - On Discord, send a private message to `JeDaYoshi#7942`. 24 | 25 | Preferably, use PGP encryption with [this PGP key](https://jeda.im/pgp.asc) (public key `8060B288C274219D`). 26 | 27 | Please include all steps to reproduce in your report, and any hints which can help us identify the issue if possible. 28 | 29 | --- 30 | 31 | ## Additional changes for this Policy 32 | 33 | These procedures and this policy are up to additional revision and suggestions. 34 | Please [open an issue and/or Pull Request on `@cryb/library`](https://github.com/crybapp/library/issues/new) 35 | and it will be reviewed by our team. 36 | -------------------------------------------------------------------------------- /beginners-guide/.gitignore: -------------------------------------------------------------------------------- 1 | # General 2 | .DS_Store 3 | .AppleDouble 4 | .LSOverride 5 | 6 | # Icon must end with two \r 7 | Icon 8 | 9 | 10 | # Thumbnails 11 | ._* 12 | 13 | # Files that might appear in the root of a volume 14 | .DocumentRevisions-V100 15 | .fseventsd 16 | .Spotlight-V100 17 | .TemporaryItems 18 | .Trashes 19 | .VolumeIcon.icns 20 | .com.apple.timemachine.donotpresent 21 | 22 | # Directories potentially created on remote AFP share 23 | .AppleDB 24 | .AppleDesktop 25 | Network Trash Folder 26 | Temporary Items 27 | .apdisk 28 | -------------------------------------------------------------------------------- /beginners-guide/README.md: -------------------------------------------------------------------------------- 1 | ![Cryb OSS](../.github/cryb.png "Cryb OSS Logo") 2 | 3 | _**Beginners Guide**_ 4 | 5 | Welcome to the beginners guide for setting up an instance of Cryb. 6 | You can use the following guides on how to setup an instance of Cryb, even if you don't code yourself. 7 | 8 | It should be pretty self explanatory, and we're working on creating guides for the platforms of your choice. 9 | 10 | So, let's get started! 11 | 12 | ## What platform are you looking to deploy Cryb on? 13 | 14 | * Windows (*guide coming soon*) 15 | * macOS (66% completed) 16 | * [Setup](getting-started/macOS/setup.md) 17 | * [Setting up API](getting-started/macOS/api.md) 18 | * [Setting up Web](getting-started/macOS/web.md) 19 | * [Setting up Portals](getting-started/macOS/portals.md) 20 | * Setting up Portal (*guide coming soon*) 21 | * Setting up Aperture (*guide coming soon*) 22 | * Linux 23 | * Ubuntu (*guide coming soon*) 24 | * Kubernetes (*guide coming soon*) 25 | 26 | ## Contributing 27 | 28 | If you're interested in creating a guide for your platform, then create a pull request.. 29 | -------------------------------------------------------------------------------- /beginners-guide/getting-started/Comprehensive Guide.md: -------------------------------------------------------------------------------- 1 | # Cryb beginners guide Janus Edition 2 | 3 | Welcome to the beginners guide for setting up Cryb with the Janus SFU. Some really important things to note: 4 | 5 | * Janus absolutely requires Linux in order to run. We've packaged this up in a docker container for you so it is able to run everywhere 6 | * We will be setting everything up under the assumption of using the Docker driver. This driver supports automatic creation and deletion so it's a better choice for most people. 7 | * Later versions of this guide will visit some best practices to use for network security. 8 | * This is not the only way to set it up and this guide will be expanded to accomodate more setup scenarios. 9 | 10 | now that all that stuff is over, let's begin! 11 | 12 | # Inital reqirements: 13 | Cryb needs a couple things in order to run properly. Namely NodeJS, Redis, MongoDB, and Docker. 14 | *Git is optional but reccomended so I will include instructions here* 15 | 16 | ## NodeJS 17 | NodeJS is a javascript runtime for running JS apps on your computer. It powers the Cryb Code. Don't worry too much about what that means if it's confusing, just know we need it. 18 | 19 | ### windows 20 | 21 | Headover to the [Node download page](https://nodejs.org/en/download/) and pick the correct installer for your system. 22 | 23 | ![Imgur](https://i.imgur.com/BVRdfav.png) 24 | 25 | 1. Once the installer is downloaded run it 26 | 2. Leave everything default and click next a couple of times. 27 | 3. It may require administrative permissions. Click yes on the UAC prompt. 28 | 4. Click finish then it's done! 29 | 30 | Let's check the install by opening up powershell/command prompt, then typing the command ```node -v``` 31 | 32 | if you see a version number it worked! 33 | 34 | ### MacOS / Linux 35 | The installation for Mac and Linux is much the same as above just grab the installer for your systems and let it all be default. 36 | 37 | If you want to use a package manager follow the instructions [here](https://nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions-enterprise-linux-fedora-and-snap-packages) 38 | ******************* 39 | 40 | ## MongoDB 41 | MongoDB is the database Cryb uses to make stuff work. Follow their guide [here](https://docs.mongodb.com/manual/installation/#mongodb-community-edition-installation-tutorials) to get it installed. I reccomend leaving it as a service, but you may not want it on all the time, so that's up to you. 42 | *** 43 | ## Docker 44 | Docker is our magic cross-platform bullet. And by magic I mean that it just lets us run everything in linux on a windows computer. Please follow their guides [here](https://docs.docker.com/install/) for your operating system. 45 | 46 | If you're on windows you'll need to take an extra step after installing docker for windows. 47 | 48 | find the docker icon in the system try, right click and click on Settings: 49 | ![Imgur](https://i.imgur.com/lOm8X5f.png) 50 | 51 | Under general find and check the box for "Expose daemon on tcp://localhost:2375 without TLS" 52 | ![Imgur](https://i.imgur.com/WAILYRM.png) 53 | 54 | Now you're all setup! 55 | 56 | *** 57 | ## Redis 58 | Redis is a in memory key/value store that cryb uses for temporary data and a Pub/Sub interface. That is, it's super fast and helps out alot. 59 | 60 | 61 | Redis is only compiled for *nix machines, as such it is not available in a super easy manner for windows users. Enter: Docker. 62 | 63 | open powershell, teminal, or command prompt and run the command: 64 | ```docker run --name redis-server -p 6379:6379 redis``` 65 | That will setup the redis server with default settings and is enough for Cryb. 66 | 67 | If you don't want to keep the command prompt open use this command instead 68 | ```docker run -d --name redis-server -p 6379:6379 redis``` 69 | This will run redis in detached mode which will keep it on all the time, without you having to keep the command prompt open. 70 | 71 | *** 72 | 73 | ## Git 74 | Git is a source control tool but it also makes cryb easy to download and update 75 | Follow these [instructions](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) to get it set up for your OS. After that we are ready to setup Cryb! 76 | 77 | *** 78 | # Time to setup cryb 79 | Now that we've got all the applicationswe need ready and raring to go. It's time to get cryb and configure it. We're going to focus on an installation for localhost as it's the easiest to understand. 80 | 81 | ## Let's git down to buisness 82 | 83 | The first thing we must do is download the cryb application. Git makes this nice and easy. 84 | Open command prompt/terminal/powershell and ``cd`` to a good containing directory. I'll be using ``Desktop/Cryb`` for this. 85 | 86 | So from ``Desktop/Cryb`` in our powershell window we're gonna need to run these 5 commands: 87 | 88 | ``` 89 | git clone https://github.com/crybapp/api.git 90 | git clone https://github.com/crybapp/web.git 91 | git clone https://github.com/crybapp/portals.git 92 | git clone https://github.com/crybapp/portal.git 93 | git clone https://github.com/crybapp/janus-docker.git 94 | ``` 95 | 96 | after that if you use the ``ls`` command (or ``dirs`` in command prompt) the directory should look something like this: 97 | ``` 98 | Mode LastWriteTime Length Name 99 | ---- ------------- ------ ---- 100 | d----- 2/11/2020 4:10 PM api 101 | d----- 1/20/2020 8:59 AM janus-docker 102 | d----- 2/17/2020 10:24 AM portal 103 | d----- 2/17/2020 5:39 PM portals 104 | d----- 2/20/2020 9:46 AM web 105 | ``` 106 | (This is powershell output. It might look a little different on your os, but as long as the names are there you're good to go.) 107 | 108 | ## API 109 | The Api microservice acts as the entrypoint into the backend of cryb. This service handles communication with web, rooms, and chat, as well as authentication with discord. 110 | 111 | ### The dreaded .env file 112 | Most of crybs configuration happens in a .env file. This is a file to override specific Enviornment variables for an easy configuration. 113 | 114 | If you want to copy and paste a working env file, it should end up like this: 115 | 116 | ``` 117 | NODE_ENV=development 118 | 119 | PORT=4000 120 | 121 | JWT_KEY=bigcrybfan 122 | 123 | PORTALS_API_URL=http://localhost:5000 124 | PORTALS_API_KEY=Thinkingwithportals 125 | 126 | APERTURE_WS_KEY=unused 127 | APERTURE_WS_URL=ws://localhost:9001 128 | 129 | MONGO_URI=mongodb://localhost:27017/Cryb 130 | REDIS_URI=redis://localhost:6379 131 | 132 | DISCORD_CLIENT_ID= 133 | DISCORD_CLIENT_SECRET= 134 | DISCORD_CALLBACK_URL=http://localhost:3000/auth/discord 135 | 136 | DISCORD_OAUTH_ORIGINS=http://localhost:3000,http://localhost,http://localhost:4000 137 | 138 | MIN_MEMBER_PORTAL_CREATION_COUNT=1 139 | MAX_ROOM_MEMBER_COUNT=100 140 | ``` 141 | 142 | Now that we have a baseline let's break it all down: 143 | 144 | #### NODE_ENV 145 | The NODE_ENV variable sets the applications context and enables and disables certain tool depending on it's setting 146 | 147 | for the purposes of Cryb it has 2 values: ``development`` and ``production`` 148 | ``development``: Tells api to turn on more detailed logging. 149 | ``productions``: Turns it off. 150 | 151 | #### PORT 152 | The TCP Port to listen on. this should stay as 4000 unless you know what you are doing. 153 | 154 | #### JWT_KEY 155 | This is a key used to encrypt the messages between Api and other services. It can be anything you want it to be. It will be used again. 156 | 157 | This should, ideally, be a randomized base64 number of sufficent length for maximum security. but that won't affect whether or not it works. 158 | 159 | #### PORTALS_API_URL 160 | This is the http endpoint for the portals microservice. Leaving it as it appears above should be fine. 161 | 162 | #### PORTALS_API_KEY 163 | This is the key set in the .env for portals under the variable ``API_KEY``. It works the same as the JWT_KEY in that it really doesn't matter what you put. 164 | 165 | #### APERTURE_WS_KEY and APERTURE_WS_URL 166 | These variables deal with running Cryb using aperture and are not applicable here. They are still enforced by API, however, so we must set them. Leave them how they are above. 167 | 168 | #### MONGO_URI 169 | The url for the mongodb database we installed earlier. Leaving it as it appears above should be fine. 170 | 171 | #### REDIS_URI 172 | The url for the redis service we setup earlier. Leave it as it is. 173 | 174 | #### DISCORD_CLIENT_ID 175 | This variable is used so discord knows who is trying to authenticate with them. We will set it in the next section as it requires some configuration on discord's end. 176 | 177 | #### DISCORD_CLIENT_SECRET 178 | This variable is used to authenticate your application with discord. We will set it in the next section for the same reason above. 179 | 180 | #### DISCORD_CALLBACK_URL 181 | This variable tells discord where to send responses back to. We need it to go to API/auth/discord. so just leave it alone. 182 | 183 | #### DISCORD_OAUTH_ORIGINS 184 | This variable let's discord know what URL's to accept requests from. Leave it alone. 185 | 186 | #### MAX_MEMBER_PORTAL_CRATION_COUNT 187 | This variable sets how many people need to be in the room before a portal starts up. I use 1 for testing and two for production. 188 | 189 | #### MAX_ROOM_MEMBER_COUNT 190 | This variable sets the maximum allowed people in the room. go crazy. 191 | 192 | 193 | WOOO That's a lot to take in. We got a little bit more to go before API is ready though. 194 | *** 195 | ## Discord settings 196 | You're going to need to register an application with discord in order to get everything to work nicely. and here's how we do it. 197 | 198 | Go to [the discord developer portal](https://discordapp.com/developers/applications) and log in to your discord account 199 | 200 | Click the New Application button in the top left. 201 | ![Imgur](https://i.imgur.com/wLV4uWy.png) 202 | 203 | Give it a name in the pop up then click create 204 | 205 | You should see a screen like this 206 | ![Imgur](https://i.imgur.com/DKWEb61.png) 207 | Look familiar? 208 | 209 | You'll need to copy the client ID and paste it into DISCORD_CLIENT_ID in the .env and do the same to CLIENT_SECRET (Just put it in DISCORD_CLIENT_SECRET) 210 | 211 | Yay! Api is full configured... but discord still won't work yet. 212 | 213 | ### Oauth settings 214 | oauth is how we get authentication information from discord. in order for that to work discord needs to know so url's to send you to. 215 | 216 | In the developer page find the OAuth2 option on the sidebar 217 | ![Imgur](https://i.imgur.com/t26nRam.png) 218 | Under the redirects you'll need to add a few urls 219 | ![Imgur](https://i.imgur.com/NdaReq5.png) 220 | The Localhost:4000 is the most important but adding all for good measure doesn't hurt. 221 | 222 | Congrats API is setup! 223 | 224 | # Portals 225 | Portals manages the VM's for us. It'll create them, tear them down, and make sure they're healthy. 226 | The .env.example file has a lot of options, but it's less than it looks like. 227 | 228 | Here's a minimal working version of a .env to go with API above. 229 | 230 | ## Windows: 231 | 232 | ``` 233 | NODE_ENV=development 234 | 235 | PORT=5000 236 | 237 | API_URL=http://localhost:4000 238 | API_KEY=thinkingwithportals 239 | 240 | PORTAL_KEY=space 241 | 242 | MONGO_URI="mongodb://localhost:27017/Cryb" 243 | REDIS_URI=redis://localhost:6379 244 | 245 | DRIVER=docker 246 | 247 | DOCKER_HOST=http://127.0.0.1 248 | DOCKER_PORT=2375 249 | DOCKER_IMAGE=cryb/portal 250 | DOCKER_SHM_SIZE=1024 251 | 252 | ENABLE_JANUS=true 253 | JANUS_HOSTNAME=localhost 254 | JANUS_STREAMING_ADMIN_KEY=testing 255 | JANUS_PORT=8088 256 | ``` 257 | 258 | ## *nix: 259 | 260 | ``` 261 | NODE_ENV=development 262 | 263 | PORT=5000 264 | 265 | API_URL=http://localhost:4000 266 | API_KEY=thinkingwithportals 267 | 268 | PORTAL_KEY=space 269 | 270 | MONGO_URI="mongodb://localhost:27017/Cryb" 271 | REDIS_URI=redis://localhost:6379 272 | 273 | DRIVER=docker 274 | 275 | DOCKER_SOCK=/var/run/docker.sock 276 | DOCKER_IMAGE=cryb/portal 277 | DOCKER_SHM_SIZE=1024 278 | 279 | ENABLE_JANUS=true 280 | JANUS_HOSTNAME=localhost 281 | JANUS_STREAMING_ADMIN_KEY=testing 282 | JANUS_PORT=8088 283 | ``` 284 | 285 | Let's break this down. 286 | 287 | #### NODE_ENV 288 | Same as in API 289 | 290 | #### PORT 291 | Same as API. Don't touch unless you know what you're doing. 292 | 293 | #### API_URL 294 | The HTTP url for the API service. You should be able to leave as is without problems. 295 | 296 | #### API_KEY 297 | This is the key used to authenticate the API microservice. It should be the same value from API's PORTALS_API_KEY 298 | 299 | #### PORTAL_KEY 300 | This is the key used to authenticate the individual VMs and allow them to get configuration information. This will be the same as portal .env in a later section. 301 | 302 | #### MONGO_URI & REDIS_URI 303 | Exact same as in API 304 | 305 | #### DRIVER 306 | The driver is a series of modules that allow cryb to interact with different cloud provders and VM architecture. 307 | 308 | Available drivers at the time of writing are: 309 | * Manual 310 | * Docker 311 | * DigitalOcean 312 | * HetznerCloud 313 | * GCloud 314 | * Kubernetes 315 | 316 | Each driver has it's own configuration to add to .env that you can find in .env.example. 317 | 318 | For now we're using docker driver. 319 | 320 | #### DOCKER_SOCK 321 | The unix socket to communicate with the docker api. leave it as the default for now. 322 | 323 | #### DOCKER_HOST & DOCKER_PORT 324 | The address for the local machine's docker API. Leave it as default. 325 | 326 | #### DOCKER_IMAGE 327 | This the image to run for the portal. We'll be building it later but leave it as ``Cryb/Portal`` 328 | 329 | #### DOCKER_SHM_SIZE 330 | This is the size of the shared memory that docker will use. Don't change this unless you know what you're doing. 331 | 332 | #### ENABLE_JANUS 333 | This value tells portals to use Janus for transport instead of aperture. 334 | 335 | #### JANUS_HOSTNAME 336 | this is the dns value for the janus server. Odds are leaving it as local host will work. 337 | **DO NOT PUT HTTP:// IN FRONT OF IT OR A PORT NUMBER AT THE BACK. IT WILL FIGURE IT OUT.** 338 | 339 | #### JANUS_STREAMING_ADMIN_KEY 340 | This is the key used to let janus know you are authorized to create endpoints. It is configured in janus.plugin.streaming.jcfg 341 | 342 | #### JANUS_PORT 343 | This is the port that the JANUS http server listens on 8088 by default. 344 | 345 | Luckily after the ENV portals is good to go. 346 | *** 347 | # JANUS 348 | 349 | Janus is our SFU or Selective Forwarding Unit. It's job is to make sure only the right traffic gets to users. 350 | 351 | Default settings for janus are enough for most users. 352 | 353 | to get this ready all you need to do is run 354 | ``docker build . -t cryb/janus`` 355 | This will build the docker image so we can run it later. 356 | 357 | *** 358 | # Portal 359 | Portal is the individual VM that we use to host the browser. 360 | 361 | Here's a working .env file for it 362 | Docker for windows 363 | ``` 364 | NODE_ENV=development 365 | 366 | PORTALS_WS_URL=ws://host.docker.internal:1337 367 | PORTALS_KEY=space 368 | 369 | STREAMING_URL=host.docker.internal 370 | STREAMING_KEY="unused" 371 | 372 | # The Display services like Chromium and ffmpeg will use 373 | DISPLAY=:100 374 | 375 | VIDEO_WIDTH=1280 376 | VIDEO_HEIGHT=720 377 | VIDEO_FPS=24 378 | VIDEO_BITRATE=2400000 379 | 380 | AUDIO_ENABLED=true 381 | AUDIO_BITRATE=128000 382 | 383 | IS_CHROMIUM_DARK_MODE=true 384 | STARTUP_URL=https://google.com 385 | ``` 386 | Docker for everything else 387 | ``` 388 | NODE_ENV=development 389 | 390 | PORTALS_WS_URL=ws://127.0.0.1:5000 391 | PORTALS_KEY=space 392 | 393 | STREAMING_URL=127.0.0.1 394 | STREAMING_KEY=unused 395 | 396 | # The Display services like Chromium and ffmpeg will use 397 | DISPLAY=:100 398 | 399 | VIDEO_WIDTH=1280 400 | VIDEO_HEIGHT=720 401 | VIDEO_FPS=24 402 | VIDEO_BITRATE=2400000 403 | 404 | AUDIO_ENABLED=true 405 | AUDIO_BITRATE=128000 406 | 407 | IS_CHROMIUM_DARK_MODE=true 408 | STARTUP_URL=https://google.com 409 | ``` 410 | 411 | #### NODE_ENV 412 | Same as API 413 | 414 | #### PORTALS_WS_URL 415 | This is the address of the portals WS server. Default will work fine. 416 | 417 | #### PORTALS_KEY 418 | This is the key used to authenticate with the portals microservice 419 | 420 | #### STREAMING_URL 421 | This is the host name to send A/V data too. It should be left alone. 422 | 423 | #### STREAMING_KEY 424 | This isn't used in the janus implementation 425 | 426 | #### DISPLAY 427 | The linux display number to use. Don't change unless you know what you are doing. 428 | 429 | #### VIDEO_WIDTH & VIDEO_HEIGHT 430 | The resolution of the output video. This is what will be streamed to you. 431 | 432 | #### VIDEO_FPS 433 | The framerate of the output video. This is what will be streamed to you. 434 | 435 | #### VIDEO_BITRATE 436 | How much memory the video can use per second. Higher values create higher quality at the cost of more network bandwidth 437 | 438 | #### AUDIO_ENABLED 439 | This enables audio capture and transmit. 440 | 441 | #### AUDIO_BITRATE 442 | This is the same as video bitrate. Higher values mean more fidelity. 443 | 444 | #### IS_CHROMIUM_DARK_MODE 445 | Darkmode option for the browser 446 | 447 | #### STARTUP_URL 448 | Allows you to set the website to open on. 449 | 450 | Configuration complete! 451 | 452 | # Running the service. 453 | -------------------------------------------------------------------------------- /beginners-guide/getting-started/assets/discord-create-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/assets/discord-create-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/assets/discord-dashboard-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/assets/discord-dashboard-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/assets/discord-setup-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/assets/discord-setup-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/assets/discord-setup-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/assets/discord-setup-02.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/assets/discord-setup-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/assets/discord-setup-03.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/discord.md: -------------------------------------------------------------------------------- 1 | # Setting up a Discord application 2 | Currently, Cryb relies on `Login with Discord` for initial authentication. This guide will tell you how to setup a [Discord](https://discordapp.com) application for use with Cryb. 3 | 4 | ## Docs 5 | * [Creating an application](#creating-an-application) 6 | * [Setting up OAuth2](#setting-up-oauth2) 7 | * [Next step](#next-step) 8 | 9 | ## Creating an application 10 | *If you don't have a Discord account, you can sign up [here](https://discordapp.com/register).* 11 | 12 | First of all, we need to create a Discord application. This will allow us to authenticate users with the Discord API, creating a seamless login experiance. 13 | 14 | Go to https://discordapp.com/developers/applications in your browser, and click 'New Application' in the top right. 15 | 16 | ![Creating an application](assets/discord-dashboard-01.png) 17 | 18 | You'll want to give your application a name. Once you're done, just click 'Create'. 19 | 20 | ![Naming & app creation](assets/discord-create-01.png) 21 | 22 | Now you've successfully created a Discord application! You'll be able to see your Discord client id and client secret here, make sure to keep these copied somewhere as you'll need them later. 23 | 24 | ![Client ID & Client Secret](assets/discord-setup-01.png) 25 | 26 | You can also give your application a special icon if you want, but you don't have to. 27 | 28 | **Footnotes** 29 | * You'll want to copy the client ID and client secret to the environment variables in `@cryb/api`. 30 | * **Never share your Discord Client Secret with anyone, even if they say they're from Discord or Cryb. This will let anyone pretend to be any user on your Cryb instance, or worse.** 31 | 32 | ## Setting up OAuth2 33 | Next, let's setup the OAuth2. Click 'OAuth2' on the side tab bar, and then 'Add Redirect' under the 'Redirects' section. 34 | 35 | ![Adding a Redirect URI](assets/discord-setup-02.png) 36 | 37 | You'll want to enter any URLs that your Cryb instance can be accessed on here, followed by `/auth/discord`. 38 | 39 | Add `http://localhost:3000/auth/discord`, which will be used when you're running Cryb locally. You can also add other URLs here, such as a domain. Once you've added your redirect URIs, just press 'Save Changes' and you're done! 40 | 41 | ![Adding a Redirect URI: Part 2](assets/discord-setup-03.png) 42 | 43 | ## Next step 44 | Now you can setup Cryb with the platform of your choice. See the links below for guides on how to setup Cryb: 45 | 46 | * Windows (*guide coming soon*) 47 | * [macOS](macOS/setup.md) 48 | * Linux 49 | * Ubuntu (*guide coming soon*) 50 | * Kubernetes (*guide coming soon*) -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/aperture.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/macOS/aperture.md -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/api.md: -------------------------------------------------------------------------------- 1 | # Setting up API 2 | API will handle requests from our client, in this case `@cryb/web`, such as creating rooms or sending messages. 3 | 4 | ## Docs 5 | * [Pre-setup requirements](#pre-setup-requirements) 6 | * [Cloning API](#cloning-api) 7 | * [Installing Dependencies](#installing-dependencies) 8 | * [Setting up environment variables](#setting-up-environment-variables) 9 | * [Running API](#running-api) 10 | * [Next step](#next-step) 11 | 12 | ## Pre-setup requirements 13 | **If you've already setup a Discord application, you can skip this step and continue to [Cloning API](#cloning-api)** 14 | 15 | You'll need to create an application with Discord to setup and use `@cryb/api`. There's a guide for that [here](../discord.md), so if you haven't got a Discord application created, get that done now as you'll need a client id and client secret to finish this guide! 16 | 17 | ## Cloning API 18 | 19 | First, we'll need to clone `@cryb/api` from GitHub. In your terminal, type the following and hit enter: 20 | 21 | ```sh 22 | git clone https://github.com/crybapp/api.git 23 | ``` 24 | 25 | This will clone all our API code into a folder called `api`. Let's enter that folder using `cd api`. 26 | 27 | ## Installing Dependencies 28 | 29 | Once we're in the API folder, we'll need to install the dependencies that are required to run API. Simply run `yarn` in your Terminal and all the dependencies are downloaded and installed like magic. 30 | 31 | ## Setting up environment variables 32 | 33 | Now we'll need to setup our `.env` file. Our environment file will dictate everything from URLs of other Cryb services to Discord client secrets which API needs to to able to run on your system. 34 | 35 | Let's copy the example `.env` file so it's easier to get started by running the command below: 36 | 37 | ```sh 38 | cp .env.example .env 39 | ``` 40 | 41 | This will copy the `.env.example` file to `.env`. Now let's edit that file. You can use any text editor of your choice, we'll use Vim in this case. Just run: 42 | 43 | ```sh 44 | vi .env 45 | ``` 46 | 47 | Now, press `i` to go into insert mode. Let's first of all fill in `NODE_ENV`. Position your cursor using the up, down, left and right arrows on your keyboard so the block cursor is positioned after the `=` after `NODE_ENV`, like below: 48 | 49 | ![An example image showing how to properly input .env variables](assets/api-env-01.png) 50 | 51 | Let's write `development` to show we're running `@cryb/api` in Development mode. If you're running `@cryb/api` in production, on a [MacStadium](https://www.macstadium.com/) server for example, write `production`. 52 | 53 | You'll need to do this for the rest of the unset values in the `.env` file. Use the handy table below to decide what you'll need to enter for each file: 54 | 55 | | **Variable Name** | **Description** | **Recommended Value** | 56 | |-------------------------|------------------------------------------------------------------------------------|---------------------------------------------------------------------| 57 | | `NODE_ENV` | Used for setting the environment of `@cryb/api` | development | 58 | | `PORT` | Used for setting the port `@cryb/api` will listen on | 4000 | 59 | | `JWT_KEY` | Used for signing / verifying client tokens | *A long, random string with a mix of capitals, numbers and symbols* | 60 | | `PORTALS_API_URL` | The base URL of `@cryb/portals` | http://localhost:1337 | 61 | | `PORTALS_API_KEY` | Used for signing / verifying transport tokens to `@cryb/portals` | *See `JWT_KEY`* | 62 | | `APERTURE_WS_URL` | The WebSocket URL of `@cryb/aperture` | ws://localhost:1337 | 63 | | `APERTURE_WS_KEY` | Used for signing / verifying WebSocket tokens to `@cryb/aperture` | *See `JWT_KEY`* | 64 | | `MONGO_URI` | The URI of the MongoDB database | mongodb://localhost:27017/cryb | 65 | | `REDIS_URI` | The URI of the Redis database | redis://localhost:6379 | 66 | | `DISCORD_CLIENT_ID` | The client ID of the Discord Oauth2 application | *See [Discord setup](../discord.md)* | 67 | | `DISCORD_CLIENT_SECRET` | The client secret of the Discord Oauth2 application | *See [Discord setup](../discord.md)* | 68 | | `DISCORD_CALLBACK_URL` | The callback URL for Discord Oauth2 application that should be sent to `@cryb/web` | http://localhost:3000/auth/discord | 69 | | `DISCORD_OAUTH_ORIGINS` | A list of comma-separated origins that Oauth2 logins should be accepted from | http://localhost:3000 | 70 | 71 | Once we've got that out of the way, simply press the Escape key on your keyboard and write `:wq` to save and exit Vim. 72 | 73 | ## Running API 74 | Now everything is setup, let's try run `@cryb/api`. All you need to run is `yarn dev`. This should start API in watch mode. If everything worked, you'll see the following: 75 | 76 | ![An image of what you should see when API is successsfully running](assets/api-run-01.png) 77 | 78 | If you see this - congrats! API is successfully running. If you're having any issues, try going through this page again. If that doesn't help, let us know in a [GitHub issue](https://github.com/crybapp/api/issues) or in #tech-support in our [Discord server](https://discord.gg/ShTATH4). 79 | 80 | ## Next step 81 | Next we'll setup `@cryb/web`: [Setting up Web](./web.md). -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/assets/api-env-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/macOS/assets/api-env-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/assets/api-run-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/macOS/assets/api-run-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/assets/portals-run-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/macOS/assets/portals-run-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/assets/web-run-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/macOS/assets/web-run-01.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/assets/web-run-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crybapp/library/b4c2609b2b6caafdce6bb32f08c1bfe03bb6c92e/beginners-guide/getting-started/macOS/assets/web-run-02.png -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/portal.md: -------------------------------------------------------------------------------- 1 | # Setting up Portal 2 | *Coming soon!* -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/portals.md: -------------------------------------------------------------------------------- 1 | # Setting up Portals 2 | Portals is used as the microservice that queues, creates and destroys VM instances. Controller events sent from `@cryb/web` are also proxied through Portals to each VM instance (Portal). 3 | 4 | ## Docs 5 | 6 | * [Cloning Portals](#cloning-portals) 7 | * [Installing Dependencies](#installing-dependencies) 8 | * [Setting up environment variables](#setting-up-environment-variables) 9 | * [Running Portals](#running-portals) 10 | * [Next step](#next-step) 11 | 12 | ## Cloning Portals 13 | *If you're continuing from [Setting up Web](./web.md), you'll need to run `cd ..` to return to the root `cryb` directory.* 14 | 15 | First, we'll need to clone `@cryb/portals` from GitHub. In your terminal, type the following and hit enter: 16 | 17 | ```sh 18 | git clone https://github.com/crybapp/portals.git 19 | ``` 20 | 21 | This will clone all our Portals code into a folder called `portals`. Let's enter that folder using `cd portals`. 22 | 23 | ## Installing Dependencies 24 | 25 | Now that we're in the Portals folder, we'll need to install the dependencies that are required to run Portals. Simply run `yarn` in your Terminal and all the dependencies are downloaded and installed! 26 | 27 | ## Setting up environment variables 28 | 29 | Now we'll need to setup our `.env` file. Our environment file will dictate everything from URLs of other Cryb services which Portals needs to to able to run on your system. 30 | 31 | Let's copy the example `.env` file so it's easier to get started by running the command below: 32 | 33 | ```sh 34 | cp .env.example .env 35 | ``` 36 | 37 | This will copy the `.env.example` file to `.env`. Now let's edit that file. You can use any text editor of your choice, we'll use Vim in this case. Just run: 38 | 39 | If you followed onto this tutorial from [Setting up API](./api.md), it should be easier to setup `@cryb/portals`'s environment variables. If you didn't read the tutorial for `@cryb/api`, and you're not sure how to setup the environment variables for this deployment, [check here](./api.md#setting-up-environment-variables) for more help. 40 | 41 | Here's a handy table below to decide what you'll need to enter for each file: 42 | 43 | | **Variable Name** | **Description** | **Recommended Value** | 44 | |-------------------|----------------------------------------------------------------|---------------------------------------------------------------------| 45 | | `NODE_ENV` | Used for setting the environment of `@cryb/portals` | development | 46 | | `PORT` | Used for setting the port `@cryb/portals` will listen on | 1337 | 47 | | `API_URL ` | The base URL of `@cryb/api` | http://localhost:4000 | 48 | | `API_KEY ` | The same secure key located under `@cryb/api`'s `.env` file | *A long, random string with a mix of capitals, numbers and symbols* | 49 | | `PORTAL_KEY ` | The same secure key located under `@cryb/portal`'s `.env` file | *See `API_KEY`* | 50 | | `MONGO_URI ` | The URI of the MongoDB database | mongodb://localhost:27017/cryb | 51 | | `REDIS_URI ` | The URI of the Redis database | redis://localhost:6379 52 | 53 | ## Running Portals 54 | Now everything is setup, let's try run `@cryb/portals`. All you need to run is `yarn dev`. This should start Portals in watch mode. If everything worked, you'll see the following: 55 | 56 | ![An image of what you should see when Portals is successsfully running](assets/portals-run-01.png) 57 | 58 | If you're having issues, let us know in a [GitHub issue](https://github.com/crybapp/portals/issues) or in #tech-support in our [Discord server](https://discord.gg/ShTATH4). 59 | 60 | ## Next step 61 | Next we'll setup `@cryb/portal`: [Setting up Portal](./portal.md). 62 | -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/setup.md: -------------------------------------------------------------------------------- 1 | # macOS Setup 2 | Firstly, you'll need to install some developer tools to get Cryb setup on macOS. 3 | 4 | ## Docs 5 | * [Using Terminal](#using-terminal) 6 | * [Tools Needed](#tools-needed) 7 | * [Setting up the folder structure](#setting-up-the-folder-structure) 8 | * [Next step](#next-step) 9 | 10 | ## Using Terminal 11 | You'll want to use `Terminal.app`, which is pre-installed on all macOS installations by default. You can find Terminal under `Appications/Utilities/Terminal.app`. 12 | 13 | Here you'll run all the commands needed to setup Cryb. 14 | 15 | **Footnotes** 16 | * *If you want to use a terminal emulator, such as iTerm or Hyper, then go ahead!* 17 | 18 | ## Tools Needed 19 | * Homebrew 20 | * **Recommended** 21 | * Used for installing required packages 22 | * [Install](https://brew.sh) 23 | * Node.js Runtime 24 | * **Required** 25 | * Used as the runtime for all major Cryb deployments. 26 | * [Install](https://nodejs.org/en/) 27 | * Yarn 28 | * ~~**Recommended**~~ **Required** 29 | * Used instead of `npm` for running deployments and installing packages. 30 | * [Install](https://yarnpkg.com/en/docs/install#mac-stable) 31 | * If you installed Homebrew, you can run `brew install yarn` to install Yarn 32 | * MongoDB 33 | * **Required** 34 | * Used as the primary datastore for `@cryb/api`, `@cryb/portals` and `@cryb/aperture` 35 | * [Install](https://docs.mongodb.com/manual/tutorial/install-mongodb-on-os-x/) 36 | * If you installed Homebrew, you can simply run the following commands to install MongoDB: 37 | * `brew tap mongodb/brew` 38 | * `brew install mongodb-community@4.2` 39 | * You may also want to install a MongoDB GUI, such as [Robo 3T](https://robomongo.org/download) or [MongoDB Compass](https://www.mongodb.com/products/compass) to make it easier to view and edit data inside of your MongoDB server 40 | * Redis 41 | * **Required** 42 | * Used as the primary cache and pub/sub for `@cryb/api` and `@cryb/portals` 43 | * [Install](https://redis.io/topics/quickstart) 44 | * If you installed Homebrew, you can run `brew install redis` to install Redis 45 | * You may also want to install a Redis GUi such as [Medis](https://github.com/luin/medis) to view or edit data and run commands on your Redis server 46 | 47 | ## Setting up the folder structure 48 | Now we have the tools we need installed, we'll setup our folder structure. First of all, open up your Terminal. Now, type the following and hit enter: 49 | 50 | ``` 51 | mkdir cryb 52 | ``` 53 | 54 | This creates a folder called `cryb` in our home folder. Now, we'll want to enter that folder. Type the following and hit enter: 55 | 56 | ``` 57 | cd cryb 58 | ``` 59 | 60 | Now we're in the `cryb` directory, and we're ready to continue onto the next step. 61 | 62 | ## Next step 63 | Next we'll setup `@cryb/api`: [Setting up API](./api.md). -------------------------------------------------------------------------------- /beginners-guide/getting-started/macOS/web.md: -------------------------------------------------------------------------------- 1 | # Setting up Web 2 | Web is used as our primary client for interacting with `@cryb/api` and in some cases `@cryb/aperture`. 3 | 4 | ## Docs 5 | 6 | * [Cloning Web](#cloning-web) 7 | * [Installing Dependencies](#installing-dependencies) 8 | * [Setting up environment variables](#setting-up-environment-variables) 9 | * [Running Web](#running-web) 10 | * [Next step](#next-step) 11 | 12 | ## Cloning Web 13 | *If you're continuing from [Setting up API](./api.md), you'll need to run `cd ..` to return to the root `cryb` directory.* 14 | 15 | First, we'll need to clone `@cryb/web` from GitHub. In your terminal, type the following and hit enter: 16 | 17 | ```sh 18 | git clone https://github.com/crybapp/web.git 19 | ``` 20 | 21 | This will clone all our Web code into a folder called `web`. Let's enter that folder using `cd web`. 22 | 23 | ## Installing Dependencies 24 | 25 | Now that we're in the Web folder, we'll need to install the dependencies that are required to run Web. Simply run `yarn` in your Terminal and all the dependencies are downloaded and installed! 26 | 27 | ## Setting up environment variables 28 | 29 | Now we'll need to setup our `.env` file. Our environment file will dictate everything from URLs of other Cryb services which Web needs to to able to run on your system. 30 | 31 | Let's copy the example `.env` file so it's easier to get started by running the command below: 32 | 33 | ```sh 34 | cp .env.example .env 35 | ``` 36 | 37 | This will copy the `.env.example` file to `.env`. Now let's edit that file. You can use any text editor of your choice, we'll use Vim in this case. Just run: 38 | 39 | If you followed onto this tutorial from [Setting up API](./api.md), it should be easier to setup `@cryb/web`'s environment variables. If you didn't read the tutorial for `@cryb/api`, and you're not sure how to setup the environment variables for this deployment, [check here](./api.md#setting-up-environment-variables) for more help. 40 | 41 | Here's a handy table below to decide what you'll need to enter for each file: 42 | 43 | | **Variable Name** | **Description** | **Recommended Value** | 44 | |-------------------|-----------------------------------------------------|-----------------------| 45 | | `NODE_ENV` | Used for setting the environment of `@cryb/web` | development | 46 | | `API_WS_URL` | The WebSocket URL of `@cryb/api` | ws://localhost:4000 | 47 | | `API_BASE_URL` | The base URL of `@cryb/api` | http://localhost:4000 | 48 | | `WEB_BASE_URL` | The base URL of `@cryb/web` | http://localhost:3000 | 49 | | `COOKIE_DOMAIN` | The domain that should be used to set cookies under | localhost | 50 | | `HOST` | The host `@cryb/web` should run on | 0.0.0.0 | 51 | | `NUXT_PORT` | The port `@cryb/web` should listen on | 3000 | 52 | 53 | ## Running Web 54 | Now everything is setup, let's try run `@cryb/web`. All you need to run is `yarn dev`. This should start Web in watch mode. If everything worked, you'll see the following: 55 | 56 | ![An image of what you should see when Web is successsfully running](assets/web-run-01.png) 57 | 58 | Now, let's go to http://localhost:3000 in our browser to see if Web is running properly. If it is, you'll see the default landing page: 59 | 60 | ![An image of what you should see when Web is successsfully running](assets/web-run-02.png) 61 | 62 | You should be able to login with Discord, and then create and delete rooms. If you can - congrats! Web is successfully running. 63 | 64 | If you're having any issues, we have a couple things you can try doing, see below: 65 | 66 | * **If the web page isn't loading**, try exiting the Web process in your terminal by pressing `Ctrl+C`. Try running the Web process again with `yarn dev`. 67 | * **If `Login with Discord` isn't working**, make sure `@cryb/api` is running in a separate tab. 68 | 69 | If these don't help, let us know in a [GitHub issue](https://github.com/crybapp/web/issues) or in #tech-support in our [Discord server](https://discord.gg/ShTATH4). 70 | 71 | ## Next step 72 | Next we'll setup `@cryb/portals`: [Setting up Portals](./portals.md). 73 | -------------------------------------------------------------------------------- /code-style/.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | 3 | root = true 4 | 5 | [*] 6 | charset = utf-8 7 | end_of_line = lf 8 | indent_size = 2 9 | indent_style = space 10 | insert_final_newline = true 11 | trim_trailing_whitespace = true 12 | 13 | [*.md] 14 | trim_trailing_whitespace = false 15 | 16 | [{*.json,*.yml}] 17 | indent_size = 2 18 | -------------------------------------------------------------------------------- /code-style/README.md: -------------------------------------------------------------------------------- 1 | ![Cryb logo](../.github/cryb.png) 2 | 3 | _**Code Style**_ 4 | 5 | When writing code for Cryb, we would like you to follow these guidelines so we can keep our code clean and consistent across all projects. 6 | 7 | This applies for any JavaScript/TypeScript-based project. For Rust, we stick to `rustfmt`/`clippy` default rules. 8 | 9 | These rules are generally enforced via our `@cryb/eslint-config` package. 10 | If there's a mismatch between the guidelines outlined here, please open an issue. 11 | 12 | ## Table of Contents 13 | 14 | * [General Rules](#general-rules) 15 | * [Variables](#variables) 16 | * [Naming Convention](#naming-convention) 17 | * [Conditional Statements](#conditional-statements) 18 | * [Imports](#imports) 19 | * [Method Chaining](#method-chaining) 20 | * [Comments](#comments) 21 | 22 | ## General Rules 23 | 24 | * Indent size should be two spaces 25 | * Files should end in `LF` with a newline, encoded in `UTF-8` 26 | * No semicolons unless required 27 | * Use single quotes instead of double quotes 28 | 29 | ## Variables 30 | 31 | Use `const` when the variable isn't mutable. Otherwise, use `let`. Never use `var`. 32 | 33 | Ensure that there is a space between different types of variable declarations. There should be room to breathe. 34 | 35 | Example: 36 | 37 | ```ts 38 | const product = 'Cryb' 39 | 40 | let mutableVariable = 'Yo' 41 | ``` 42 | 43 | ### Naming Convention 44 | 45 | Please view the following examples for how variables should be named. 46 | 47 | #### JavaScript / TypeScript 48 | 49 | ```ts 50 | const name = 'William' 51 | const appName = 'Cryb' 52 | ``` 53 | 54 | #### TypeScript Interface 55 | 56 | ```ts 57 | interface Config { 58 | deleteOnExit: boolean 59 | } 60 | ``` 61 | 62 | #### CSS 63 | 64 | ```css 65 | div.profile-wrapper { 66 | background-color: red 67 | } 68 | ``` 69 | 70 | #### Environment Property 71 | 72 | ```env 73 | DELETE_ON_EXIT=1 74 | ``` 75 | 76 | #### JavaScript Config 77 | 78 | ```ts 79 | export default { 80 | delete_on_exit: process.env.DELETE_ON_EXIT 81 | } 82 | ``` 83 | 84 | ## Conditional Statements 85 | 86 | Use the `===` operand for comparing values. 87 | 88 | Statements should be written on new lines, away from the same line as the `if` statement. 89 | 90 | Always have the brackets up against the statement and away from the curly braces. 91 | 92 | Don't use brackets if they are not needed. 93 | 94 | Example: 95 | 96 | ```ts 97 | const product = 'Cryb' 98 | 99 | if (product === 'Cryb') 100 | console.log('Hey look, it\'s Cryb!') 101 | else if (product === 'Some other product name') { 102 | console.log('Oh, it\'s not Cryb.') 103 | 104 | destroyService(product) 105 | } else 106 | return 107 | ``` 108 | 109 | ## Imports 110 | 111 | Sort imports by the following in terms of priority: 112 | 113 | 1. Vendor Packages 114 | 2. Models 115 | 3. Schemas 116 | 4. Interfaces 117 | 5. Utils 118 | 119 | Please also sort by line width. 120 | 121 | Example: 122 | 123 | ```ts 124 | import fs from 'fs' 125 | 126 | import User from './models/user' 127 | 128 | import IUser from './models/user/defs' 129 | import StoredUser from './schemas/user.schema' 130 | 131 | import { extractUserId } from './utils/helpers.utils' 132 | ``` 133 | 134 | ## Method Chaining 135 | 136 | Method chaining is fine—infact we recommend it—but to prevent long lines, please split your method calls up into multiple lines. 137 | 138 | Example: 139 | 140 | ```ts 141 | // ❌ This is too long. 142 | functionCall().then(() => console.log('hey!')).catch(err => console.log('error!')).finally(() => console.log('finally!')) 143 | 144 | // ✔️ This is better and is easier to read. 145 | functionCall() 146 | .then(() => 147 | console.log('hey!') 148 | ) 149 | .catch(err => 150 | console.log('error!') 151 | ) 152 | .finally(() => 153 | console.log('finally!') 154 | ) 155 | ``` 156 | 157 | ## Comments 158 | 159 | ### Singleline Comments 160 | 161 | ```ts 162 | // This is my demo method. 163 | const myMethod = () => 'Hello World!' 164 | ``` 165 | 166 | ### Multiline Comments 167 | 168 | ```ts 169 | /** 170 | * This method is for demo purposes. 171 | **/ 172 | const myMethod = () => 'Hello World!' 173 | ``` 174 | -------------------------------------------------------------------------------- /code-style/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "defaultSeverity": "error", 3 | "extends": [ 4 | "tslint:recommended" 5 | ], 6 | "jsRules": {}, 7 | "rules": { 8 | "radix": false, 9 | "prefer-for-of": false, 10 | "indent": [true, "tabs", 2], 11 | "curly": [true, "as-needed"], 12 | "semicolon": [true, "never"], 13 | "quotemark": [true, "single"], 14 | "typedef": [true, "parameter"], 15 | "trailing-comma": [true, "never"], 16 | "object-literal-sort-keys": false, 17 | "no-consecutive-blank-lines": true, 18 | "one-variable-per-declaration": false, 19 | "file-name-casing": [true, "camel-case"], 20 | "arrow-parens": [true, "ban-single-arg-parens"], 21 | "variable-name": [false, "allow-leading-underscore"], 22 | "one-line": [true, "check-catch", "check-else", "check-open-brace"], 23 | "whitespace": [true, "check-branch", "check-module", "check-preblock"], 24 | "no-console": { 25 | "severity": "warning", 26 | "options": ["debug", "info", "log", "time", "timeEnd", "trace"] 27 | } 28 | }, 29 | "rulesDirectory": [] 30 | } 31 | --------------------------------------------------------------------------------