Skip to content
This repository was archived by the owner on Mar 16, 2026. It is now read-only.

Commit 3277e63

Browse files
committed
docs: update getting-started
1 parent dbd2612 commit 3277e63

1 file changed

Lines changed: 65 additions & 25 deletions

File tree

src/docs/documentation/general/getting-started.mdx

Lines changed: 65 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -7,37 +7,46 @@ menu: General
77

88
# Getting Started
99

10-
> ⚠️ Since v1 you need `react` and `react-dom` with `>= 16.8.0` installed.
10+
<!-- > Starting from Docz v1 you need to have `react` and `react-dom` with versions `>= 16.8.0` installed as dependencies. -->
1111

12-
## Migration Guide
1312

14-
This documentation it's about **v2**. If you need to migrate your Docz project, please read our [**Migration Guide**](/docs/migration-guide).
15-
If you are looking for documentation for v1 it's [**here**](https://docz-v1.surge.sh/)
13+
## Start a New Project
14+
15+
Use create-docz-app to quickly get started :
1616

17-
## Installation
17+
```sh
18+
npx create-docz-app my-docz-app
19+
# or
20+
yarn create docz-app my-docz-app --example typescript
21+
```
1822

19-
Getting started with **Docz** is something really easy and quick.
20-
First of all, you will need to install **Docz** using your favorite package manager:
23+
Make sure to check out [docz's `examples` directory](https://github.com/doczjs/docz/tree/master/examples) for the full list of supported examples.
2124

22-
```bash
23-
$ yarn add docz@next react react-dom
25+
## Add Docz to an Existing Project
26+
27+
> Make sure you have `react` and `react-dom` with versions `>= 16.8.0` installed as dependencies.
28+
29+
Start by adding **Docz** as a dependency :
30+
31+
```sh
32+
yarn add docz@next # react react-dom
2433
```
2534
or
26-
```bash
27-
$ npm add docz@next react react-dom
35+
```sh
36+
npm add docz@next # react react-dom
2837
```
2938

30-
> ### Warnings and tips
31-
> Don't forget to install **react** and **react-dom**
39+
After installing Docz in your project, you may find it convenient to add three scripts to your `package.json` to run, build and serve your Docz website.
3240

33-
> After you installed Docz in your project, you may find it convenient to add two scripts in your `package.json` to run Docz for you. This is an **optional step**:
41+
Note that this is an **optional step** :
3442

3543
```json
3644
{
3745
"name": "next-gen-documentation",
3846
"scripts": {
3947
"docz:dev": "docz dev",
40-
"docz:build": "docz build"
48+
"docz:build": "docz build",
49+
"docz:serve": "docz build && docz serve"
4150
},
4251
"dependencies": {
4352
"docz": "latest",
@@ -47,24 +56,26 @@ $ npm add docz@next react react-dom
4756
}
4857
```
4958

50-
Now you can spin up your dev server by running:
59+
You can now spin up your dev server by running:
5160

5261
```bash
53-
$ yarn docz:dev
62+
yarn docz:dev # or yarn docz dev
5463
```
5564
or
5665
```bash
57-
$ npm run docz:dev
66+
npm run docz:dev
5867
```
5968

60-
## Using
69+
## Develop
70+
71+
With your dev server up, you can start writing your documentation.
6172

62-
With your dev server up, you can start writing your documentation. Docz uses [**MDX**](https://mdxjs.com/) as a standard
63-
format because of the flexibility of writing JSX inside markdown files.
73+
Docz uses the [**MDX**](https://mdxjs.com/) format that allows you to seamlessly write JSX inside your markdown files.
6474

65-
> Note that you **don't need to follow any strict file architecture**. You can just create your `.mdx` files **anywhere in your project**.
75+
> Note that you **don't need to follow any file architecture or convention**.
76+
> You can just create your `.mdx` files and put them **anywhere in your project**.
6677
67-
So, let's create our first `.mdx` and give it a name and a route:
78+
With that in mind, let's create our first `.mdx` and give it a name and a route:
6879

6980
```markdown
7081
---
@@ -77,8 +88,37 @@ route: /
7788
Hello, I'm a mdx file!
7889
```
7990

80-
With your first `.mdx` created, you can open your browser and visit `localhost:3000` and you should see something like this:
91+
With your first `.mdx` document created, you can open your browser and visit `localhost:3000` to see something like this:
8192

8293
![](https://cdn-std.dprcdn.net/files/acc_649651/Y825GV)
8394

84-
_MDX_ is markdown with extra everything. We cover more on what you can do with _MDX_ under [**Writing MDX**](/docs/writing-mdx)
95+
We cover more of what you can do with _MDX_ in the [**Writing MDX**](/docs/writing-mdx) page.
96+
97+
## Build
98+
99+
`yarn docz build` will generate a static site for your site in `.docz/dist/`.
100+
101+
You can try it out with `yarn docz serve` or by serving the generated site with your favorite static file server (e.g. `npx serve .docz/dist`).
102+
103+
You can have `yarn docz build` emit to a different directory by providing a path to the `dest` field in your doczrc.js or from the command line : `yarn docz build --dest docs-site-directory`.
104+
105+
## Deploy
106+
107+
The output of docz consists of static assets only. This allows you to deploy your generated `docz` site with any static site hosting provider you'd like.
108+
109+
Start by building your site with `yarn docz build`, if you haven't provided a `dest` flag to your config then you will find your generated files in `.docz/dist` that you can copy to your server to deploy your site.
110+
111+
## Examples
112+
113+
You can check the complete list of docz examples [here](https://github.com/doczjs/docz/tree/master/examples).
114+
115+
116+
## Migration Guide
117+
118+
This documentation is about **Docz v2**.
119+
120+
If you need to migrate your Docz project, please read the [**Migration Guide**](/docs/migration-guide).
121+
122+
If you are looking for documentation for v1 you can find it [**here**](https://docz-v1.surge.sh/).
123+
124+

0 commit comments

Comments
 (0)