{% extends "docs_base.html" %}
{% block content %}
<div class="prose prose-slate max-w-none">
<h1>Views</h1>
<p>Ruskit uses a powerful templating system to render dynamic HTML content. Views allow you to separate your HTML from your application logic while providing features like template inheritance, components, and dynamic data binding.</p>
<h2>Creating Templates</h2>
<p>Templates in Ruskit are Rust structs that implement the Template trait:</p>
<pre><code class="language-rust">#[derive(Template)]
#[template(path = "users/index.html")]
pub struct UsersTemplate {
pub users: Vec<User>,
pub title: String,
}</code></pre>
<h2>Template Syntax</h2>
<p>Askama provides a powerful templating syntax similar to Jinja2:</p>
<h3>Variables</h3>
<pre><code class="language-html">{% raw %}<h1>{{ title }}</h1>
<p>Welcome, {{ user.name }}!</p>{% endraw %}</code></pre>
<h3>Loops</h3>
<pre><code class="language-html">{% raw %}{% for user in users %}
<div class="user">
<h2>{{ user.name }}</h2>
<p>{{ user.email }}</p>
</div>
{% endfor %}{% endraw %}</code></pre>
<h3>Conditionals</h3>
<pre><code class="language-html">{% raw %}{% if user.is_admin %}
<div class="admin-panel">...</div>
{% else %}
<div class="user-panel">...</div>
{% endif %}{% endraw %}</code></pre>
<h3>Template Inheritance</h3>
<p>You can extend base templates and override blocks:</p>
<pre><code class="language-html">{% raw %}{% extends "base.html" %}
{% block title %}User Profile{% endblock %}
{% block content %}
<h1>{{ user.name }}'s Profile</h1>
...
{% endblock %}{% endraw %}</code></pre>
<h2>Using Templates in Controllers</h2>
<p>Templates can be used directly in your controllers:</p>
<pre><code class="language-rust">pub async fn index() -> Response {
let template = UsersTemplate {
users: User::all().await?,
title: "Users".to_string(),
};
template.into_response()
}</code></pre>
<h2>Template Organization</h2>
<p>Templates should be organized in the <code>templates</code> directory:</p>
<pre><code>templates/
├── base.html
├── users/
│ ├── index.html
│ ├── show.html
│ └── edit.html
└── posts/
├── index.html
└── show.html</code></pre>
<h2>Best Practices</h2>
<ul>
<li>Keep templates DRY by using inheritance and includes</li>
<li>Use meaningful names for template files and structs</li>
<li>Organize templates by feature or resource</li>
<li>Keep logic in controllers, not templates</li>
<li>Use consistent naming conventions</li>
</ul>
</div>
{% endblock %}