Add Frontend & Backend README.md (#131)

* Create `.env.example` for backend * Create `.env.example` for frontend * Add development mode value in `.env.example` * Update README.md * Update README.md * Update README.md * Update frontend `README.md` * Change order in frontend `README.md` * Remove useless bold * Add frontend README linking * Update backend `README.md` * Update README.md * Add REST API spec docs * Fix formatting
yorkie-team · Feb 5, 2024 · a7be84b · a7be84b
1 parent cdf6cf5
commit a7be84b
Show file tree

Hide file tree

Showing 3 changed files with 190 additions and 40 deletions.
diff --git a/README.md b/README.md
@@ -23,6 +23,13 @@ CodePair provides the following features:
 - **Sharing Document**: Share documents with external parties by setting permissions and expiration time
 - **Yorkie Intelligence**: AI intelligence available within the collaborative editing editor
 
+## Packages
+
+This repository contains multiple packages/modules that make up our project. Each package/module is contained in its own directory within this repository.
+
+- **Frontend**: Contains the frontend code of our application. Please refer to [frontend/README.md](frontend/README.md) for detailed information on setting up and running the frontend.
+- **Backend**: Contains the backend code of our application. Please refer to [backend/README.md](backend/README.md) for detailed information on setting up and running the backend.
+
 ## Getting Started with Development
 
 ### Configuration and Setup

diff --git a/backend/README.md b/backend/README.md
@@ -1,35 +1,94 @@
-## Description
+# CodePair Service Backend
 
-CodePair backend application built with [Nest](https://github.com/nestjs/nest).
+This project is the backend part of the CodePair service developed using NestJS.
 
-## Installation
+## Getting Started
+
+1. Navigate to the project directory.
+
+    ```bash
+    cd backend
+    ```
+
+2. Install dependencies.
+
+    ```bash
+    npm install
+    ```
+
+3. Start the server in development mode.
+
+    ```bash
+    npm run start:dev
+    ```
+
+4. Open [http://localhost:3000](http://localhost:3000) in your browser to access the backend.
+
+## API Specification
+
+You can access the Swagger-based REST API specification at `<API_URL>/api` when the backend server is running.
+
+## Commands
+
+### Building the Project:
 
 ```bash
-$ npm install
+npm run build
 ```
 
-## Running the app
+Builds the project.
+
+### Linting the Code:
 
 ```bash
-# development
-$ npm run start
+npm run lint
+```
+
+Lints TypeScript files using ESLint. Fixes any fixable linting errors.
 
-# watch mode
-$ npm run start:dev
+### Testing:
 
-# production mode
-$ npm run start:prod
+```bash
+npm test
 ```
 
-## Test
+Runs unit tests using Jest.
+
+### Running in Production:
 
 ```bash
-# unit tests
-$ npm run test
+npm start
+```
+
+Starts the server in production mode.
+
+## Directory Structure
+
+```
+backend/
+├── docker/                               # Docker configuration files
+│   ├── mongodb_replica/                  # Configuration for MongoDB replica set
+│   │   ├── docker-compose.yml            # Docker Compose configuration for MongoDB replica set
+│   │   └── Dockerfile                    # Dockerfile for MongoDB replica set
+│   ├── docker-compose-full.yml           # Full Docker Compose configuration (Backend + MongoDB)
+│   └── docker-compose.yml                # Default Docker Compose configuration
+├── prisma/                               # Prisma configuration files
+├── src/                                  # Source code
+│   ├── admin/                            # Admin-related modules
+│   ├── auth/                             # Authentication modules
+│   ├── check/                            # Check-related modules
+│   ├── db/                               # Database configuration
+│   ├── documents/                        # Document-related modules
+│   ├── intelligence/                     # Intelligence-related modules
+│   ├── langchain/                        # Language chain modules
+│   ├── users/                            # User-related modules
+│   ├── utils/                            # Utility functions and types
+│   ├── workspace-documents/              # Workspace document modules
+│   ├── workspace-users/                  # Workspace user modules
+│   └── workspaces/                       # Workspace modules
+└── test/                                 # Test files
+```
 
-# e2e tests
-$ npm run test:e2e
+## Contributing
 
-# test coverage
-$ npm run test:cov
-```
+Please see the [CONTRIBUTING.md](../CONTRIBUTING.md) file for details on how to contribute to this project.
diff --git a/frontend/README.md b/frontend/README.md
@@ -1,30 +1,114 @@
-# React + TypeScript + Vite
+# CodePair Service Frontend
 
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+This project is the frontend part of the CodePair service developed using Vite and React.
 
-Currently, two official plugins are available:
+## Getting Started
 
--   [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
--   [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+1. Navigate to the project directory.
 
-## Expanding the ESLint configuration
+```bash
+cd frontend
+```
+
+2. Install dependencies.
+
+```bash
+npm install
+```
+
+3. Start the development server.
+
+```bash
+npm run dev
+```
+
+4. Open [http://localhost:5173](http://localhost:5173) in your browser to view the app.
+
+## Commands
+
+### Running the Development Server:
+
+```bash
+npm run dev
+```
+
+Starts the development server using Vite.
+
+### Building the Project:
+
+```bash
+npm run build
+```
+
+Compiles TypeScript files (`tsc`) and builds the project using Vite.
 
-If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
+### Linting the Code:
 
--   Configure the top-level `parserOptions` property like this:
+```bash
+npm run lint
+```
+
+Lints TypeScript and TypeScript React files using ESLint. Reports any linting errors or warnings.
+
+### Previewing the Production Build:
 
-```js
-export default {
-	// other rules...
-	parserOptions: {
-		ecmaVersion: "latest",
-		sourceType: "module",
-		project: ["./tsconfig.json", "./tsconfig.node.json"],
-		tsconfigRootDir: __dirname,
-	},
-};
+```bash
+npm run preview
 ```
 
--   Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
--   Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
--   Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
+Previews the production build of the project using Vite.
+
+### Formatting the Code:
+
+```bash
+npm run format
+```
+
+Formats the code using Prettier according to project configurations. Automatically fixes any formatting issues.
+
+### Checking Code Formatting:
+
+```bash
+npm run format:check
+```
+
+Checks if the code is formatted correctly according to Prettier configurations. Reports any formatting issues without fixing them.
+
+## Directory Structure
+
+```
+frontend/
+├── public/                 # Static files (index.html, images, etc.)
+├── src/                    # Source code
+│   ├── components/         # React components
+│   ├── constants/          # Constants for project
+│   ├── contexts/           # React contexts
+│   ├── hooks/              # React hooks
+│   │   └── api/            # Hooks for `react-query`
+│   ├── pages/              # Page components
+│   ├── providers/          # React providers
+│   ├── utils/              # Utility functions, etc.
+│   ├── store/              # Redux stores
+│   ├── App.css             # Shared layout styles, theme settings, or common utility classes, etc.
+│   ├── App.tsx             # App component entry point
+│   ├── index.css           # Global styles for overall layout, font settings, basic colors, etc.
+│   ├── main.tsx            # Main rendering entry point
+│   ├── routes.tsx          # Routing settings
+│   └── vite-env.d.ts       # Types for environment variables.
+├── .env.example            # Example .env file with environment variable definitions
+├── .eslintrc.cjs           # ESLint configuration file in CommonJS format
+├── .gitignore              # Git ignore settings file
+├── .prettierignore         # Files and directories to ignore for Prettier formatting
+├── .prettierrc             # Prettier configuration file
+├── index.html              # HTML template file
+├── package-lock.json       # Lockfile automatically generated by npm
+├── package.json            # Project metadata and dependencies definition
+├── README.md               # Project description file (this file)
+├── tsconfig.json           # TypeScript configuration file
+├── tsconfig.node.json      # TypeScript configuration file for Node.js environment
+└── vite.config.ts          # Vite configuration file
+```
+
+## Contributing
+
+Please see the [CONTRIBUTING.md](../CONTRIBUTING.md) file for details on how to contribute to this project.