macos-defaults/build/docsify
2020-11-20 10:20:15 +01:00
..
__mocks__ 👷 Add a Docsify build Action 2020-09-20 11:18:39 +02:00
__snapshots__ 💄 Add Netlify image width & height 2020-11-07 12:16:05 +01:00
templates 💄 Add Netlify image width & height 2020-11-07 12:16:05 +01:00
build.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
netlify.toml 🌐 Add config internationalization support 2020-09-26 20:24:54 +02:00
package.json ⬆️ Upgrade prettier to v2.2.0 2020-11-20 10:20:15 +01:00
readme.md 📝 Add internationalization infos 2020-09-26 20:24:54 +02:00
write-categories.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
write-categories.test.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
write-config.js 🌐 Add config internationalization support 2020-09-26 20:24:54 +02:00
write-config.test.js 🌐 Add config internationalization support 2020-09-26 20:24:54 +02:00
write-homepage.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
write-homepage.test.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
write-pages.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
write-pages.test.js ♻️ Split build into smaller functions 2020-09-26 20:24:54 +02:00
yarn.lock ⬆️ Upgrade prettier to v2.2.0 2020-11-20 10:20:15 +01:00

docsify Build

Docsify build status

My opinion

docsify was the easiest to setup as it's pretty much the same markdown as VuePress.

😄 Good

  • Really easy to setup & deploy
  • index.html direct access
  • Provides 3 other themes than the Vue default one

😕 Bad

  • Requires JavaScript
  • Internationalization is not documented and tough to setup
  • The full text search is pretty bad
  • The docsify-cli is really basic

😫 Ugly

  • The pure theme

How does it work?

Here is the built website architecture:

  • index.html
    • A basic HTML file that will build the pages dynamically from the others files using the docsify JS library
  • _sidebar.md
    • The sidebar configuration which is really easy to setup
  • readme.md
    • The main page content

All the other pages are markdown files that are carefully put under their folder (e.g. screenshot/disable-shadow.md). Assets are stored at the same level.

It is deployed as is on Netlify!

I also added some plugins (JS libs in the index.html file):

Try locally

🏗 Install

yarn install

🚀 Usage

This will build the defaults.yml file and run a docsify server on http://localhost:3000/. Sources of the website are available in the docs folder.

yarn start

🚧 Run unit tests

yarn test