Skip to content

Instantly share code, notes, and snippets.

@dhruvjain99
Last active April 13, 2021 03:59
Show Gist options
  • Save dhruvjain99/9841c6b83f81e72060916af7455b05ec to your computer and use it in GitHub Desktop.
Save dhruvjain99/9841c6b83f81e72060916af7455b05ec to your computer and use it in GitHub Desktop.
RCforCommunity Setup Guide

The following are the requirements before you begin setting up the project.

  1. Node version should be v14.15.4.
  2. Mongodb service must be running.
  3. Rocket Chat server must be running.

The following steps will help you setup RCforCommunity Project on your machine.

NOTE: RC4GIT refers to RC4Community only. This project was named RC4GIT earlier and then changed to RC4Community. There are places at which RC4GIT term is used in constant vars.

After you have cloned the repository,

Client-side setup:

  1. Change your current working directory to RC4Community/client.
  2. Do npm install to install all the client-side dependencies.
  3. Create a constants.js file in client/src/utils/.
  4. Copy the contents of constants-expample.js(You'll find this file in the same directory -> client/src/utils/) to constants.js.
  5. Setting up the constants:
    1. rcApiDomain is the domain of your running Rocket Chat server. In my case, it is http://localhost:3000.
    2. githubApiDomain is the domain for making GitHub API requests. It is already set, there is no need to make any change.
    3. rc4gitDomain is the domain of your running rc4community client-side server. Since your client-side code will be served on http://localhost:3002, so there is no need to change the value as it is already set, until and unless you have explicitly changed the port in the package.json.
    4. For githubClientID and githubAppSlug, you need to create your own GitHub App for authenticating users and authorizing RCforCommunity to create webhooks on the user's behalf for the real-time activity feature. You can follow the below mentioned steps to create your own GitHub App.
      1. Go to GitHub settings > Developer Settings > New GitHub App.
      2. Set GitHub App Name of your own choice.
      3. Set Homepage URL as http://localhost:3002. (This must be the domain of your RCforCommunity client-side server)
      4. Set Callback URL as http://localhost:3002/login.
      5. Deselect "Expire user authorization tokens".
      6. Select "Request user authorization (OAuth) during installation" to allow people to authorize the app when they install it.
      7. Deselect "Active" option under the "Webhook" section.
      8. Set "Access: Read & Write" for "Webhooks" under Repository permissions section.
      9. Set "Access: Read-only" for "Email Addresses" under User permissions section.
      10. Select "Any Account" option to allow this integration to be installed by any user or organization.
      11. Click on Create GitHub App to get the Client ID and GitHub App Slug.(You can find the slug in the Public link of your Github App. For example, if my github app public link is https://github.com/apps/myrcforcommunityapp then myrcforcommunityapp is the Github App slug.
  6. Run your client-side server using npm start

Server-side setup:

  1. Change your current working directory to RC4Community/server.
  2. Do npm install to install all the server-side dependencies.
  3. Create a constants.js file in server/config/.
  4. Copy the contents of constants-expample.js(You'll find this file in the same directory -> server/config/) to constants.js.
  5. Setting up the constants:
    1. jwtSecret is the secret which can be anything of your own choice to encode the jwt token.
    2. algorithm is the algo used to encode. You can use aes256
    3. key is the secret key used to encode. It can be of 32 characters. For example, "EXCHANGEPASSWORDEXCHANGEPASSWORD"
    4. iv is the initialization vector used to encode. It can be of 16 characters. For example, "abcdefghijklmnop"
    5. githubClientSecret is the secret which you need to generate by clicking on the generate a new client secret option in the above created GitHub App settings.
    6. githubClientID is the client ID of your GitHub App which you set in the client constants as well.
    7. githubAuthURL is the URL to get the access_token from GitHub. It is already set, there is no need to make any change.
    8. githubAPIDomain is the domain for making GitHub API requests. It is already set, there is no need to make any change.
    9. rocketChatDomain is the domain of your running Rocket Chat server. In my case, it is http://localhost:3000.
    10. mongodbURI is the URI to the RCforCommunity database. It is already set, there is no need to make any change.
    11. rc4gitApiURL is the publicly hosted API URL of RCforCommunity server. You can achieve this using ngrok. For example, "https://202acb62088a.ngrok.io/api". Here, "https://202acb62088a.ngrok.io" is the domain of your RCforCommunity server.
    12. For rc_uid and rc_token, you need to manually create a user who only has the access to get the stats of the RC server. After creating the user and assigning the role of reading the stats of RC server to the user, use RC REST API to login that user and get the rc_uid and rc_token.
  6. Run the server using npm start command.

Few Rocket Chat configurations need to be done before testing out the app

  1. You need to set API URL endpoint and iframe URL endpoint in the administration > accounts > iframe section to automatically authenticate a user on Rocket.Chat server when that user logs in to your web app.
    1. Toggle to turn on the enabled button.
    2. Set Iframe URL to http://localhost:3002/redirect/login
    3. Set API URL to http://localhost:8090/api/sso
    4. Set the API Method to POST
  2. Allow anonymous Read in administration > accounts.
  3. Disable Restrict access inside any Iframe in administration > general.
  4. Enable Send and Receive in administration > general > Iframe Integration.
  5. Enable Cors in administration > general > REST API and set it to *
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment