From 50eb628facef1c05e3b94984b1b9aa50860c85f2 Mon Sep 17 00:00:00 2001 From: Romain Crestey Date: Tue, 17 Dec 2024 08:38:31 +0100 Subject: [PATCH] fr: content/tutorial/01-svelte/01-introduction --- .github/workflows/doc-tracker.yml | 15 +++++- .../+assets/src/routes/+error.svelte | 5 +- .../+assets/app-a/src/lib/App.svelte | 2 +- .../01-welcome-to-svelte/index.md | 49 +++++++++++++------ .../content/tutorial/01-svelte/index.md | 4 +- apps/svelte.dev/content/tutorial/index.md | 2 +- .../routes/tutorial/[...slug]/Controls.svelte | 8 +-- 7 files changed, 57 insertions(+), 28 deletions(-) diff --git a/.github/workflows/doc-tracker.yml b/.github/workflows/doc-tracker.yml index 21ab08674..bcaee5bf1 100644 --- a/.github/workflows/doc-tracker.yml +++ b/.github/workflows/doc-tracker.yml @@ -21,7 +21,7 @@ jobs: dir: apps/svelte.dev/content/docs/svelte track-docs-cli: runs-on: ubuntu-latest - name: Checking Docs Svelte + name: Checking Docs CLI steps: - name: Checkout code uses: actions/checkout@v4 @@ -32,3 +32,16 @@ jobs: owner: sveltejs repo: svelte.dev dir: apps/svelte.dev/content/docs/cli + track-docs-tuto1: + runs-on: ubuntu-latest + name: Checking Tutorial 01 + steps: + - name: Checkout code + uses: actions/checkout@v4 + - name: Svelte docs new commits + uses: AlexxNB/track-commits-to-issue@master + with: + token: ${{ secrets.GITHUB_TOKEN }} + owner: sveltejs + repo: svelte.dev + dir: apps/svelte.dev/content/tutorial/01-svelte diff --git a/apps/svelte.dev/content/tutorial/01-svelte/+assets/src/routes/+error.svelte b/apps/svelte.dev/content/tutorial/01-svelte/+assets/src/routes/+error.svelte index 1b4c6ee00..de057b5d9 100644 --- a/apps/svelte.dev/content/tutorial/01-svelte/+assets/src/routes/+error.svelte +++ b/apps/svelte.dev/content/tutorial/01-svelte/+assets/src/routes/+error.svelte @@ -3,12 +3,11 @@ {#if page.status === 404} -

Not found

+

Introuvable

Go to /

{:else}

- Server-side rendering failed with HTTP status - code + Le rendu côté serveur a échoué avec un code HTTP Welcome! +

Bienvenue !

diff --git a/apps/svelte.dev/content/tutorial/01-svelte/01-introduction/01-welcome-to-svelte/index.md b/apps/svelte.dev/content/tutorial/01-svelte/01-introduction/01-welcome-to-svelte/index.md index 07d0af363..a6a99ae9d 100644 --- a/apps/svelte.dev/content/tutorial/01-svelte/01-introduction/01-welcome-to-svelte/index.md +++ b/apps/svelte.dev/content/tutorial/01-svelte/01-introduction/01-welcome-to-svelte/index.md @@ -1,30 +1,47 @@ --- -title: Welcome to Svelte +title: Bienvenue dans le monde de Svelte --- -Welcome to the Svelte tutorial! This will teach you everything you need to know to easily build web applications of all sizes, with high performance and a small footprint. +Bienvenue dans le tutoriel de Svelte ! Celui-ci va vous apprendre tout ce qu'il faut savoir pour +construire facilement des applications web performantes et optimisées de toutes envergures. -You can also consult the [API docs](https://svelte.dev/docs) and visit the [playground](https://svelte.dev/playground), or — if you're impatient to start hacking on your machine locally — create a project with `npx sv create`. +Vous pouvez également consulter la [documentation de l'API](/docs) et faire un tour dans le [bac à +sable](/playground), ou — si vous êtes impatient•e de commencer sur votre machine — créer un projet +avec `npx sv create`. -## What is Svelte? +## C'est quoi Svelte ? [!VO]What is Svelte? -Svelte is a tool for building web applications. Like other user interface frameworks, it allows you to build your app _declaratively_ out of components that combine markup, styles and behaviours. +Svelte est un outil permettant de construire des applications web. Comme toute autre framework +d'interface, il vous permet de construire votre application _déclarativement_ à partir de composants +combinant markup, styles, et logique. -These components are _compiled_ into small, efficient JavaScript modules that eliminate overhead traditionally associated with UI frameworks. +Ces composants sont _compilés_ en de petits modules JavaScript optimisés éliminant tout surcoût +usuellement associé avec un framework d'interface quelconque. -You can build your entire app with Svelte (for example, using an application framework like [SvelteKit](/docs/kit), which this tutorial will cover), or you can add it incrementally to an existing codebase. You can also ship components as standalone packages that work anywhere. +Vous pouvez construire votre application entière avec Svelte (par exemple, en utilisant un framework +d'application comme [SvelteKit](/docs/kit), que ce tutoriel va présenter), ou l'introduire +progressivement dans une codebase existante. Vous pouvez aussi déployer des composants en tant que +paquets indépendants utilisables partout. -## How to use this tutorial +## Comment utiliser ce tutoriel [!VO]How to use this tutorial -> [!NOTE] You'll need to have basic familiarity with HTML, CSS and JavaScript to understand Svelte. +> [!NOTE] Des connaissances de base en HTML, CSS et JavaScript sont nécessaires pour comprendre le +> fonctionnement de Svelte. -This tutorial is split into four main parts: +Ce tutoriel est divisé en quatre sections principales : -- [Basic Svelte](/tutorial/svelte/welcome-to-svelte) (you are here) -- [Advanced Svelte](/tutorial/svelte/tweens) -- [Basic SvelteKit](/tutorial/kit/introducing-sveltekit) -- [Advanced SvelteKit](/tutorial/kit/optional-params) +- [Bases de Svelte](/tutorial/svelte/welcome-to-svelte) (vous êtes ici) +- [Svelte avancé](/tutorial/svelte/tweens) +- [Bases de SvelteKit](/tutorial/kit/introducing-sveltekit) +- [SvelteKit avancé](/tutorial/kit/optional-params) -Each section will present an exercise designed to illustrate a feature. Later exercises build on the knowledge gained in earlier ones, so it's recommended that you go from start to finish. If necessary, you can navigate via the menu above. +Chaque section vous présentera un exercice conçu pour illustrer une fonctionnalité. Les exercices se +basent sur les connaissances acquises dans les exercices précédents, il est donc recommandé de +suivre ce tutoriel de début à la fin. Si besoin, vous pouvez naviguer entre les exercices grâce au +menu ci-dessus. -If you get stuck, you can click the `solve` button in the top right of the screen. (The `solve` button is disabled on sections like this one that don't include an exercise.) Try not to rely on it too much; you will learn faster by figuring out where to put each suggested code block and manually typing it in to the editor. +Si vous êtes bloqué•e, vous pouvez cliquer sur le bouton `résoudre` dans le coin supérieur droit de +l'écran. (Le bouton `résoudre` est désactivé pour les sections comme celle-ci qui n'ont pas +d'exercice.) Essayez de ne pas vous en servir trop souvent ; vous apprendrez plus vite en trouvant +par vous-même où les blocs de code suggérés doivent se placer et en les tapant vous-même dans +l'éditeur. diff --git a/apps/svelte.dev/content/tutorial/01-svelte/index.md b/apps/svelte.dev/content/tutorial/01-svelte/index.md index ea663e473..f48030cea 100644 --- a/apps/svelte.dev/content/tutorial/01-svelte/index.md +++ b/apps/svelte.dev/content/tutorial/01-svelte/index.md @@ -1,6 +1,6 @@ --- -title: Basic Svelte -label: Part 1 +title: Bases de Svelte +label: Partie 1 scope: { 'prefix': '/src/lib/', 'name': 'src' } focus: /src/lib/App.svelte --- diff --git a/apps/svelte.dev/content/tutorial/index.md b/apps/svelte.dev/content/tutorial/index.md index bbcd708d8..a5e4d5c9f 100644 --- a/apps/svelte.dev/content/tutorial/index.md +++ b/apps/svelte.dev/content/tutorial/index.md @@ -1,3 +1,3 @@ --- -title: Tutorial +title: Tutoriel --- diff --git a/apps/svelte.dev/src/routes/tutorial/[...slug]/Controls.svelte b/apps/svelte.dev/src/routes/tutorial/[...slug]/Controls.svelte index 31c5011b3..ba17e13cd 100644 --- a/apps/svelte.dev/src/routes/tutorial/[...slug]/Controls.svelte +++ b/apps/svelte.dev/src/routes/tutorial/[...slug]/Controls.svelte @@ -47,13 +47,13 @@ @@ -66,9 +66,9 @@