feat: docusaurus setup (#25)

* initialize-docusaurus

* add blogs and minipoint examples

* update deployment actions

.github/workflows/static-build-test.yml

@@ -5,7 +5,7 @@ on:
   # Runs on pushes targeting the default branch
   pull_request:
     paths:
-      - 'examples/**' 
+      - 'docs/**'
 
 jobs:
   # Single deploy job since we're just deploying
@@ -18,5 +18,5 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: 18
-      - run: npm install && cd examples && npm install
-      - run: cd examples && npm run build
+      - run: npm install && cd docs && npm install
+      - run: cd docs && npm run build

.github/workflows/static.yml

@@ -4,10 +4,10 @@ name: Deploy static content to Pages
 on:
   # Runs on pushes targeting the default branch
   push:
-    branches: 
+    branches:
       - 'main'
-    paths: 
-      - 'examples/**'
+    paths:
+      - 'docs/**'
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:
@@ -38,15 +38,15 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: 18
-      - run: npm install && cd examples && npm install
-      - run: cd examples && npm run build
+      - run: npm install && cd docs && npm install
+      - run: cd docs && npm run build
       - name: Setup Pages
         uses: actions/configure-pages@v3
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v2
         with:
           # Upload the frontend digest
-          path: 'examples/dist'
+          path: 'docs/build'
       - name: Deploy to GitHub Pages
         id: deployment
         uses: actions/deploy-pages@v2

docs/.gitignore

@@ -0,0 +1,20 @@
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

docs/README.md

@@ -0,0 +1,41 @@
+# Website
+
+This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
+
+### Installation
+
+```
+$ yarn
+```
+
+### Local Development
+
+```
+$ yarn start
+```
+
+This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
+
+### Build
+
+```
+$ yarn build
+```
+
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
+
+### Deployment
+
+Using SSH:
+
+```
+$ USE_SSH=true yarn deploy
+```
+
+Not using SSH:
+
+```
+$ GIT_USER=<Your GitHub username> yarn deploy
+```
+
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.

docs/blog/authors.yml

@@ -0,0 +1,5 @@
+himanshurajora:
+  name: Himanshu Jangid
+  title: Software Engineer
+  url: https://github.com/himanshurajora
+  image_url: https://github.com/himanshurajora.png

docs/blog/example.mdx

@@ -0,0 +1,38 @@
+---
+slug: minipoint-example
+title: Minipoint Example
+authors: [himanshurajora]
+tags: [docusaurus]
+date: 11-02-2023
+---
+
+import CanvasComponent from '@site/src/components/canvas';
+
+:::tip
+
+Miniponint is easy to use, let's check an example
+
+:::
+
+```js title="simple-red-point.js"
+import { Engine } from 'minipoint';
+
+const canvas = document.getElementById('canvas');
+
+let engine = new Engine(canvas);
+
+const point = engine.renderer.point({
+  x: 100,
+  y: 100,
+  color: 'red',
+  radius: 20,
+});
+
+let speedX = 0.1;
+let speedY = 0.1;
+
+engine.update = (engine) => {
+  point.options.x += speedX;
+  point.options.y += speedY;
+};
+```

docs/blog/index.md

@@ -0,0 +1,15 @@
+---
+slug: welcome
+title: Welcome
+authors: [himanshurajora]
+tags: [minipoint hello]
+date: 11-02-2023
+---
+
+## Welcome to Minipoint
+
+There right 2d vector graphics library for your experiments
+
+### Why did I make it?
+
+I made Minipoint for Computer Graphics enthusiasts to perform various operations on vectors and improve their knowledge in the science of computer graphics.

docs/docs/intro.md

@@ -0,0 +1,17 @@
+---
+sidebar_position: 1
+title: What is Minipoint?
+---
+
+A 2d Vector graphics library for beginners
+
+```npm title="minipoint's ascii art"
+_       _             _            
+(_)     (_)           (_)      _    
+____  _ ____  _ ____   ___  _ ____ | |_  
+|    \| |  _ \| |  _ \ / _ \| |  _ \|  _) 
+| | | | | | | | | | | | |_| | | | | | |__ 
+|_|_|_|_|_| |_|_| ||_/ \___/|_|_| |_|\___)
+          |_|                    
+
+```

docs/docs/tutorial-basics/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "Getting Started",
+  "position": 1,
+  "link": {
+    "type": "generated-index",
+    "description": "Getting started with minipoint"
+  }
+}

