|
| 1 | +## Onboarding Guide |
| 2 | + |
| 3 | +Client side set up is straight forward and standard, i.e clone the repo [Resonte Client Side Repo](https://github.com/AOSSIE-Org/Resonate), do `flutter pub get` in the root of the project etc so this guide would focus on the backend env set up. |
| 4 | + |
| 5 | +### Prerequisits (must be installed) for Backend Env Set-Up |
| 6 | + |
| 7 | +- Docker |
| 8 | +- [Livekit](https://github.com/livekit/livekit#windows) (needed only for Windows, make sure to add it to your path var) |
| 9 | + |
| 10 | +### Starting Off (Clone Repo, Run Script, Script Install Appwrite locally) |
| 11 | + |
| 12 | +Clone the [Resonate Backend Repo](https://github.com/Aarush-Acharya/Resonate-Backend) |
| 13 | +<br/> |
| 14 | + |
| 15 | +> #### **Very Important Info** |
| 16 | +> The backend initialisation script installs Appwrite locally with additional custom flags to the install command available in the appwrite documentation so if you already have Installed Appwrite locally please delete the image and the container and start fresh |
| 17 | +<br/> |
| 18 | +
|
| 19 | +Navigate to the root directory of the project in your terminal (for windows power shell), and run the command |
| 20 | + |
| 21 | +##### Linux |
| 22 | + |
| 23 | +```bash |
| 24 | +sudo ./init.sh |
| 25 | +``` |
| 26 | + |
| 27 | +##### Mac OS |
| 28 | + |
| 29 | +```bash |
| 30 | +./init.sh |
| 31 | +``` |
| 32 | + |
| 33 | +##### Windows |
| 34 | + |
| 35 | +```bash |
| 36 | +./init.ps1 |
| 37 | +``` |
| 38 | + |
| 39 | +The script will identify your Operating System, will start installing the dependencies for the script to execute |
| 40 | +- Appwrite CLI |
| 41 | +- Livekit Server CLI |
| 42 | +- Livekit CLI |
| 43 | + |
| 44 | +This will ask for sudo access, give it |
| 45 | + |
| 46 | + |
| 47 | + |
| 48 | + |
| 49 | +After installing the dependancies it will start the backend initialisation script thus start pulling Appwrite's docker image, this may take some time but after a few minutes it will ask you for some inputs let everything be the default and just press enter for it to take the default value, once all inputs are taken your it will compose the image into a container this might take a few minutes as well but after that appwrite will be successfully installed, started and up for action. |
| 50 | + |
| 51 | +<br/> |
| 52 | + |
| 53 | +Once your appwrite is intalled and running, you will be prompted with login credentials to login to appwrite but first you must go to [appwrite localhost](http://localhost:80) and create your account, account creation will ask to create a team as well please do so and proceed to the home page of the console, then provide the created accounts credentials to prompted messages |
| 54 | + |
| 55 | + |
| 56 | + |
| 57 | +After entering your email, password you will be asked for Endpoint of Appwrite Server let it be the default (hence press enter to move forward) |
| 58 | +<br/> |
| 59 | + |
| 60 | + |
| 61 | + |
| 62 | +### Ngrok Set Up |
| 63 | + |
| 64 | +You will be prompted for a ngrok auth token, sign up to [ngrok](https://ngrok.com/), to get your self an auth token and give it in the terminal |
| 65 | + |
| 66 | + |
| 67 | + |
| 68 | +After successful Ngrok set up you will be given an ngrok domain as a result please copy it and save it with you, though for ease of use whenever it is required it will be given to you again during the initialization process via the script |
| 69 | + |
| 70 | +### Resonate Project Set Up in Appwrite |
| 71 | + |
| 72 | +#### Project Creation |
| 73 | + |
| 74 | +After Ngrok set Up you will be asked for a team ID |
| 75 | + |
| 76 | + |
| 77 | + |
| 78 | +For the team Id, while the creation of an appwrite account you must be asked of a team name for your default team. Head over to your [appwrite console](http://localhost:80) i.e. Localhost Port 80, and observe the URl in the end of the url, you will see your teamId |
| 79 | + |
| 80 | + |
| 81 | + |
| 82 | +Thus my Team Id is `666ce18b003caf6274b6`, enter your team id in the terminal, once this is done the script will set up some stuff for you and then it will ask for auth credentials |
| 83 | + |
| 84 | + |
| 85 | + |
| 86 | + |
| 87 | + |
| 88 | +#### Oauth Set Up |
| 89 | + |
| 90 | +- #### *Google Oauth Creds* |
| 91 | + |
| 92 | +To create your Google Oauth credentials visit [Google Oauth Credential Guide](https://www.balbooa.com/help/gridbox-documentation/integrations/other/google-client-id) before that please read the few lines below |
| 93 | + |
| 94 | +While creating the Oauth credentials for Google add the following urls as |
| 95 | +you will be able to see a ngrok tunnel url that is required in these steps |
| 96 | + |
| 97 | +Authorized JavaScript origins: `http://{your ngrok tunnel domain name}` |
| 98 | +so for me it is http://bb58-49-36-144-88.ngrok-free.app |
| 99 | + |
| 100 | +> ##### **Very Important Info** |
| 101 | +> The url should start with `http://` not `https://` please make sure that you striclty follow the instructions listed in this guide assuming every step to be case sensitive |
| 102 | +<br/> |
| 103 | +
|
| 104 | +Authorized redirect URIs: `http://{your ngrok tunnel domain name}/v1/account/sessions/oauth2/callback/google/resonate` |
| 105 | +so for me it is http://bb58-49-36-144-88.ngrok-free.app/v1/account/sessions/oauth2/callback/google/resonate |
| 106 | + |
| 107 | +After successful creation of Oauth credentials provide the App/Client Id and Secret in the Terminal |
| 108 | + |
| 109 | + |
| 110 | +- #### *Github Oauth Creds* |
| 111 | + |
| 112 | +Get yourself your Github Oauth credentials via following [Github Oauth Credential Guide](https://support.heateor.com/get-github-client-id-client-secret/) |
| 113 | + |
| 114 | +While creating the Oauth credentials for Github add the following urls as |
| 115 | + |
| 116 | +Homepage URL: `http://{your ngrok tunnel domain name}` |
| 117 | +so for me it is http://bb58-49-36-144-88.ngrok-free.app |
| 118 | + |
| 119 | +Authorization callback URL: `http://{your ngrok tunnel domain name}/v1/account/sessions/oauth2/callback/github/resonate` |
| 120 | +so for me it is http://bb58-49-36-144-88.ngrok-free.app/v1/account/sessions/oauth2/callback/github/resonate |
| 121 | + |
| 122 | + |
| 123 | +Oauth set up is complete 🚀 |
| 124 | + |
| 125 | +#### Core Project Services Set Up |
| 126 | + |
| 127 | +Now you will be prompted for `Collection` Set Up |
| 128 | + |
| 129 | + |
| 130 | + |
| 131 | +Press "a" to select all and press enter, same goes for `Functions` and `Buckets` set up comming after this |
| 132 | + |
| 133 | +This completes the Appwrite Set Up 🚀🍀 |
| 134 | + |
| 135 | +### Livekit Set Up |
| 136 | + |
| 137 | +now you will be asked to choose between Livekit Cloud or Livekit Self hosted if you have a have an old laptop that is most likely not able to take up much processing load then opt for cloud else having it locally i.e self hosted is recommended |
| 138 | + |
| 139 | + |
| 140 | + |
| 141 | + |
| 142 | +### Caddy Web Server Set Up |
| 143 | + |
| 144 | +After livekit set up the script will start the caddy web server, and this would complete the script execution, printing out your ngrok tunnel Domain for you in the end. This tunnel domain needs to be entered in the constants.dart in the client side flutter project, copy the tunnel domain and save it with your self as well |
| 145 | + |
| 146 | + |
| 147 | + |
| 148 | + |
| 149 | + |
| 150 | + |
| 151 | + |
| 152 | +Make sure on the client side you keep everything as it is just swap the baseDomain with you ngrok tunnel domain, even if accidently you make the appwrite end point from "https://$baseDomain/v1" to "http://$baseDomain/v1" appwrite will throw an error |
| 153 | + |
| 154 | +`[log] AppwriteException: general_unauthorized_scope, User (role: guests) missing scope (account) (401)` |
| 155 | + |
| 156 | +Hence make sure to keep things as it is and just swap the baseDomain. |
| 157 | + |
| 158 | + |
| 159 | +### Debugging |
| 160 | + |
| 161 | +The logs for the ngrok service could be viewed at http://localhost:4040/inspect/http, apart from ngrok all the other service's logs i.e |
| 162 | +livekit, caddy can be seen in the .log files generated during the execution of the script. |
| 163 | + |
| 164 | + |
| 165 | + |
| 166 | +why two caddy log files? |
| 167 | + |
| 168 | +caddy.log: captures the server's operational logs, including startup and error messages. |
| 169 | +caddy_access.log: captures the access logs, detailing each HTTP request handled by the server. |
| 170 | + |
| 171 | +### How to Stop the Backend Env Services |
| 172 | + |
| 173 | +Services that backend Env uses |
| 174 | + |
| 175 | +- Appwrite |
| 176 | +- caddy |
| 177 | +- livekit |
| 178 | +- ngrok |
| 179 | + |
| 180 | +are running in the background, to stop |
| 181 | + |
| 182 | +#### Appwrite |
| 183 | + |
| 184 | +Just stop the appwrite's docker container |
| 185 | + |
| 186 | + |
| 187 | +#### Cady |
| 188 | + |
| 189 | +Just stop the Caddy container |
| 190 | + |
| 191 | +#### Livekit |
| 192 | + |
| 193 | +```bash |
| 194 | + ps aux | grep livekit-server |
| 195 | +``` |
| 196 | + |
| 197 | +now copy its Process Id and kill it using the kill command |
| 198 | + |
| 199 | +```bash |
| 200 | +kill <Pid> |
| 201 | +``` |
| 202 | + |
| 203 | + |
| 204 | + |
| 205 | + |
| 206 | +#### Ngrok |
| 207 | + |
| 208 | +Just stop the ngrok's docker container |
| 209 | + |
| 210 | + |
| 211 | + |
0 commit comments