portails/quick-start.md at fa2096da39555972875f1e2dec78316ba99b0176

3.9 KiB

Raw Blame History

title

description

lead

date

lastmod

draft

images

weight

toc

Quick Start

One page summary of how to start a new Doks project.

2020-11-16T13:59:39+01:00

false

docs

parent
prologue

110

true

function myFunction(p1, p2) {
  return p1 * p2;   // The function returns the product of p1 and p2
}

Flow

Shortcode

{{</* mermaid class="bg-light text-center" */>}}
graph TD
  A[Hard] -->|Text| B(Round)
  B --> C{Decision}
  C -->|One| D[Result 1]
  C -->|Two| E[Result 2]
{{</* /mermaid */>}}

{{< mermaid class="bg-light text-center">}} graph TD A[Hard] -->|Text| B(Round) B --> C{Decision} C -->|One| D[Result 1] C -->|Two| E[Result 2] {{< /mermaid >}}

Code fences

```mermaid
graph TD
  A[Hard] -->|Text| B(Round)
  B --> C{Decision}
  C -->|One| D[Result 1]
  C -->|Two| E[Result 2]
```

graph TD
  A[Hard] -->|Text| B(Round)
  B --> C{Decision}
  C -->|One| D[Result 1]
  C -->|Two| E[Result 2]

Sequence

{{< mermaid >}} sequenceDiagram Alice->>John: Hello John, how are you? loop Healthcheck John->>John: Fight against hypochondria end Note right of John: Rational thoughts! John-->>Alice: Great! John->>Bob: How about you? Bob-->>John: Jolly good! {{< /mermaid >}}

Gantt

{{< mermaid >}} gantt dateFormat YYYY-MM-DD title Adding GANTT diagram to mermaid excludes weekdays 2014-01-10

section A section Completed task :done, des1, 2014-01-06,2014-01-08 Active task :active, des2, 2014-01-09, 3d Future task : des3, after des2, 5d Future task2 : des4, after des3, 5d {{< /mermaid >}}

Class

{{< mermaid >}} classDiagram Class01 <|-- AveryLongClass : Cool <> Class01 Class09 --> C2 : Where am i? Class09 --* C3 Class09 --|> Class07 Class07 : equals() Class07 : Object[] elementData Class01 : size() Class01 : int chimp Class01 : int gorilla class Class10 { <> int id size() } {{< /mermaid >}}

State

{{< mermaid >}} stateDiagram-v2 [] --> Still Still --> [] Still --> Moving Moving --> Still Moving --> Crash Crash --> [*] {{< /mermaid >}}

Pie

{{< mermaid >}} pie title Key elements in Product X "Calcium" : 42.96 "Potassium" : 50.05 "Magnesium" : 10.01 "Iron" : 5 {{< /mermaid >}}

User Journey

{{< mermaid >}} journey title My working day section Go to work Make tea: 5: Me Go upstairs: 3: Me Do work: 1: Me, Cat section Go home Go downstairs: 5: Me Sit down: 3: Me {{< /mermaid >}}

Requirements

Doks uses npm to centralize dependency management, making it [easy to update]({{< relref "how-to-update" >}}) resources, build tooling, plugins, and build scripts:

Download and install Node.js (it includes npm) for your platform.

Start a new Doks project

Create a new site, change directories, install dependencies, and start development server.

Create a new site

Doks is available as a child theme, and a starter theme:

Use the Doks child theme, if you do not plan to customize a lot, and/or need future Doks updates.
Use the Doks starter theme, if you plan to customize a lot, and/or do not need future Doks updates.

Not quite sure? Use the Doks child theme.

Doks child theme

git clone https://github.com/h-enk/doks-child-theme.git my-doks-site

Doks starter theme

git clone https://github.com/h-enk/doks.git my-doks-site

Change directories

cd my-doks-site

Install dependencies

npm install

Start development server

npm run start

Doks will start the Hugo development webserver accessible by default at http://localhost:1313. Saved changes will live reload in the browser.

Other commands

Doks comes with commands for common tasks. [Commands →]({{< relref "commands" >}})

3.9 KiB Raw Blame History