docs: self-hosting guide v1 (#481)

* feat: selfhosting guide v1 #238 * use public env on frontend * add docker desclaimer
2024-09-30 01:20:19 +01:00
parent 47823dbf9c
commit 91bd9d4414
8 changed files with 148 additions and 13 deletions
@@ -1,5 +1,6 @@
 import { writable, derived } from 'svelte/store';
 import { dev, browser } from '$app/environment';
+import { env } from '$env/dynamic/public';
 import { STEPS } from '../constants/quiz';
 import type { Writable } from 'svelte/store';
 import type { CurrentOrg, OrgTeamMember, OrgAudience } from '../types/org';
@@ -54,7 +55,7 @@ export const currentOrgDomain = derived(currentOrg, ($currentOrg) => {
 });

 export const isFreePlan = derived(currentOrg, ($currentOrg) => {
-  if (!$currentOrg.id) return false;
+  if (!$currentOrg.id || env.IS_SELFHOSTED === 'true') return false;

  const plan = getActivePlan($currentOrg);

@@ -8,8 +8,6 @@ import 'dotenv/config';
 const useNodeAdapter =
  process.env.IS_SELFHOSTED === 'true' && process.env.DEPLOYMENT_PROVIDER === 'docker';

-console.log('\n\n======config', process.env.IS_SELFHOSTED, process.env.DEPLOYMENT_PROVIDER);
-
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
  // Consult https://kit.svelte.dev/docs/integrations#preprocessors
@@ -6,6 +6,7 @@ import DBPushResult from './images/db-push-result.webp';
 import AuthSettings from './images/auth-settings.webp';
 import MatchEnvVariables from './images/match-env.webp';
 import NewProject from './images/new-project.webp';
+import SmtpSettings from './images/smtp-settings.webp';

 # Supabase Cloud Setup

@@ -88,10 +89,29 @@ pnpm supabase db push --db-url "URL HERE"

 ### Configure Auth in your Supabase project

-Here we will update our email configurations, to prevent supabase from sending confirmation emails on signup. This is because we don't have email confirmation setup on ClassroomIO, this feature will come later. If you don't disable it, you won't be able to signup into the application.
+Here we will update our email configurations, to prevent supabase from sending confirmation emails on signup. This is because we don't use Supabase for email verification, we handle that internally due to the quality of the email.

 <Image src={AuthSettings} alt="Authentication configuration" quality="100" />

+### Configure SMTP
+
+Supabase [now requires adding custom SMTP](https://github.com/orgs/supabase/discussions/29370) to your supabase project in order to avoid abuse of their system. Without adding a custom SMTP, your signup requests to your supabase project will fail. To avoid this, you should go to the [STMP section](https://supabase.com/dashboard/project/_/settings/auth) of your supabase settings.
+
+Make sure to toggle **Enable Custom SMTP** and fill in the following fields:
+
+- Sender email
+- Sender name
+- SMTP host
+- SMTP port
+- SMTP username
+- SMTP password
+
+<Image src={SmtpSettings} alt="SMTP Settings" quality="100" />
+
+<Callout type="info" emoji="ℹ️">
+  Learn more about setting up SMTP [here](https://supabase.com/docs/guides/auth/auth-smtp)
+</Callout>
+
 ### Add configurations to your environment variables

 Now with all these set up you need to get update the .env file in `apps/dashboard`. You need to update the following environment variables:
@@ -1,5 +1,5 @@
 {
  "signup": "Signup",
  "onboarding": "Onboarding",
-  "selfhosting": "Self-hosting"
+  "self-hosting": "Self-hosting"
 }
@@ -0,0 +1,123 @@
+import { Callout } from 'nextra/components';
+import Image from 'next/image';
+import SelfhostClassroomIO from './images/selfhost-classroomio.webp';
+
+# Self-hosting ClassroomIO.com
+
+This guide will help you quickly selfhost ClassroomIO
+
+<Image src={SelfhostClassroomIO} alt="Selfhost ClassroomIO" quality="100" />
+
+ClassroomIO is made up of the following applications
+
+- [apps/backend](https://github.com/rotimi-best/classroomio/tree/main/apps/backend) - an Express server
+- [apps/dashboard](https://github.com/rotimi-best/classroomio/tree/main/apps/dashboard) - the admin dashboard + LMS
+- [supabase](https://github.com/rotimi-best/classroomio/tree/main/supabase) - the database + REST API.
+
+The quickest and easiest way to deploy both the backend and dashboard is by using our [Railway Template](https://railway.app/template/dl9RG7?referralCode=8OyIj5). However there are a couple of things that you'd need first before heading over to the template, which are:
+
+1. SMTP values - For sending emails on the backend
+2. Supabase - For the database used on the dashboard
+3. Cloudflare R2 (optional) - Video uploads on the backend
+
+## SMTP Setup
+
+Both for the supabase and backend setup, you'd need a custom SMTP for email sending. Most importantly you need these values:
+
+```bash
+SMTP_HOST=
+SMTP_PORT=
+SMTP_USER=
+SMTP_PASSWORD=
+```
+
+Make sure you have them handy because you'd need them while we go through this selfhosting guide.
+
+<Callout type="info" emoji="ℹ️">
+  Learn more about setting up a custom SMTP server
+  [here](https://supabase.com/docs/guides/auth/auth-smtp)
+</Callout>
+
+## Supabase
+
+There are 2 options to go about setting up Supabase, you could [selfhost supabase](https://supabase.com/docs/guides/self-hosting) on your own servers or you could use their cloud version. We recommend you use the cloud version because it has a very generous free tier and you get to deploy it very quickly.
+
+We have a standalone guide to help you setup your Supabase Cloud and you can find it [here](https://classroomio.com/docs/contributor-guides/supabase-cloud)
+
+After you go through that guide you will need the following environment variables, please also store them somewhere:
+
+```bash
+PUBLIC_SUPABASE_URL=
+PUBLIC_SUPABASE_ANON_KEY=
+PRIVATE_SUPABASE_SERVICE_ROLE=
+```
+
+## Cloudflare R2
+
+We use Cloudflare R2 for video uploading within the course builder. It is not required though and you can do without it in the app if you don't need video upload.
+
+<Callout type="info" emoji="⏳">
+  This section is a work in progress.
+</Callout>
+
+## Deploy on Railway
+
+Now you have everything you need and you are ready to deploy the backend and dashboard.
+
+Go ahead and click this button to get started.
+
+[![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/template/dl9RG7?referralCode=8OyIj5)
+
+### Environment Variables.
+
+#### cio-backend
+
+```bash
+# Required
+SMTP_HOST=""
+SMTP_PORT=""
+SMTP_USER=""
+SMTP_PASSWORD=""
+PUBLIC_SUPABASE_URL=""
+PUBLIC_SUPABASE_ANON_KEY=""
+
+# Optional
+CLOUDFLARE_BUCKET_ID=""
+CLOUDFLARE_ACCESS_KEY=""
+CLOUDFLARE_ACCOUNT_ID=""
+CLOUDFLARE_BUCKET_DOMAIN=""
+CLOUDFLARE_SECRET_ACCESS_KEY=""
+```
+
+<Callout type="info" emoji="ℹ️">
+  Learn more about the environment variables
+  [here](https://github.com/rotimi-best/classroomio/blob/main/apps/backend/.env.example)
+</Callout>
+
+#### cio-dashboard
+
+```bash
+# Required
+PUBLIC_SUPABASE_URL=""
+PUBLIC_SUPABASE_ANON_KEY=""
+PRIVATE_SUPABASE_SERVICE_ROLE=""
+PUBLIC_SERVER_URL=""
+
+# Optional
+OPENAI_API_KEY=""
+PUBLIC_IP_REGISTRY_KEY=""
+UNSPLASH_API_KEY=""
+PRIVATE_APP_HOST=""
+PRIVATE_APP_SUBDOMAINS=""
+```
+
+<Callout type="info" emoji="ℹ️">
+  Learn more about the environment variables
+  [here](https://github.com/rotimi-best/classroomio/blob/main/apps/dashboard/.env.example)
+</Callout>
+
+## Using Docker
+
+We do have a [docker-compose file](https://github.com/rotimi-best/classroomio/blob/main/docker-compose.yaml) to deploy both the backend and dashboard however it still requires some more debugging and we are still trying to figure out how we can also get supabase to be included in the docker compose file.
+
+If you'd like to help with this, please do open a PR on Github 👍🏽
@@ -1,7 +0,0 @@
-import { Callout } from "nextra/components";
-
-# Self hosting
-
-<Callout emoji='🚨'>
-	This page is a work in progress. Help us expand it by contributing!
-</Callout>