Docz - It has never been so easy to document your things!

Slide 1

Slide 1 text

It has never been so easy to document your things!

Slide 2

Slide 2 text

Pedro Nauck @pedronauck

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

Inspiration

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

Styleguides

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

⚙ Need setup ⛏ Hard/impossible to customize # Complex codebase Heavy and slow Pain

Slide 13

Slide 13 text

Zero conﬁg and easy ⚡ Blazing Fast Easy to customize MDX Based Pluggable Typescript and Flow Support Solution

Slide 14

Slide 14 text

Zero-conﬁg ➡ Run without complex conﬁgurations ➡ Easy to setup and use ➡ No strict architectures

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

Blazing fast ➡ Fast build with webpack 4 ➡ Automatic code splitting ➡ Hot reload that works

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

Easy to customize ➡ Create your own style ➡ Share and create themes

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

MDX Based ➡ Markdown with components ➡ Easy to write and understand ➡ Built-ins components ➡ Remark and Rehype ecosystem

Slide 22

Slide 22 text

Is a tree representation of the abstract syntactic structure of source code written in a programming language AST

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

uniﬁed is an interface for processing text using syntax trees.

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

1. Parse: Text => MDAST 2. Transpile: MDAST => MDXAST 3. Transform: MDX/Remark plugins applied to AST 4. Transpile: MDXAST => MDXHAST 5. Transform: Hyperscript plugins applied to AST 6. Transpile: MDXHAST => JSX Transpilation Flow

Slide 31

Slide 31 text

Pluggable ➡ Third party integration ➡ Easy to reuse and install

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

Typescript and Flow ➡ Zero conﬁg typescript and ﬂow support

Slide 34

Slide 34 text

Live code

Slide 35

Slide 35 text

How it Works

Slide 36

Slide 36 text

YOUR DOCS THEME BUNDLER PLUGINS ENTRIES PARSE PROJECT CONFIGURATION

Slide 37

Slide 37 text

Write app files ‣ Write app files using node file system for bundle ‣ Render theme, wrappers and router Start devserver ‣ Start bundler dev server ‣ Get configuration from plugins ‣ Watch mdx and configuration file using chokidar Create data ‣ Server communication with Websockets Parse entries ‣ Get meta information using AST parsing

Slide 38

Slide 38 text

Roadmap

Slide 39

Slide 39 text

➡ Testing documentation generation ➡ Vue, Preact and Inferno integration ➡ Static builds based on routes (SSR) ➡ Render popups on the ﬂy (action logger) ➡ Fetch data (getInitialData) ➡ …

Slide 40

Slide 40 text

Some Numbers

Slide 41

Slide 41 text

No content

Slide 42

Slide 42 text

No content

Slide 43

Slide 43 text

No content

Slide 44

Slide 44 text

No content

Slide 45

Slide 45 text

No content

Slide 46

Slide 46 text

No content

Slide 47

Slide 47 text

No content

Slide 48

Slide 48 text

What I’ve Learned

Slide 49

Slide 49 text

✅ Create something that you're really going to use ✅ Explore the current pains and work upon them ✅ Work hard to build something good ✅ Be patient, your project isn’t a startup ✅ Try to ﬁnd the way between an MVP and a perfect project ✅ Make a badass announcement and documentation