Reduce initial project setup cost by introducing Feature Toggle funct…

…ionality (#230) * Change default env to cut initialization cost down * Change `docker-compose.yml` * Add description to `.env.development` * Add config module * Remove config module * Add settings module * Add settings api * Add setting store * Add yorkie intelligence feature toggle * Add fileUpload feature toggle * Update docker-compose-full.yml * Update `README.md` to simplify project initialization * Add GitHub OAuth App creation guide * Update docs reference url * Add missing variable in useEffect * Add hyperlink to `frontend/README.md` Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Fix README.md typo Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
yorkie-team · Jul 12, 2024 · c8f266a · c8f266a
1 parent 57b6b28
commit c8f266a
Show file tree

Hide file tree

Showing 33 changed files with 510 additions and 149 deletions.
diff --git a/README.md b/README.md
@@ -11,8 +11,6 @@ Build your own AI real-time collaborative markdown editor in just 5 minutes.
 
 <img width="1392" alt="스크린샷 2024-02-02 오후 4 35 29" src="https://github.com/yorkie-team/codepair-poc/assets/52884648/25c441ef-9ca4-4235-9969-279e1c56258b">
 
-
-
 ## Overview
 
 CodePair is an open-source real-time collaborative markdown editor with AI intelligence, built using React, NestJS, and LangChain.
@@ -32,62 +30,84 @@ This repository contains multiple packages/modules that make up our project. Eac
 
 ## Getting Started with Development
 
-### Configuration and Setup
+### 1. Set Up GitHub OAuth Key
+
+For the Social Login feature, you need to obtain a GitHub OAuth key before running the project. Please refer to [this document](./docs/1_Set_Up_GitHub_OAuth_Key.md) for guidance.
+
+After completing this step, you should have the `GITHUB_CLIENT_ID` and `GITHUB_CLIENT_SECRET` values.
+
+### 2. Choose Running Mode
+
+We offer two options. Choose the one that best suits your needs:
+
+- **Frontend Development Only Mode**: Use this option if you only want to develop the frontend.
+- **Full Stack Development Mode**: Use this option if you want to develop both the frontend and backend together.
+
+### 3-1. Frontend Development Only Mode
 
-Before running the Frontend and Backend applications, you need to fill in the required API Keys.  
-Follow these steps:
+1. Update your `GITHUB_CLIENT_ID` and `GITHUB_CLIENT_SECRET` to `./backend/docker/docker-compose-full.yml`.
+
+   ```bash
+   vi ./backend/docker/docker-compose-full.yml
+
+   # In the file, update the following values:
+   # GITHUB_CLIENT_ID, GITHUB_CLIENT_SECRET
+   GITHUB_CLIENT_ID: "your_github_client_id_here"
+   GITHUB_CLIENT_SECRET: "your_github_client_secret_here"
+   ```
+
+2. Run `./backend/dockerdocker-compose-full.yml`.
+
+   ```bash
+   docker-compose -f ./backend/docker/docker-compose-full.yml up -d
+   ```
 
-**Frontend Environment Configuration**
+3. Run the Frontend application:
 
-1. Navigate to the `frontend` directory.
-
    ```bash
    cd frontend
+   npm install
+   npm run dev
    ```
-2. Copy the `.env.example` file to create a `.env.development` file.
+
+4. Visit http://localhost:5173 to enjoy your CodePair.
+
+### 3-2. Full Stack Development Mode
+
+1. Update your `GITHUB_CLIENT_ID` and `GITHUB_CLIENT_SECRET` to `./backend/.env.development`.
+
    ```bash
-   cp .env.example .env.development
+   vi ./backend/.env.development
+
+   # In the file, update the following values:
+   # GITHUB_CLIENT_ID, GITHUB_CLIENT_SECRET
+   GITHUB_CLIENT_ID=your_github_client_id_here
+   GITHUB_CLIENT_SECRET=your_github_client_secret_here
    ```
-3. Edit the `.env.development` file and fill in the necessary environment variable values. Refer to the comments for the meaning and examples of each value.
 
-**Backend Environment Configuration**
+2. Run `.backend/docker/docker-compose.yml`.
 
-1. Navigate to the `frontend` directory.
-
    ```bash
-   cd backend
+   docker-compose -f ./backend/docker/docker-compose.yml up -d
    ```
-2. Copy the `.env.example` file to create a `.env.development` file.
+
+3. Run the Backend application:
+
    ```bash
-   cp .env.example .env.development
+   cd backend
+   npm install
+   npm run start:dev
    ```
-3. Edit the `.env.development` file and fill in the necessary environment variable values. Refer to the comments for the meaning and examples of each value.
-
-### Run Application
-
-1. Run the Dockerfile for MongoDB, the database used by CodePair:
-
-    ```bash
-    docker-compose up -f ./backend/docker/mongodb_replica/docker-compose.yml -d
-    ```
-
-2. Run the Backend application:
-
-    ```bash
-    cd backend
-    npm install
-    npm run start:dev
-    ```
 
-3. Run the Frontend application:
-
-    ```bash
-    cd frontend
-    npm install
-    npm run dev
-    ```
+4. Run the Frontend application:
 
-4. Visit http://localhost:5173 to enjoy your CodePair.
+   ```bash
+   cd ../frontend
+   npm install
+   npm run dev
+   ```
+
+5. Visit http://localhost:5173 to enjoy your CodePair.
 
 ## Contributing
 

diff --git a/backend/.env.example → backend/.env.development b/backend/.env.example → backend/.env.development
@@ -1,10 +1,7 @@
-# This file serves as a template for configuring environment variables.
-# Copy this file to `.env` and fill in the necessary values.
-
 # DATABASE_URL: URL for connecting to the database.
 # Format: mongodb://<username>:<password>@<host>:<port>/<database>
 # Example: mongodb://localhost:27017/codepair (For development mode)
-DATABASE_URL=your_mongodb_database_url_here
+DATABASE_URL=mongodb://localhost:27017/codepair
 
 # GITHUB_CLIENT_ID: Client ID for authenticating with GitHub.
 # To obtain a client ID, create an OAuth app at: https://docs.github.com/en/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app
@@ -15,42 +12,47 @@ GITHUB_CLIENT_SECRET=your_github_client_secret_here
 # GITHUB_CALLBACK_URL: Callback URL for handling GitHub authentication response.
 # Format: https://<backend_url>/auth/login/github
 # Example: http://localhost:3000/auth/login/github (For development mode)
-GITHUB_CALLBACK_URL=your_github_callback_url_here
+GITHUB_CALLBACK_URL=http://localhost:3000/auth/login/github
 
 # JWT_AUTH_SECRET: Secret key for JWT authentication.
 # This key is used to sign and verify JWT tokens.
-JWT_AUTH_SECRET=your_jwt_auth_secret_here
+JWT_AUTH_SECRET=you_should_change_this_secret_key_in_production
 
 # FRONTEND_BASE_URL: Base URL of the frontend application.
 # This URL is used for redirecting after authentication, etc.
 # Example: http://localhost:5173 (For development mode)
-FRONTEND_BASE_URL=your_frontend_base_url_here
-
+FRONTEND_BASE_URL=http://localhost:5173
 
 # YORKIE_API_ADDR: URL of the Yorkie Server
 # This URL is used for using collaborative editing CRDT server
-# Example: https://api.yorkie.dev (For development mode)
-YORKIE_API_ADDR=your_yorkie_api_addr_here
+# Example: http://localhost:8080 (For development mode)
+YORKIE_API_ADDR=http://localhost:8080
 # YORKIE_PROJECT_NAME: Name of the Yorkie project
 # Create Yorkie project at: https://yorkie.dev
-YORKIE_PROJECT_NAME=your_yorkie_project_name_here
+# Example: default (For development mode)
+YORKIE_PROJECT_NAME=default
 # YORKIE_PROJECT_SECRET_KEY: Secret key of the Yorkie project
 # To obtain a project secret key, visit your project dashboard: https://yorkie.dev/dashboard/projects
-YORKIE_PROJECT_SECRET_KEY=your_yorkie_project_secret_key_here
+# You can leave this empty if you are using the default project
+YORKIE_PROJECT_SECRET_KEY=""
 
+# YORKIE_INTELLIGENCE: Whether to enable Yorkie Intelligence for collaborative editing.
+# Set to true if Yorkie Intelligence is required.
+# If set to false, OPENAI_API_KEY is not required.
+YORKIE_INTELLIGENCE=false
 # OPENAI_API_KEY: API key for using the gpt-3.5-turbo model by Yorkie Intelligence.
 # To obtain an API key, visit OpenAI: https://help.openai.com/en/articles/4936850-where-do-i-find-my-api-key
 OPENAI_API_KEY=your_openai_api_key_here
 
 # LANGCHAIN_TRACING_V2: Whether LangSmith monitoring for YorkieIntelligence is needed.
 # Set to true if LangSmith monitoring is required.
 # If set to false, LANGCHAIN_ENDPOINT, LANGCHAIN_API_KEY, and LANGCHAIN_PROJECT are not required.
-LANGCHAIN_TRACING_V2=true
+LANGCHAIN_TRACING_V2=false
 # LANGCHAIN_ENDPOINT: LangSmith API URL.
 # This URL is used to communicate with LangSmith.
 # Example: https://api.smith.langchain.com
 # To obtain the LangSmith endpoint, visit LangSmith: https://www.langchain.com/langsmith
-LANGCHAIN_ENDPOINT=your_langsmith_api_key_here
+LANGCHAIN_ENDPOINT=https://www.langchain.com/langsmith
 # LANGCHAIN_API_KEY: LangSmith API Key.
 # This key is required for authenticating with LangSmith.
 # To obtain an API key, visit LangSmith: https://www.langchain.com/langsmith
@@ -60,6 +62,11 @@ LANGCHAIN_API_KEY=your_langsmith_api_key_here
 # To create a LangSmith project, visit LangSmith: https://www.langchain.com/langsmith
 LANGCHAIN_PROJECT=your_langsmith_project_name_here
 
+
+# FILE_UPLOAD: Whether to enable file upload to storage
+# Set to true if file upload is required.
+# If set to false, AWS_S3_BUCKET_NAME is not required.
+FILE_UPLOAD=false
 # AWS_S3_BUCKET_NAME: S3 Bucket name 
 # This is the name of the S3 Bucket
 AWS_S3_BUCKET_NAME="your_s3_bucket_name"
diff --git a/backend/README.md b/backend/README.md
@@ -4,25 +4,38 @@ This project is the backend part of the CodePair service developed using NestJS.
 
 ## Getting Started
 
-1. Navigate to the project directory.
+1. Set Up GitHub OAuth Key
+
+    For the Social Login feature, you need to obtain a GitHub OAuth key before running the project. Please refer to [this document](../docs/1_Set_Up_GitHub_OAuth_Key.md) for guidance.
+
+    After completing this step, you should have the `GITHUB_CLIENT_ID` and `GITHUB_CLIENT_SECRET` values.
+
+2. Update your `GITHUB_CLIENT_ID` and `GITHUB_CLIENT_SECRET` to `./backend/.env.development`.
 
     ```bash
-    cd backend
+    vi ./backend/.env.development
+
+    # In the file, update the following values:
+    # GITHUB_CLIENT_ID, GITHUB_CLIENT_SECRET
+    GITHUB_CLIENT_ID=your_github_client_id_here
+    GITHUB_CLIENT_SECRET=your_github_client_secret_here
     ```
 
-2. Install dependencies.
+3. Run `.backend/docker/docker-compose.yml`.
 
     ```bash
-    npm install
+    docker-compose -f ./backend/docker/docker-compose.yml up -d
     ```
 
-3. Start the server in development mode.
+4. Run the Backend application:
 
     ```bash
+    cd backend
+    npm install
     npm run start:dev
     ```
 
-4. Open [http://localhost:3000](http://localhost:3000) in your browser to access the backend.
+5. Visit http://localhost:3000 to enjoy your CodePair.
 
 ## API Specification
 
@@ -92,4 +105,4 @@ backend/
 ## Contributing
 
 Please see the [CONTRIBUTING.md](../CONTRIBUTING.md) file for details on how to contribute to this project.  
-If you are interested in internal design, please refer to the [Design Document](./design/).
+If you are interested in internal design, please refer to the [Design Document](./design/).
diff --git a/backend/docker/docker-compose-full.yml b/backend/docker/docker-compose-full.yml
@@ -7,21 +7,30 @@ services:
         environment:
             DATABASE_URL: "mongodb://mongo:27017/codepair"
             # Environment variables need to be passed to the container
-            GITHUB_CLIENT_ID: "GITHUB_CLIENT_ID"
-            GITHUB_CLIENT_SECRET: "GITHUB_CLIENT_SECRET"
-            GITHUB_CALLBACK_URL: "<BACKEND_BASE_URL>/auth/login/github"
-            JWT_AUTH_SECRET: "JWT_AUTH_SECRET"
-            FRONTEND_BASE_URL: "FRONTEND_BASE_URL"
-            YORKIE_API_ADDR: "http://localhost:8080"
-            YORKIE_PROJECT_NAME: "admin" # If you want to use the other project, you should change this value
-            YORKIE_PROJECT_SECRET_KEY: "admin" # If you want to use the other project, you should change this value
+            GITHUB_CLIENT_ID: "your_github_client_id_here"
+            GITHUB_CLIENT_SECRET: "your_github_client_secret_here"
+            GITHUB_CALLBACK_URL: "http://localhost:3000/auth/login/github"
+            JWT_AUTH_SECRET: "you_should_change_this_secret_key_in_production"
+            FRONTEND_BASE_URL: "http://localhost:5173"
+            YORKIE_API_ADDR: "http://yorkie:8080"
+            YORKIE_PROJECT_NAME: "default"
+            YORKIE_PROJECT_SECRET_KEY: ""
+            YORKIE_PROJECT_TOKEN: ""
+            YORKIE_INTELLIGENCE: false
+            OPENAI_API_KEY: "your_openai_api_key_here"
+            LANGCHAIN_ENDPOINT: "https://www.langchain.com/langsmith"
+            LANGCHAIN_API_KEY: "your_langsmith_api_key_here"
+            LANGCHAIN_PROJECT: "your_langsmith_project_name_here"
+            FILE_UPLOAD: false
+            AWS_S3_BUCKET_NAME: "your_s3_bucket_name"
         ports:
             - "3000:3000"
         depends_on:
             - mongo
         restart: unless-stopped
         links:
             - "mongo:mongo"
+            - "yorkie:yorkie"
 
     yorkie:
         image: "yorkieteam/yorkie:latest"

diff --git a/backend/docker/docker-compose.yml b/backend/docker/docker-compose.yml
@@ -1,21 +1,30 @@
 version: "3.8"
 
 services:
-    codepair-backend:
+    yorkie:
+        image: "yorkieteam/yorkie:latest"
+        command: ["server", "--enable-pprof"]
+        restart: always
+        ports:
+            - "8080:8080"
+            - "8081:8081"
+
+    mongo:
         build:
-            context: ../
+            context: ./mongodb_replica
+            args:
+                MONGO_VERSION: 4
         environment:
-            # Environment variables need to be passed to the container
-            DATABASE_URL: "DATABASE_URL"
-            GITHUB_CLIENT_ID: "GITHUB_CLIENT_ID"
-            GITHUB_CLIENT_SECRET: "GITHUB_CLIENT_SECRET"
-            GITHUB_CALLBACK_URL: "<BACKEND_BASE_URL>/auth/login/github"
-            JWT_AUTH_SECRET: "JWT_AUTH_SECRET"
-            FRONTEND_BASE_URL: "FRONTEND_BASE_URL"
-            YORKIE_API_ADDR: "YORKIE_API_ADDR"
-            YORKIE_PROJECT_NAME: "YORKIE_PROJECT_NAME"
-            YORKIE_PROJECT_SECRET_KEY: "YORKIE_PROJECT_SECRET_KEY"
-            AWS_S3_BUCKET_NAME: "YOUR_S3_BUCKET_NAME"
+            MONGO_REPLICA_HOST: 127.0.0.1
+            MONGO_REPLICA_PORT: 27017
+            MONGO_INITDB_DATABASE: "codepair"
+            MONGO_COMMAND: "mongo"
         ports:
-            - "3000:3000"
+            - "27017:27017"
         restart: unless-stopped
+        healthcheck:
+            test:
+                ["CMD", "mongo", "admin", "--port", "27017", "--eval", "db.adminCommand('ping').ok"]
+            interval: 5s
+            timeout: 2s
+            retries: 20
diff --git a/backend/src/app.module.ts b/backend/src/app.module.ts
@@ -13,10 +13,15 @@ import { CheckModule } from "./check/check.module";
 import { IntelligenceModule } from "./intelligence/intelligence.module";
 import { LangchainModule } from "./langchain/langchain.module";
 import { FilesModule } from "./files/files.module";
+import { SettingsModule } from "./settings/settings.module";
 
 @Module({
 	imports: [
-		ConfigModule.forRoot({ isGlobal: true }),
+		ConfigModule.forRoot({
+			isGlobal: true,
+			envFilePath:
+				process.env.NODE_ENV === "production" ? ".env.production" : ".env.development",
+		}),
 		UsersModule,
 		AuthModule,
 		WorkspacesModule,
@@ -27,6 +32,8 @@ import { FilesModule } from "./files/files.module";
 		IntelligenceModule,
 		LangchainModule,
 		FilesModule,
+		ConfigModule,
+		SettingsModule,
 	],
 	controllers: [],
 	providers: [

diff --git a/backend/src/settings/settings.controller.spec.ts b/backend/src/settings/settings.controller.spec.ts
@@ -0,0 +1,18 @@
+import { Test, TestingModule } from "@nestjs/testing";
+import { SettingsController } from "./settings.controller";
+
+describe("SettingsController", () => {
+	let controller: SettingsController;
+
+	beforeEach(async () => {
+		const module: TestingModule = await Test.createTestingModule({
+			controllers: [SettingsController],
+		}).compile();
+
+		controller = module.get<SettingsController>(SettingsController);
+	});
+
+	it("should be defined", () => {
+		expect(controller).toBeDefined();
+	});
+});