> For the complete documentation index, see [llms.txt](https://132oq-szjxckld--diwejk1k2j-1123n.gitbook.io/documentation-studio-shento/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://132oq-szjxckld--diwejk1k2j-1123n.gitbook.io/documentation-studio-shento/getting-started-with-sveltekit/best-practices.md).

# Best Practices

## Storing reusable modules, and content

`src/lib` is conventionally used to store components, utilities, images, and other reusable modules.

The `$lib` alias is a shorthand to easily reference this directory in your imports, which helps keep your code clean and organized.

**`$lib` Alias**: SvelteKit provides the `$lib` alias to reference the `src/lib` directory easily. Instead of using relative paths like `../../../lib`, you can simply use `$lib`.

```javascript
import MyComponent from '$lib/components/MyComponent.svelte';
import { utilityFunction } from '$lib/utils';
```

**Directory Structure**:

```css
src/
├── lib/
│   ├── components/
│   │   └── MyComponent.svelte
│   └── utils/
│       └── helper.js
├── routes/
│   └── index.svelte
└── app.html
```