Welcome to d0xigen!

Hello 👋, you are currently viewing the documentation for d0xigen - UI layer for documentation to my projects. And yeah, this is me: d0rich.

I have created this theme to make my documentation sites look the same. Also, d0xigen makes it easier for me to create documentation sites for my projects. All for me, but you can use it too.

Let's try to use it!

Installation

Like all front-end projects, this one is created within Node.js ecosystem. Layer itself is available as a package on npm.

npm install d0xigen@latest

Reference package.json:

package.json
{
  "private": true,
  "dependencies": {
    "d0xigen": "^0.1.4"
  }
}

Nuxt color mode 3.1.8 is incompatible with just released Nuxt 3.4.0. So, if you have some troubles with color mode, install Nuxt 3.3.3.

npm install nuxt@3.3.3 -D

Usage

d0xigen is a Nuxt 3 layer. So, you need to install Nuxt 3 first. I believe you can do it yourself.

Extending Nuxt 3

All is required is to extend your Nuxt app with d0xigen in nuxt.config.ts.

nuxt.config.ts
export default defineNuxtConfig({
  extends: ['d0xigen']
})

Meta information

And technically it will work. But I believe you want to customize at least general information.

You can specify it inside app.config.ts in d0xigen section.

app.config.ts
export default defineAppConfig({
  d0xigen: {
    title: 'd0xigen',
    description: '🌬🕮 Docs to breath life into your project',
    url: 'https://d0xigen.d0rich.me',
    author: 'Nikolay Dorofeev',
    social: {
      github: 'https://github.com/d0rich/d0xigen'
    }
  }
})

Creating content

Run project in development mode:

npx nuxt dev

That's it! You can start creating content. Create content folder for that and enjoy features of Nuxt Content.

GitHub pages

Reference action for GitHub pages deployment:

docs.yml
name: Publish Docs

on:
  push:
  workflow_dispatch:

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout
        uses: actions/checkout@v1

      - name: Use Node.js 16
        uses: actions/setup-node@v3
        with:
          node-version: 16

      - name: Installing packages
        working-directory: ./.docs
        run: npm install

      - name: Build Nuxt 3 static site
        working-directory: ./.docs
        run: npx nuxi generate

      - name: Deploy to GitHub Pages
        uses: peaceiris/actions-gh-pages@v3
        if: github.ref == 'refs/heads/master'
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./.docs/dist
          commit_message: 'Automatic deploy: ${{ github.event.head_commit.message }}'