<script>
// src/routes/items/+page.svelte
import { graphql } from '$houdini'
const AllItems = graphql(`
query AllItems @load {
items {
text
}
}
`)
</script>
{#each $AllItems.data.items as item}
<div>{item.text}</div>
{/each}
- Composable and colocated data requirements for your components
- Normalized cache with declarative updates
- Generated types
- Subscriptions
- Pagination (cursors and offsets)
At its core, houdini seeks to enable a high quality developer experience without compromising bundle size. Like Svelte, houdini shifts what is traditionally handled by a bloated runtime into a compile step that allows for the generation of an incredibly lean GraphQL abstraction for your application.
For a detailed example, you can check out the example-sveltekit-todo or the final version of the Pokédex application from the Getting Started guide.
For documentation, please visit the api reference on the website.
For an in-depth guide to getting started with Houdini, check out the guide on our website.
If you are interested in helping out, the contributing guide should provide some guidance. If you need something more specific, feel free to reach out on our discord (we are online almost 24/7 like @AlecAivazis and others). There's lots to help with regardless of how deep you want to dive or how much time you can spend 🙂