Rest Parameters [...subpage1].astro

This subpage demonstrates the implementation of dynamic routing in an Astro project with internationalization. It uses URL structure /dynamic-routing/subpage-1 for English, which automatically converts to the Slovenian version /sl/dinamicno-usmerjanje/podstran-1. Below you can see the actual code that enables this functionality.

// Get current language from URL
export function getStaticPaths() {
    return [
        // English route: /dynamic-routing/subpage-1
        // [...subpage1] = "subpage-1" captures the specific subpage
        // This creates the final URL: /dynamic-routing/subpage-1
        {
            params: {
                dyn_routing: "/dynamic-routing",
                subpage1: "subpage-1",
            },
            props: { lang: "en" },
        },
        // Slovenian route: /sl/dinamicno-usmerjanje/podstran-1
        // [...subpage1] = "podstran-1" captures the localized subpage name
        // This creates the final URL: /sl/dinamicno-usmerjanje/podstran-1
        {
            params: {
                dyn_routing: "/sl/dinamicno-usmerjanje",
                subpage1: "podstran-1",
            },
            props: { lang: "sl" },
        },
    ];
}

Component Example

Below is an example of a reusable component that can be integrated into any page. This component is built using Svelte and demonstrates how to pass translations as props for dynamic content rendering.