Files
hura-docs/README.md
2023-04-13 16:50:46 +07:00

4.9 KiB

Hura Docs

Adman Docs

  1. Website Docs mẫu tại Adman Docs Beta

  2. Cài đặt Nodejs phiên bản mới nhất: https://nodejs.org

  3. Sử dụng Code Editor bất kì.

  4. Mở Terminal rồi chạy lệnh npm i để cài đặt node_module.

  5. Sau khi cài đặt xong node_module. Chạy lệnh npm npm run start để khởi chạy dự án.

  6. Xây dựng phiên bản chạy tĩnh trên server, chạy lệnh npm run build, xuất hiện thư mục build chứa toàn bộ dự án.

Docusaurus

Đọc Docs và API tại Docusaurus Docs

Xem Website demo hướng dẫn tại Tutorial Demo

Tạo dự án mới

Cài đặt Node.js và khởi tạo dự án với tên là my-website, module mặc định - classic:

npx create-docusaurus@latest my-website classic

Khởi chạy dự án vừa tạo:

cd my-website
npx docusaurus start

Local host : http://localhost:3000

Một số khái niệm cơ bản

  • Thẻ heading h1, h2, h3,... tương ứng với #, ##, ###,... Heading and List
  • Thẻ list - ul: dùng dấu -
    - List cấp 1
        - List cấp 2
    
  • Chữ in đậm: **content**
  • Chữ in nghiêng: *content*
  • Thẻ tag a - link: [content](url)
  • Thẻ tag img - hình ảnh ![alt](url)
  • Thẻ code: Code Block
  • Thẻ lời khuyên: Tip, Note, Caution,... Admonitions

Cây thư mục

Có một số thư mục và file quan trọng như:

  • thự mục docs: chứa các bài viết hướng dẫn chính.
  • thư mục src bao gồm:
    • components: các thành phần chính của website có thể tái sử dụng nhiều lần.
    • css: chứa file custom.css - file css global, hay css vào đây.
    • pages: chứa code giao diện các page tĩnh, trong đó index.js mặc định là giao diện trang Homepage.
  • thư mục blog: chưa bài blog.
  • thư mục static: chứa các file tĩnh tùy chọn.
  • file docusaurus.config.js: file chứa toàn bộ option config của toàn bộ dự án docusaurus.config.

Tạo phiên bản

Xem thêm tại Versioning

  • Tạo phiên bản khi ta cần tạo ra nhiều hướng dẫn cho từng phiên bản từ cao xuống thấp. Ví dụ như Hura 7 - 8 - 9 - 10.
  • Tạo phiên bản sẽ sao lưu lại toàn bộ nội dung của thư mục docs mặc định và gán nó cho phiên bản đã tạo.
  • Lưu ý: thư mục docs mặc định luôn được xác định là phiên bản mới nhất. Ví dụ là Hura 10.

1. Tạo 1 phiên bản mã số - 1.1.0 (tên phiên bản)

npm run docusaurus docs:version 1.1.0

Lúc này sẽ có 2 thư mục và 1 file xuất hiện:

  • thư mục versioned_docs: chứa danh sách thư mục từng phiên bản, bên trong mỗi thư mục đó là nội dung của từng phiên bản. Nếu bạn cần chỉnh sửa phiên bản nào thì phải vào thư mục phiên bản đó.
  • thư mục versioned_sidebars: chứa file config thanh điều hướng bên trái.
  • file versions.json: chứa danh sách các phiên bản đã tạo.

2. Chỉnh sửa version tại file docusaurus.config

Trong đó versions.current.label chính là tên phiên bản mới nhất, bạn có thể đặt tên tùy ý. Nếu đặt theo số phiên bản vui lòng chỉnh sửa lại sau mỗi lần cập nhật phiên bản mới.

module.exports = {
  presets: [
    '@docusaurus/preset-classic',
    docs: {
      // last version
      lastVersion: 'current',
      versions: {
        current: {
          label: 'Last', // tên phiên bản mới nhất
        },
      },
      // last version
    },
  ],
};

3. Thêm chọn phiên bản tại Navbar Header - file docusaurus.config

module.exports = {
  themeConfig: {
    navbar: {
      // Version dropdown
      items: [
        {
          type: 'docsVersionDropdown',
          position: 'right',
          dropdownActiveClassDisabled: true,
        },
      ],
      // Version dropdown
    },
  },
};

Ví dụ

  • Ta hiện tại có Hura 7 là phiên bản cũHura 8 là phiên bản hiện tại, chứa trong thư mục docs mặc định.

  • Ta muốn thêm cho Hura 9, thì tạo phiên bản cho Hura 8

    npm run docusaurus docs:version Hura-8
    
  • Lúc này thư mục docs mặc định sẽ dùng để chỉnh sửa nội dung cho Hura 9Hura 9 sẽ là phiên bản mới nhất.