docs/docs/tutorial-basics/installation.mdx

@@ -0,0 +1,22 @@
+---
+sidebar_position: 1
+title: Installation
+---
+
+# Minipoint
+
+## Installation
+
+You can download minipiont via any nodejs package manager
+
+### npm
+
+```bash
+npm install minipoint@latest
+```
+
+### pnpm
+
+```bash
+pnpm install minipoint@latest
+```

docs/docusaurus.config.ts

@@ -0,0 +1,125 @@
+import { themes as prismThemes } from 'prism-react-renderer';
+import type { Config } from '@docusaurus/types';
+import type * as Preset from '@docusaurus/preset-classic';
+
+const config: Config = {
+  title: 'Minipoint',
+  tagline: "Let's draw points",
+  favicon: 'img/favicon.ico',
+
+  // Set the production url of your site here
+  url: 'https://your-docusaurus-site.example.com',
+  // Set the /<baseUrl>/ pathname under which your site is served
+  // For GitHub pages deployment, it is often '/<projectName>/'
+  baseUrl: '/',
+
+  // GitHub pages deployment config.
+  // If you aren't using GitHub pages, you don't need these.
+  organizationName: 'facebook', // Usually your GitHub org/user name.
+  projectName: 'docusaurus', // Usually your repo name.
+
+  onBrokenLinks: 'throw',
+  onBrokenMarkdownLinks: 'warn',
+
+  // Even if you don't use internationalization, you can use this field to set
+  // useful metadata like html lang. For example, if your site is Chinese, you
+  // may want to replace "en" with "zh-Hans".
+  i18n: {
+    defaultLocale: 'en',
+    locales: ['en'],
+  },
+
+  presets: [
+    [
+      'classic',
+      {
+        docs: {
+          sidebarPath: './sidebars.ts',
+          // Please change this to your repo.
+          // Remove this to remove the "edit this page" links.
+          editUrl:
+            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
+        },
+        blog: {
+          showReadingTime: true,
+          // Please change this to your repo.
+          // Remove this to remove the "edit this page" links.
+          editUrl:
+            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
+        },
+        theme: {
+          customCss: './src/css/custom.css',
+        },
+      } satisfies Preset.Options,
+    ],
+  ],
+
+  themeConfig: {
+    // Replace with your project's social card
+    image: 'img/docusaurus-social-card.jpg',
+    navbar: {
+      title: 'Minipoint',
+      logo: {
+        alt: 'Minipoint Logo',
+        src: 'img/logo.svg',
+      },
+      items: [
+        {
+          type: 'docSidebar',
+          sidebarId: 'tutorialSidebar',
+          position: 'left',
+          label: 'Tutorial',
+        },
+        { to: '/blog', label: 'Blog', position: 'left' },
+        {
+          href: 'https://github.com/himanshurajora/minipoint',
+          label: 'GitHub',
+          position: 'right',
+        },
+      ],
+    },
+    footer: {
+      style: 'dark',
+      links: [
+        {
+          title: 'Docs',
+          items: [
+            {
+              label: 'Tutorial',
+              to: '/docs/intro',
+            },
+          ],
+        },
+        {
+          title: 'Community',
+          items: [
+            {
+              label: 'Stack Overflow',
+              href: 'https://stackoverflow.com/questions/tagged/minipoint',
+            },
+          ],
+        },
+        {
+          title: 'More',
+          items: [
+            {
+              label: 'Blog',
+              to: '/blog',
+            },
+            {
+              label: 'GitHub',
+              href: 'https://github.com/facebook/docusaurus',
+            },
+          ],
+        },
+      ],
+      copyright: `Copyright © ${new Date().getFullYear()} Minipoint, Built with Docusaurus.`,
+    },
+    prism: {
+      theme: prismThemes.github,
+      darkTheme: prismThemes.dracula,
+    },
+  } satisfies Preset.ThemeConfig,
+};
+
+export default config;