#DOC-007: Vitest document (#113)

* doc: add new section for vitest

* chore: remove https from displayed text

* doc: for vitest

src/pages/tech/_meta.js

@@ -10,4 +10,12 @@ export default {
       </div>
     ),
   },
+  vitest: {
+    title: (
+      <div className="flex items-center gap-x-2.5">
+        <p>Vitest</p>
+        <NewBadge />
+      </div>
+    ),
+  },
 };

src/pages/tech/prisma.mdx

@@ -40,5 +40,5 @@ By default, your schemas will located at <Code>/prisma/schema.prisma</Code>
 
 For furthur information or instructions, please visit Prisma's official websites:
 
-1. Prisma: <HighlightedText content={{href: "https://www.prisma.io/docs", text: "https://www.prisma.io/docs"}} />
-2. Prisma Github: <HighlightedText content={{href: "https://github.com/prisma/prisma", text: "https://github.com/prisma/prisma"}} />
+1. Prisma: <HighlightedText content={{href: "https://www.prisma.io/docs", text: "www.prisma.io/docs"}} />
+2. Prisma Github: <HighlightedText content={{href: "https://github.com/prisma/prisma", text: "github.com/prisma/prisma"}} />

src/pages/tech/vitest.mdx

@@ -0,0 +1,32 @@
+import Code from "../../components/Documents/Code"
+import HighlightedText from "../../components/Documents/HighlightedText"
+
+# Vitest
+
+## Introduction
+
+**Vitest** is a next-generation testing framework powered by **Vite**. It includes a smart and instant watch mode and is compatible with **Jest**. Moreover, **TypeScript**, **ESM**, and **JSX** are also supported.
+
+## Why Vitest?
+
+Vitest offers several advantages that make it a compelling choice for developers:
+
+1. **Speed**: Built on Vite, Vitest leverages its fast bundling and hot module replacement capabilities, resulting in quick test runs and instant feedback during development.
+
+2. **Compatibility**: Vitest is designed to be compatible with Jest, allowing developers to easily migrate existing tests without significant changes to their codebase.
+
+3. **TypeScript Support**: With first-class TypeScript support, Vitest enables developers to write type-safe tests, reducing runtime errors and improving code quality.
+
+4. **Rich Features**: Vitest comes with a variety of built-in features such as mocking, snapshot testing, and code coverage, providing a comprehensive testing solution out of the box.
+
+5. **Modern Syntax**: The framework supports modern JavaScript and TypeScript syntax, making it easier for developers to write clean and maintainable tests.
+
+6. **Community and Ecosystem**: As part of the Vite ecosystem, Vitest benefits from a growing community and a wealth of plugins and integrations, enhancing its functionality and ease of use.
+
+By choosing Vitest, developers can enjoy a powerful, efficient, and modern testing experience that aligns with contemporary development practices.
+
+## Official Documents
+
+For furthur information or instructions, please visit Vitest's official websites:
+
+Vitest: <HighlightedText content={{href: "https://vitest.dev", text: "vitest.dev"}} />