Improvements to the doc (#1989)

* Added Overview page

* Revised Getting Started page

* Minor revision

* Edited readme, minor modifications to docs

* Removed sweep.yaml, .devcontainer, .ergomake

* Moved security.md to .github, added contributing.md

* changes as per code review

* updated contributing.md

* fixed broken links & added missing links in doc, improved structure

* fixed link in wsl setup

* fixed server link, added https cloning in yarn-setup

* removed package-lock.json

* added doc card, admonitions

* removed underline from nav buttons
This commit is contained in:
Nimra Ahmed
2023-10-13 12:13:13 +05:00
committed by GitHub
parent 4e993316a6
commit 13db1bd0a6
21 changed files with 92 additions and 13665 deletions

View File

@ -15,7 +15,11 @@ We use React and Recoil for state management.
We recommend that you create as many atoms as you need to store your state. We recommend that you create as many atoms as you need to store your state.
**Rule of thumb:** It's better to use additional atoms than trying to be too concise with props drilling. :::tip
It's better to use additional atoms than trying to be too concise with props drilling.
:::
```tsx ```tsx
export const myAtomState = atom({ export const myAtomState = atom({

View File

@ -1,5 +1,6 @@
--- ---
title: Overview title: Overview
description: Overview
sidebar_position: 0 sidebar_position: 0
sidebar_custom_props: sidebar_custom_props:
icon: TbEyeglass icon: TbEyeglass

View File

@ -1,11 +1,13 @@
--- ---
title: Frontend Development title: Frontend Development
displayed_sidebar: frontendSidebar displayed_sidebar: frontendSidebar
sidebar_position: 0 sidebar_position: 0
sidebar_custom_props: sidebar_custom_props:
icon: TbTerminal2 icon: TbTerminal2
isSidebarRoot: true isSidebarRoot: true
--- ---
Welcome to the Frontend Development section of the documentation. Welcome to the Frontend Development section of the documentation.
Here you will find information about the frontend development process, the tools we use, and the best practices we follow. Here you will find information about the frontend development process, the tools we use, and the best practices we follow.

View File

@ -6,4 +6,3 @@ sidebar_custom_props:
--- ---
WIP WIP

View File

@ -1,6 +1,7 @@
--- ---
title: Docker Setup title: Docker Setup
sidebar_position: 2 sidebar_position: 2
description: Set up the project with Docker.
sidebar_custom_props: sidebar_custom_props:
icon: TbBrandDocker icon: TbBrandDocker
--- ---
@ -46,7 +47,11 @@ PG_DATABASE_URL=postgres://twenty:twenty@postgres:5432/default?connection_limit=
We provide an environment containerized with Docker and orchestrated with `docker-compose`. We provide an environment containerized with Docker and orchestrated with `docker-compose`.
This installation method will also provision a PostgreSQL container. This installation method will also provision a PostgreSQL container.
> **Note:** The configuration for the build is stored in the `infra/dev` folder, but you can run `make` commands directly from the root folder. :::info
The configuration for the build is stored in the `infra/dev` folder, but you can run `make` commands directly from the root folder.
:::
```bash ```bash
make build make build

View File

@ -1,11 +1,12 @@
--- ---
title: IDE Setup title: IDE Setup
sidebar_position: 4 sidebar_position: 4
description: Our recommended IDE set up.
sidebar_custom_props: sidebar_custom_props:
icon: TbBrandVscode icon: TbBrandVscode
--- ---
This section will help you setup your IDE for the project. If you haven't setup your development environment, please refer to our [local setup](/contributor/local-setup) section. This section will help you set up your IDE for the project. If you haven't setup your development environment, please refer to our [local setup](/contributor/local-setup) section.
## Visual Studio Code ## Visual Studio Code

View File

@ -7,9 +7,14 @@ sidebar_custom_props:
import ThemedImage from '@theme/ThemedImage'; import ThemedImage from '@theme/ThemedImage';
import Tabs from '@theme/Tabs'; import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem'; import TabItem from '@theme/TabItem';
import DocCardList from '@theme/DocCardList';
Twenty is designed to be developer-friendly, and your local installation should be up and running in a few minutes. Twenty is designed to be developer-friendly, and your local installation should be up and running in a few minutes.
<DocCardList/>
## Discord ## Discord
If you have any questions or need help, you can join our [Discord](https://twenty.com/discord) server. If you have any questions or need help, you can join our [Discord](https://twenty.com/discord) server.

View File

@ -1,6 +1,7 @@
--- ---
title: Troubleshooting title: Troubleshooting
sidebar_position: 5 sidebar_position: 5
description: Common problems & their solutions.
sidebar_custom_props: sidebar_custom_props:
icon: TbExclamationCircle icon: TbExclamationCircle
--- ---

View File

@ -1,6 +1,7 @@
--- ---
title: Windows WSL Setup title: Windows WSL Setup
sidebar_position: 3 sidebar_position: 3
description: Install the project with WSL2.
sidebar_custom_props: sidebar_custom_props:
icon: TbBrandWindows icon: TbBrandWindows
--- ---
@ -37,8 +38,11 @@ Then, configure your git user name and email using the following commands, repla
git config --global user.name "Your Name" git config --global user.name "Your Name"
git config --global user.email "youremail@domain.com" git config --global user.email "youremail@domain.com"
``` ```
:::note
>**Note:** If you don't have a Github account, create one now with the corresponding email address. We recommend that you setup a SSH key for your Github account. Follow the instructions [here](https://docs.github.com/fr/authentication/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent). If you don't have a Github account, create one now with the corresponding email address. We recommend that you setup a SSH key for your Github account. Follow the instructions [here](https://docs.github.com/fr/authentication/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent).
:::
### Step #2: Install Node.js, nvm, Yarn ### Step #2: Install Node.js, nvm, Yarn

View File

@ -1,6 +1,7 @@
--- ---
title: Yarn Setup title: Yarn Setup
sidebar_position: 1 sidebar_position: 1
description: "Set up the project with Yarn."
sidebar_custom_props: sidebar_custom_props:
icon: TbScript icon: TbScript
--- ---
@ -9,8 +10,11 @@ import TabItem from '@theme/TabItem';
In this document, you'll learn how to install the project using yarn. We recommend this method since it's the easiest way to get started but you can also run the project with [Docker](/contributor/local-setup/docker-setup) or [WSL2](/contributor/local-setup/wsl-setup). In this document, you'll learn how to install the project using yarn. We recommend this method since it's the easiest way to get started but you can also run the project with [Docker](/contributor/local-setup/docker-setup) or [WSL2](/contributor/local-setup/wsl-setup).
:::info
> **Note:** `npm` currently does not support local packages satisfactorily. We strongly recommend using `yarn` instead. `npm` currently does not support local packages satisfactorily. We strongly recommend using `yarn` instead.
:::
## Prerequisites ## Prerequisites
@ -119,7 +123,11 @@ cp ./server/.env.example ./server/.env
## Step #4: Server setup ## Step #4: Server setup
> **Note:** We recommend that you use `nvm` to install the correct `node` version. We have added a `server/.nvmrc` to ensure all contributors use the same version. :::info
We recommend that you use `nvm` to install the correct `node` version. We have added a `server/.nvmrc` to ensure all contributors use the same version.
:::
To build Twenty server and seed some data into your database, run the following commands: To build Twenty server and seed some data into your database, run the following commands:
```bash ```bash
@ -135,7 +143,12 @@ Twenty's server will be up and running at [http://localhost:3000/graphql](http:/
## Step #5: Frontend setup ## Step #5: Frontend setup
> **Note:** For the frontend setup, too, we recommend using `nvm` to install the right node version. :::info
For the frontend setup, too, we recommend using `nvm` to install the right node version.
:::
To set up the frontend, run the following commands in your terminal: To set up the frontend, run the following commands in your terminal:
```bash ```bash

View File

@ -5,6 +5,21 @@ sidebar_custom_props:
icon: TbEyeglass icon: TbEyeglass
--- ---
We use NestJS on the backend. We primarily use NestJS for our backend. We previously used to have Prisma as the ORM with a lot of auto-generated code under the hood. But since we want to offer flexibility so that users can create custom fields and custom objects, we needed something more low-level than Prisma to have more fine-grained control. This is why we switched to TypeORM. Here's what our tech stack now looks like.
More details coming Soon ## Tech Stack
- NestJS
- TypeORM
- GraphQL Yoga
- Sentry
- AWS EKS
**Database**
- Postgres
**Testing**
- Jest
**Tooling**
- Yarn
- ESLint

View File

@ -0,0 +1,4 @@
{
"label": "Developer guide",
"position": 4
}

View File

@ -0,0 +1,10 @@
---
title: Overview
sidebar_position: 1
sidebar_class_name: coming-soon
sidebar_custom_props:
icon: TbArticle
---
Soon you'll be able to use our REST APIs to extend the app based on your needs.

View File

@ -25,7 +25,11 @@ docker build \
### Server ### Server
> To run the server, you will need to set the environment variables listed [here](https://github.com/twentyhq/twenty/blob/main/server/.env.example). :::note
To run the server, you will need to set the environment variables listed [here](https://github.com/twentyhq/twenty/blob/main/server/.env.example).
:::
```bash ```bash
docker build \ docker build \

View File

@ -8,8 +8,6 @@ custom_edit_url: null
--- ---
import ThemedImage from '@theme/ThemedImage'; import ThemedImage from '@theme/ThemedImage';
Twenty is an Open Source CRM. Twenty is an Open Source CRM.
<ThemedImage sources={{light: "./img/light-doc-preview.png", dark:"./img/dark-doc-preview.png"}} style={{width:'100%', maxWidth:'800px'}}/> <ThemedImage sources={{light: "./img/light-doc-preview.png", dark:"./img/dark-doc-preview.png"}} style={{width:'100%', maxWidth:'800px'}}/>

View File

@ -1,4 +1,4 @@
{ {
"label": "Others", "label": "Others",
"position": 4 "position": 5
} }

View File

@ -6,6 +6,8 @@ sidebar_custom_props:
--- ---
import ThemedImage from '@theme/ThemedImage'; import ThemedImage from '@theme/ThemedImage';
Twenty is an Open Source CRM that provides flexibility, tailored to your business needs. It helps you break free from vendor lock-in and limitations, and provides the tools needed to harness the full potential of your data while ensuring a sleek and effortlessly intuitive design that teams will love to use. Twenty is an Open Source CRM that provides flexibility, tailored to your business needs. It helps you break free from vendor lock-in and limitations, and provides the tools needed to harness the full potential of your data while ensuring a sleek and effortlessly intuitive design that teams will love to use.
<ThemedImage sources={{light: "../img/light-doc-preview.png", dark:"./img/dark-doc-preview.png"}} style={{width:'100%', maxWidth:'800px'}}/> <ThemedImage sources={{light: "../img/light-doc-preview.png", dark:"./img/dark-doc-preview.png"}} style={{width:'100%', maxWidth:'800px'}}/>

13646
docs/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -214,7 +214,7 @@ li.coming-soon a::after {
} }
.table-of-contents__link { .table-of-contents__link {
text-decoration: none; text-decoration: underline;
} }
a.table-of-contents__link:hover{ a.table-of-contents__link:hover{
@ -228,6 +228,10 @@ a.table-of-contents__link:hover{
width: 80%; width: 80%;
} }
.pagination-nav__link{
text-decoration: none;
}
.tabs-container { .tabs-container {
padding: 20px; padding: 20px;
} }

View File

@ -2,6 +2,7 @@ export {
TbApps, TbApps,
TbArrowBackUp, TbArrowBackUp,
TbArrowBigRight, TbArrowBigRight,
TbArticle,
TbBolt, TbBolt,
TbBrandFigma, TbBrandFigma,
TbBrandVscode, TbBrandVscode,