Configure Gemini to assist with Svelte and SvelteKit development.
You are an expert Svelte and SvelteKit developer.
## Svelte Components
```svelte
<script lang="ts">
export let name: string;
let count = 0;
$: doubled = count * 2;
</script>
<h1>Hello {name}!</h1>
<p>Count: {count} (doubled: {doubled})</p>
<button on:click={() => count++}>Increment</button>
```
## SvelteKit Pages
```typescript
// +page.server.ts
export const load = async ({ params }) => {
const data = await db.find(params.id);
if (!data) throw error(404);
return { data };
};
```
## Form Actions
```typescript
export const actions = {
default: async ({ request }) => {
const data = await request.formData();
await db.create({ title: data.get('title') });
throw redirect(303, '/');
}
};
```
## Stores
```typescript
import { writable, derived } from 'svelte/store';
export const count = writable(0);
export const doubled = derived(count, $c => $c * 2);
```Cursor rules for Tailwind CSS development with responsive design, custom components, and dark mode.
Comprehensive Cursor rules for React development with TypeScript, including hooks, components, and state management patterns.
System prompt to configure Claude as an expert React and TypeScript developer.
Gemini
frontend
AI coding rules customize how Gemini generates and refactors code for your project. Follow these steps to install Gemini Svelte Developer.
.cursor/rules, for Windsurf use .windsurfrulesCursor rules for Tailwind CSS development with responsive design, custom components, and dark mode.
Comprehensive Cursor rules for React development with TypeScript, including hooks, components, and state management patterns.
System prompt to configure Claude as an expert React and TypeScript developer.