(WIP) React Documentation website for tachyons modules and components
JavaScript HTML
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Tachyons Documentation Website

Warning: This is still very much a work in progress.

Rewriting Tachyons Docs using reactjs, es6, webpack, and react-router. Boilerplate taken from react-static-site-playground.

Run it

$ npm install
$ npm start
$ open http://localhost:8080

Deploy to github pages

# Do NOT push to gh-pages branch directly.
# Instead, run this command in the terminal for gh-pages to render from the dist/ folder Webpack compiled for us:

$ git subtree push --prefix dist origin gh-pages


Only edit code in src/ directory. Webpack bundles and compiles that code into static files using static-site-generator-webpack-plugin, and it outputs the static files to dist/ where github pages reads from.

Documentation Data

Running npm start runs scripts/buildModuleStats which generates data for each tachyon module and dumps it in src/data/tachyonsStats.js. Many files use this generated data to display module stats such as version, file size, selectors, rules, etc. Never manually add that data. Instead, bump the Tachyons module version in package.json, and the script will generate the data for you.

For static content, we keep most of that in json files in src/data/. If you need to modify text copy, please look there first.


Notes during early WIP stage:

  • IMPORTANT: Anytime you add a new react route, you currently need to add it in two places. It must be in src/paths.js and either src/routes.js or write it in your html as <Link to="docs/elements/images" ../>. Thinking of a dynamic solution so you only have to write it once..