web-toolkit icon indicating copy to clipboard operation
web-toolkit copied to clipboard

Create documentation & showcase website

Open romgrk opened this issue 5 years ago • 1 comments

Things to think about:

  • Documentation for individual components
  • Example of different use cases

romgrk avatar Dec 29 '20 09:12 romgrk

The setup for the documentation is done :D

Everything is hosted on github pages, under https://romgrk.github.io/web-toolkit/demo/ and https://romgrk.github.io/web-toolkit/docs/. The docs app is under /packages/web-toolkit-docs and the demo under /packages/web-toolkit. Running npm run deploy in /packages/web-toolkit builds both the demo and the docs and sends them to github pages.

The documentation setup is very much WIP but I'm quite happy with how it works. The script parsePropTypes.js reads all components under /packages/web-toolkit/src/lib/components/ and generates a properties.json file based on the propTypes, defaultProps and JSDoc comments found directly in the code.

If anyone is interested in helping, one thing to do here is to go through each component file and make sure that:

  • All components have a propTypes with all used properties
  • Adding JSDoc comments to props where it makes sense to add one.

The documentation still needs to be completed to show how to use all the components. For now we only show the auto-generated props table and maybe the component if it doesn't crash by rendering it as <Component />.

romgrk avatar Feb 21 '21 18:02 romgrk