linaria
linaria copied to clipboard
WIP: Documentation site using component-docs
Motivation
As per discussion in #320, here's my initial PR follow up what's left in #320 and it is still a WIP.
Summary
Here's my list of features that I think needed to done (details in RFC below):
- [ ] 1. Syntax highlight of CSS-in-JS
- [ ] 2. Port MDX components from flow to typescript
- [ ] 3. Generate docs site into main website and serve as static
- [ ] 4. CI config for Docs site and as a step of website build
- [ ] 5. Write up home page
- [ ] 6. Improve component-docs filter function to some simple text search
Details and RFC
-
Syntax highlighting of CSS in string literals is fixed in https://github.com/callstack/component-docs/pull/45 but then it's blocked by https://github.com/callstack/component-docs/issues/49. I'm pending for component-docs author to clear the blocking issue first.
-
Currently, some React components in the
docsfolder which is used by the MDX document are written with Flow type. I want to port them to TypeScript but also need to check if component-docs has already support TS. -
My initial intention is to generate the docs site to
website/docsfolder and add a static serving middleware to Koa server. However when I try to output the component-docs site intowebsite/docs, I get some React runtime mismatch error. So, currently, the documentation site is generated todocs-publicfolder. I'll look into how website is built right now and will suggest a patch so that docs site will be served at linaria.dev/docs -
With whatever Linaria repo CI/CD solution currently is, add a step to generate docs site and serve it to website at
/docs -
Pick some sections in README, for e.g.: Features, Setup, Syntax, Demo, Trade-off... and copy them to docs site Home Page.
-
Use a client-side text search solution for example lunr.js to provide better documentation browsing. This might be too complicated and should be in another PR.
Test plan
I have created a Netlify deployment automatically built upon new commits pushed to this branch. Everyone can preview it here: https://linaria-docs-preview.netlify.app
Contributors can check out the branch, re-run yarn install and execute yarn docs to build and serve the site at http//localhost:3031
Hey @trongthanh, thank you for your pull request 🤗. The coverage report for this branch can be viewed here.