feat: add installation guide for Angular framework

apps/www/astro.config.mjs

@@ -34,6 +34,10 @@ export default defineConfig({
               label: "Introduction",
               slug: "docs",
             },
+            {
+              label: "Installation",
+              slug: "docs/installation",
+            },
           ],
         },
         {

apps/www/src/content/docs/docs/installation/angular.mdx

@@ -0,0 +1,85 @@
+---
+title: Angular
+description: Install and configure Angular.
+---
+
+import { Steps } from "@astrojs/starlight/components";
+
+<Steps>
+
+1. ### Create project
+
+   Start by creating a new App using the Angular CLI.
+
+   ```bash
+   ng new my-app
+   ```
+
+2. ### Add Tailwind and its configuration
+
+   Install `tailwindcss` and its peer dependencies, then generate your `tailwind.config.js` file:
+
+   ```bash
+   npm install -D tailwindcss postcss autoprefixer
+
+   npx tailwindcss init
+   ```
+
+3. ### Edit tsconfig.json file
+
+   ```json {3-6} showLineNumbers
+   {
+     "compilerOptions": {
+       "baseUrl": ".",
+       "paths": {
+         "@/*": ["./src/*"]
+       }
+     }
+   }
+   ```
+
+4. ### Run the CLI
+
+   Run the `shadcn-ng` init command to setup your project:
+
+   ```bash
+   npx shadcn-ng@latest init
+   ```
+
+5. ### Configure components.json
+
+   You will be asked a few questions to configure `components.json`:
+
+   ```txt showLineNumbers
+   Which style would you like to use? › Default
+   Which color would you like to use as base color? › Slate
+   Where is your global CSS file? › src/style.css
+   Do you want to use CSS variables for colors? › no / yes
+   Where is your tailwind.config.js located? › tailwind.config.js
+   Configure the import alias for components: › @/components
+   Configure the import alias for utils: › @/lib/utils
+   ```
+
+6. ### That's it
+
+   You can now start adding components to your project.
+
+   ```bash
+   npx shadcn-ui@latest add button
+   ```
+
+   The command above will add the `Button` component to your project. You can then import it like this:
+
+   ```angular-ts showLineNumbers
+    import { Component } from "@angular/core";
+    import { UbButtonDirective } from "@/components/ui/button.directive";
+
+    @Component({
+        standalone: true,
+        imports: [UbButtonDirective],
+        template: `<button ubButton>Button</button>`,
+    })
+    export class ButtonDemoComponent {}
+   ```
+
+</Steps>

apps/www/src/content/docs/docs/installation/index.mdx

@@ -0,0 +1,30 @@
+---
+title: Installation
+description: How to install dependencies and structure your app.
+---
+
+import { LinkCard, CardGrid } from "@astrojs/starlight/components";
+
+## Frameworks
+
+<CardGrid>
+  <LinkCard
+    title="Angular"
+    href="/docs/installation/angular"
+    class="!no-underline"
+  />
+</CardGrid>
+
+## TypeScript
+
+To configure import aliases, you can use the following `jsconfig.json`:
+
+```json {4} title="jsconfig.json"
+{
+  "compilerOptions": {
+    "paths": {
+      "@/*": ["./*"]
+    }
+  }
+}
+```