Add generic web quick start

src/routes/docs/quick-starts/+page.svelte

@@ -19,6 +19,12 @@
         {
             title: 'Web app',
             quickStarts: [
+                {
+                    title: 'Web',
+                    icon: 'icon-js',
+                    image: '/images/blog/placeholder.png',
+                    href: 'web'
+                },
                 {
                     title: 'Next.js',
                     icon: 'icon-nextjs',

src/routes/docs/quick-starts/web/+page.markdoc

@@ -0,0 +1,151 @@
+---
+layout: article
+title: Start with Web
+description: Build JavaScript or Typescript web apps with Appwrite and learn how to use our powerful backend to add authentication, user management, file storage, and more.
+difficulty: beginner
+readtime: 3
+back: /docs/quick-starts
+---
+
+Learn how to add Appwrite to your JavaScript or TypeScript web apps.
+{% section #step-1 step=1 title="Create project" %}
+Head to the [Appwrite Console](https://cloud.appwrite.io/console).
+
+{% only_dark %}
+![Create project screen](/images/docs/quick-starts/dark/create-project.png)
+{% /only_dark %}
+{% only_light %}
+![Create project screen](/images/docs/quick-starts/create-project.png)
+{% /only_light %}
+
+If this is your first time using Appwrite, create an account and create your first project.
+
+Then, under **Add a platform**, add a **Web app**. 
+The **Hostname** should be `localhost` or the domain on which you're hosting your web app. 
+
+{% only_dark %}
+![Add a platform](/images/docs/quick-starts/dark/add-platform.png)
+{% /only_dark %}
+{% only_light %}
+![Add a platform](/images/docs/quick-starts/add-platform.png)
+{% /only_light %}
+
+You can skip optional steps.
+
+{% /section %}
+{% section #step-2 step=2 title="Create project" %}
+You can add the Appwrite Web SDK using CDN with a script tag.
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/appwrite@13.0.1"></script>
+```
+
+You can also install the Appwrite Web SDK using a package manager.
+```sh
+npm install appwrite
+```
+{% /section %}
+{% section #step-3 step=3 title="Import Appwrite" %}
+```js
+import { Client, Account } from 'appwrite';
+
+export const client = new Client();
+
+client
+    .setEndpoint('https://cloud.appwrite.io/v1')
+    .setProject('<YOUR_PROJECT_ID>'); // Replace with your project ID
+
+export const account = new Account(client);
+export { ID } from 'appwrite';
+```
+{% /section %}
+
+{% section #step-4 step=4 title="Using TypeScript" %}
+If you prefer TypeScript, you can import TypeScript models from the Appwrite SDK.
+
+```ts
+// appwrite.ts
+
+import { Client, Databases, Account } from "appwrite";
+// Import type models for Appwrite
+import { type Models } from 'appwrite';
+
+const client: Client = new Client();
+
+client
+    .setEndpoint(<>>)
+    .setProject(project);
+
+export const account: Account = new Account(client);
+export const database: Databases = new Databases(client);
+
+// You then use the imported type definitions like this
+const authUser: Models.Session = await account.createEmailSession(email, password);
+```
+{% /section %}
+
+{% section #step-5 step=5 title="Extending TypeScript models" %}
+Sometimes you'll need to extend TypeScript models with your own type definitions.
+
+For example, when you fetch a list of documents from a collection, you can define the expected structure of the documents like this.
+```ts
+interface Idea extends Models.Document {
+    title: string;
+    description: string;
+    userId: string;
+}
+```
+
+When you fetch documents, you can use this new `Idea` interface like this.
+
+```ts
+const response = await database.listDocuments(
+    ideasDatabaseId,
+    ideasCollectionId,
+    [Query.orderDesc("$createdAt"), Query.limit(queryLimit)]
+);
+const ideas = response.documents as Idea[];
+```
+{% /section %}
+
+{% section #step-6 step=6 title="All set" %}
+The Appwrite SDK works with your favorite Web frameworks. 
+
+Learn to use Appwrite by adding authentication to a simple web app.
+{% cards %}
+{% cards_item href="/docs/quick-starts/nextjs" title="Next.js" %}
+Get started with Appwrite and Next.js
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/react" title="React" %}
+Get started with Appwrite and React
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/vue" title="Vue.js" %}
+Get started with Appwrite and Vue.js
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/nuxt" title="Nuxt" %}
+Get started with Appwrite and Nuxt
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/sveltekit" title="SvelteKit" %}
+Get started with Appwrite and SvelteKit
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/angular" title="Angular" %}
+Get started with Appwrite and Angular
+{% /cards_item %}
+{% /cards %}
+
+Learn to use Appwrite by building an idea tracker app.
+{% cards %}
+{% cards_item href="/docs/quick-starts/react" title="React" %}
+Get started with Appwrite and React
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/vue" title="Vue.js" %}
+Get started with Appwrite and Vue.js
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/nuxt" title="Nuxt" %}
+Get started with Appwrite and Nuxt
+{% /cards_item %}
+{% cards_item href="/docs/quick-starts/sveltekit" title="SvelteKit" %}
+Get started with Appwrite and SvelteKit
+{% /cards_item %}
+{% /cards %}
+{% /section %}

src/routes/docs/tutorials/nuxt/step-4/+page.markdoc

@@ -137,7 +137,7 @@ The handle submit and submit type are props passed from `pages/login.vue`
 <!-- components/authForm.vue -->
 
 <template>
-  <form
+<form
   class="form u-width-full-line u-max-width-500 u-margin-block-start-16"
   @submit.prevent="handleSubmit"
 >