Jump to main content

Routing

Information regarding the compiler.


Routing

To mark a route within the scope of your SPA, prefix the route's name attribute with $ in the urls.py file corresponding to the view. When you've done so, create a corresponding .svelte file in the views subdirectory (create if necessary).

my_project_name             <-- Your Django project directory
├── manage.py
├── home_page               <-- Your Django app directory
│   ├── ...
│   ├── urls.py
│   ├── views.py
│   └── views               <-- Create this subdirectory
│       ├── index.svelte    <-- One for every name="$example" in your urls.py
│       └── about.svelte
└── ...

DxSvelte honours the existing Django router by resolving it during compilation and creating a 'mirror' for the front-end's router. The core built-in URL dispatchers are all supported:

  • str
  • int
  • slug
  • uuid
  • path

Basic Examples

# home_page/urls.py
from django.urls import path
from . import views

urlpatterns = [
    path('article/new/', views.new, name='post_handler'),
    path('article/<int:article_id>/', views.article, name='$article'),
]
# home_page/views.py
from django.http import HttpResponse
from dxsvelte import render

def article(req, article_id):
    data = {...} # Your logic here
    return render(req, data) # Call DxSvelte's render method

ViewState

This is a store you can import from @common which returns an object containing pathSatisfies(), a function you can use to safely compare a path against the user's current session without manually wading through Django's URL dispatchers.

You might use it within a link component to style nav links differently when their href attribute is the one currently being visited by assigning a reactive variable named 'active' to its evaluation, like so.

// example.svelte
<script>
    import { ViewState } from "@common";
    export let href;
    $: active = $ViewState.pathSatisfies(href);
</script>

Presently, this is the only function exposed by this store - expect it to grow.