feat: update version to v0.16.9

Co-authored-by: Marco Pasqualetti <marco.pasqualetti@live.com>

.editorconfig

@@ -0,0 +1,7 @@
+[*]
+charset = utf-8
+insert_final_newline = true
+end_of_line = lf
+indent_style = space
+indent_size = 2
+max_line_length = 80

.eslintrc

@@ -1,106 +0,0 @@
-{
-  "root": true,
-  "reportUnusedDisableDirectives": true,
-  "ignorePatterns": ["**/build", "**/dist"],
-  "parser": "@typescript-eslint/parser",
-  "plugins": ["@typescript-eslint", "import"],
-  "extends": [
-    "eslint:recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:@typescript-eslint/stylistic",
-    "plugin:import/recommended",
-    "plugin:import/typescript",
-    "prettier",
-  ],
-  "env": {
-    "browser": true,
-    "es2020": true,
-  },
-  "parserOptions": {
-    "tsconfigRootDir": ".",
-    "project": true,
-    "sourceType": "module",
-    "ecmaVersion": 2020,
-  },
-  "settings": {
-    "import/parsers": {
-      "@typescript-eslint/parser": [".ts", ".tsx"],
-    },
-    "import/resolver": {
-      "typescript": true,
-    },
-    "react": {
-      "version": "detect",
-    },
-  },
-  "rules": {
-    "@typescript-eslint/array-type": "error",
-    "@typescript-eslint/no-wrapper-object-types": "error",
-    "@typescript-eslint/no-empty-object-type": "error",
-    "@typescript-eslint/no-unsafe-function-type": "error",
-    "@typescript-eslint/ban-ts-comment": "error",
-    "@typescript-eslint/consistent-type-definitions": "error",
-    "@typescript-eslint/consistent-type-imports": [
-      "error",
-      { "prefer": "type-imports" },
-    ],
-    "@typescript-eslint/explicit-module-boundary-types": "error",
-    "@typescript-eslint/method-signature-style": ["error", "property"],
-    "@typescript-eslint/naming-convention": [
-      "error",
-      {
-        "selector": "typeParameter",
-        "format": ["PascalCase"],
-        "leadingUnderscore": "forbid",
-        "trailingUnderscore": "forbid",
-        "custom": {
-          "regex": "^(T|T[A-Z][A-Za-z]+)$",
-          "match": true,
-        },
-      },
-    ],
-    "@typescript-eslint/no-deprecated": "error",
-    "@typescript-eslint/no-empty-function": "error",
-    "@typescript-eslint/no-empty-interface": "error",
-    "@typescript-eslint/no-explicit-any": "off",
-    "@typescript-eslint/no-non-null-assertion": "error",
-    "@typescript-eslint/no-unnecessary-condition": "error",
-    "@typescript-eslint/no-unnecessary-type-assertion": "error",
-    "@typescript-eslint/no-unused-vars": "error",
-    "@typescript-eslint/explicit-function-return-type": "error",
-    "@typescript-eslint/no-inferrable-types": [
-      "error",
-      { "ignoreParameters": true },
-    ],
-    "import/default": "error",
-    "import/export": "error",
-    "import/namespace": "error",
-    "import/newline-after-import": "error",
-    "import/no-cycle": "error",
-    "import/no-duplicates": "off",
-    "import/no-named-as-default-member": "error",
-    "import/no-unused-modules": "error",
-    "import/order": [
-      "off",
-      {
-        "groups": [
-          "builtin",
-          "external",
-          "internal",
-          "parent",
-          "sibling",
-          "index",
-          "object",
-          "type",
-        ],
-      },
-    ],
-    "no-case-declarations": "error",
-    "no-empty": "error",
-    "no-prototype-builtins": "error",
-    "no-redeclare": "error",
-    "no-shadow": "error",
-    "no-undef": "off",
-    "sort-imports": "off",
-  },
-}

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -32,55 +32,24 @@ body:
       description: If applicable, add screenshots to help explain your problem.
     validations:
       required: false
-  - type: input
-    id: tuono-version
-    attributes: 
-      label: Tuono version
-      placeholder: "[e.g. 0.4.0]"
+  - type: textarea
+    id: system-info
+    attributes:
+      label: System Info
+      description: Output of `npx envinfo --system --npmPackages 'tuono' --binaries --browsers`
+      render: shell
+      placeholder: System, Binaries, Browsers
     validations:
-      required: false
-  - type: input
-    id: os-version
-    attributes: 
-      label: OS
-      placeholder: "[e.g. MacOS, Windows]"
+      required: true
+  - type: textarea
+    id: system-info-rust
+    attributes:
+      label: System info (Rust)
+      description: Output of `rustc --version && cargo --version && tuono --version`
+      render: shell
+      placeholder: 'rustc, cargo and tuono binary version'
     validations:
-      required: false
-  - type: input
-    id: browser-version
-    attributes: 
-      label: Browser
-      placeholder: "[e.g. chrome, safari]"
-    validations:
-      required: false
-  - type: input
-    id: node-version
-    attributes: 
-      label: Node version
-      placeholder: "[e.g. 20.0.0]"
-    validations:
-      required: false
-  - type: input
-    id: rust-version
-    attributes: 
-      label: Rust version
-      placeholder: "[e.g. 1.79.0]"
-    validations:
-      required: false
-  - type: input
-    id: create-version
-    attributes: 
-      label: Crate version
-      placeholder: "[e.g. 1.78.0]"
-    validations:
-      required: false
-  - type: input
-    id: node-package-manager-version
-    attributes: 
-      label: Node Package Manger version
-      placeholder: "[e.g. pnpm: 9.5.0] "
-    validations:
-      required: false
+      required: true
   - type: textarea
     id: additional-context
     attributes:

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -33,4 +33,3 @@ body:
       description: Add any other context or screenshots about the feature request here.
     validations:
       required: false
-

.github/pull_request_template.md

@@ -1,7 +1,7 @@
 ## Context & Description
 
 <!--
-Thank you for your Pull Request. 
+Thank you for your Pull Request.
 
 Explain the context and why you're making that change. What is the problem
 you're trying to solve? If a new feature is being added, describe the intended

.github/workflows/ci-documentation.yml

@@ -2,20 +2,29 @@ name: Documentation Website CI
 
 on:
   push:
+    branches:
+      - 'main'
     paths:
+      # ⬇ Keep paths in sync with `typescript.yml`
       - '.github/**'
+      - '*'
+      - '!Cargo.toml'
+      # ⬆ Keep paths in sync with `typescript.yml`
       - 'apps/documentation/**'
   pull_request:
     paths:
+      # ⬇ Keep paths in sync with `typescript.yml`
       - '.github/**'
+      - '*'
+      - '!Cargo.toml'
+      # ⬆ Keep paths in sync with `typescript.yml`
       - 'apps/documentation/**'
 
 jobs:
   build:
-    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
     name: Check build
-    timeout-minutes: 15
     runs-on: ubuntu-latest
+    timeout-minutes: 15
 
     steps:
       - name: Checkout code
@@ -28,15 +37,14 @@ jobs:
         uses: actions-rust-lang/setup-rust-toolchain@v1
 
       - name: Install tuono
-        run: cargo install tuono@0.12.3
+        run: cargo install tuono@0.16.4
 
       - name: Build project
         working-directory: ./apps/documentation
         run: tuono build --static
 
-  fmt-lint-and-types:
-    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
-    name: Check format and lint
+  code_check:
+    name: Check format, lint and types
     runs-on: ubuntu-latest
     timeout-minutes: 15
 

.github/workflows/deploy-documentation.yml

@@ -1,14 +1,16 @@
 name: Deploy documentation website on AWS S3
+
 on:
   push:
     branches:
-      - main
+      - 'main'
     paths:
       - '.github/**'
       - 'apps/documentation/**'
 
 jobs:
   deploy-documentation:
+    name: Deploy
     runs-on: ubuntu-latest
 
     env:
@@ -25,7 +27,7 @@ jobs:
         uses: actions-rust-lang/setup-rust-toolchain@v1
 
       - name: Install tuono
-        run: cargo install tuono@0.12.3
+        run: cargo install tuono@0.16.4
 
       - name: Build project
         working-directory: ./apps/documentation

.github/workflows/release.yml

@@ -1,11 +1,14 @@
 name: Publish on npm and crates
+
 on:
   release:
     types: [published]
 
 jobs:
-  publish-on-npm-dry-run:
+  publish_npm_dry_run:
+    name: NPM publish (dry run)
     runs-on: ubuntu-latest
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
@@ -23,16 +26,18 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
-  publish-on-crates-dry-run:
+  publish_crates_dry_run:
+    name: Crates publish (dry run)
     runs-on: ubuntu-latest
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - uses: actions-rs/toolchain@v1
+      - name: Setup rust toolchain
+        uses: actions-rust-lang/setup-rust-toolchain@v1
         with:
-          toolchain: stable
-          override: true
+          toolchain: 'stable'
 
       - uses: katyo/publish-crates@v2
         with:
@@ -41,9 +46,11 @@ jobs:
           registry-token: ${{ secrets.CARGO_REGISTRY_TOKEN }}
           check-repo: true
 
-  publish-on-npm:
-    needs: [publish-on-crates-dry-run, publish-on-npm-dry-run]
+  publish_npm:
+    name: NPM publish
+    needs: [publish_npm_dry_run, publish_crates_dry_run]
     runs-on: ubuntu-latest
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
@@ -64,17 +71,19 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
-  publish-on-crates:
-    needs: [publish-on-crates-dry-run, publish-on-npm-dry-run]
+  publish_crates:
+    name: Crates publish
+    needs: [publish_npm_dry_run, publish_crates_dry_run]
     runs-on: ubuntu-latest
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - uses: actions-rs/toolchain@v1
+      - name: Setup rust toolchain
+        uses: actions-rust-lang/setup-rust-toolchain@v1
         with:
-          toolchain: stable
-          override: true
+          toolchain: 'stable'
 
       - uses: katyo/publish-crates@v2
         with:

.github/workflows/repo-root-ci.yml

@@ -0,0 +1,33 @@
+name: Repo root CI
+
+# All workflows are triggered based on specific paths,
+# the root repository is something that is not applicable to rust nor typescript
+# so it has been moved in a standalone workflow
+
+on:
+  push:
+    branches:
+      - 'main'
+    paths:
+      - '.github/**'
+      - '*'
+  pull_request:
+    paths:
+      - '.github/**'
+      - '*'
+
+jobs:
+  build-and-test:
+    name: Check format
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Install NodeJS Dependencies
+        uses: ./.github/actions/install-node-dependencies
+
+      - name: Test project
+        run: pnpm repo:root:format:check

.github/workflows/rust.yml

@@ -2,20 +2,58 @@ name: Rust CI
 
 on:
   push:
+    branches:
+      - 'main'
     paths:
       - '.github/**'
+      - 'Cargo.toml'
       - 'crates/**'
   pull_request:
     paths:
       - '.github/**'
+      - 'Cargo.toml'
       - 'crates/**'
 
 env:
   CARGO_TERM_COLOR: always
 
 jobs:
+  build_and_test:
+    name: Build and test crates on ${{ matrix.os }} with rust ${{ matrix.toolchain }}
+
+    strategy:
+      fail-fast: true
+      matrix:
+        os:
+          - 'ubuntu-latest'
+          - 'macos-latest'
+          - 'windows-latest'
+        toolchain:
+          - 'stable'
+
+        # Test `beta` and `nightly` toolchains only on `ubuntu`
+        # https://docs.github.com/en/actions/writing-workflows/choosing-what-your-workflow-does/running-variations-of-jobs-in-a-workflow#expanding-or-adding-matrix-configurations
+        include:
+          - toolchain: 'beta'
+            os: 'ubuntu-latest'
+          - toolchain: 'nightly'
+            os: 'ubuntu-latest'
+
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Setup rust toolchain
+        uses: actions-rust-lang/setup-rust-toolchain@v1
+        with:
+          toolchain: ${{ matrix.toolchain }}
+
+      - run: cargo build --verbose
+      - run: cargo test --verbose
+
   lint_and_fmt:
-    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
     name: Check format and lint rust crates
     runs-on: ubuntu-latest
 
@@ -23,23 +61,8 @@ jobs:
       - name: Checkout code
         uses: actions/checkout@v4
 
+      - name: Setup rust toolchain
+        uses: actions-rust-lang/setup-rust-toolchain@v1
+
       - run: cargo fmt --all -- --check
       - run: cargo clippy -- -D warnings
-
-  build_and_test:
-    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
-    name: Build and test rust crates
-    runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        toolchain:
-          - stable
-          - beta
-          - nightly
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-
-      - run: rustup update ${{ matrix.toolchain }} && rustup default ${{ matrix.toolchain }}
-      - run: cargo build --verbose
-      - run: cargo test --verbose

.github/workflows/spell-checking.yml

@@ -1,23 +1,66 @@
 name: Spell Checker
 
-on: [pull_request]
+on:
+  push:
+    branches:
+      - 'main'
+
+  pull_request:
 
 jobs:
   spell_checking:
-    name: runner / LanguageTools
+    name: LanguageTool
     runs-on: ubuntu-latest
+
+    permissions:
+      checks: write
+      contents: read
+      pull-requests: write
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
-
-      - uses: reviewdog/action-languagetool@v1
         with:
-          github_token: ${{ secrets.REVIEWDOG_TOKEN }}
+          # Keep this value in order to show the error comments
+          # also on edited files.
+          fetch-depth: 2
+
+      # If the workflow is triggered by a push use check reporter
+      #
+      # If the workflow is triggered by a PR coming from the
+      # same repository, the author has write access so we can
+      # use pr-review reporter since the GITHUB_TOKEN will have review
+      # write permissions
+      #
+      # Otherwise use annotation reporter that do not require any
+      # particular permission
+      #
+      # Why this?
+      # https://github.com/Valerioageno/tuono/pull/137#pullrequestreview-2455455272
+      - name: Set reporter
+        id: reporter
+        env:
+          EVENT_NAME: ${{ github.event_name }}
+          FROM_MAIN_REPO: ${{ github.event.pull_request.head.repo.full_name == github.event.pull_request.base.repo.full_name }}
+        run: |
+          echo "EVENT_NAME: $EVENT_NAME FROM_MAIN_REPO: $FROM_MAIN_REPO"
+          if [ "$EVENT_NAME" == 'push' ]; then
+            echo "name=github-check" >> $GITHUB_OUTPUT
+          elif [ "$FROM_MAIN_REPO" == 'true' ]; then
+            echo "name=github-pr-review" >> $GITHUB_OUTPUT
+          else
+            echo "name=github-pr-annotations" >> $GITHUB_OUTPUT
+          fi
+
+      - name: Review dog languagetool
+        uses: reviewdog/action-languagetool@v1
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
           # Change reviewdog reporter if you need [github-pr-check,github-check,github-pr-review].
-          reporter: 'github-pr-review'
+          reporter: ${{ steps.reporter.outputs.name }}
           # Change reporter level if you need.
-          level: 'error'
+          level: 'warning'
           patterns: '**/*.md **/*.txt **/*.mdx'
-          #enabled_categories: 'STYLE,PLAIN_ENGLISH,WHITESPACE_RULE,EN_QUOTES,DASH_RULE,WORD_CONTAINS_UNDERSCORE,UPPERCASE_SENTENCE_START,ARROWS,COMMA_PARENTHESIS_WHITESPACE,UNLIKELY_OPENING_PUNCTUATION,SENTENCE_WHITESPACE,EN_UNPAIRED_BRACKETS,PHRASE_REPETITION,PUNCTUATION_PARAGRAPH_END'
+          # enabled_categories: "STYLE,PLAIN_ENGLISH,WHITESPACE_RULE,EN_QUOTES,DASH_RULE,WORD_CONTAINS_UNDERSCORE,UPPERCASE_SENTENCE_START,ARROWS,COMMA_PARENTHESIS_WHITESPACE,UNLIKELY_OPENING_PUNCTUATION,SENTENCE_WHITESPACE,EN_UNPAIRED_BRACKETS,PHRASE_REPETITION,PUNCTUATION_PARAGRAPH_END"
           disabled_categories: ''
           disabled_rules: ''

.github/workflows/typescript.yml

@@ -2,20 +2,38 @@ name: Typescript CI
 
 on:
   push:
+    branches:
+      - 'main'
     paths:
+      # ⬇ Keep paths in sync with `ci-documentation.yml`
       - '.github/**'
+      - '*'
+      - '!Cargo.toml'
+      # ⬆ Keep paths in sync with `ci-documentation.yml`
       - 'packages/**'
   pull_request:
     paths:
+      # ⬇ Keep paths in sync with `ci-documentation.yml`
       - '.github/**'
+      - '*'
+      - '!Cargo.toml'
+      # ⬆ Keep paths in sync with `ci-documentation.yml`
       - 'packages/**'
 
 jobs:
-  build-and-test:
-    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
+  build_and_test:
     name: Check build and test
     timeout-minutes: 15
-    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: true
+      matrix:
+        os:
+          - 'ubuntu-latest'
+          - 'macos-latest'
+          - 'windows-latest'
+
+    runs-on: ${{ matrix.os }}
 
     steps:
       - name: Checkout code
@@ -30,8 +48,7 @@ jobs:
       - name: Test project
         run: pnpm test
 
-  fmt-lint-and-types:
-    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
+  lint_and_fmt:
     name: Check format and lint
     runs-on: ubuntu-latest
     timeout-minutes: 15

.gitignore

@@ -8,6 +8,8 @@ dist/
 
 examples/*/pnpm-lock.yaml
 
+vite.config.ts.timestamp*
+
 ## Rust related ignores
 
 # Generated by Cargo
@@ -24,3 +26,6 @@ examples/*/pnpm-lock.yaml
 
 # MSVC Windows builds of rustc generate these, which store debugging information
 *.pdb
+
+# Files, generated by the code editors
+.vscode/

.prettierignore

@@ -0,0 +1,6 @@
+pnpm-lock.yaml
+
+dist
+.tuono
+
+packages/tuono-lazy-fn-vite-plugin/tests/sources/*

.prettierrc

@@ -1,4 +1,5 @@
 {
+  "$schema": "https://json.schemastore.org/prettierrc",
   "semi": false,
   "singleQuote": true,
   "trailingComma": "all"

CODEOWNERS

@@ -0,0 +1,9 @@
+*          @Valerioageno @marcalexiei
+
+# Rust
+/crates/    @Valerioageno
+/Cargo.toml @Valerioageno
+
+# Misc
+/.github/   @marcalexiei
+

CODE_OF_CONDUCT.md

@@ -17,23 +17,23 @@ diverse, inclusive, and healthy community.
 Examples of behavior that contributes to a positive environment for our
 community include:
 
-* Demonstrating empathy and kindness toward other people
-* Being respectful of differing opinions, viewpoints, and experiences
-* Giving and gracefully accepting constructive feedback
-* Accepting responsibility and apologizing to those affected by our mistakes,
+- Demonstrating empathy and kindness toward other people
+- Being respectful of differing opinions, viewpoints, and experiences
+- Giving and gracefully accepting constructive feedback
+- Accepting responsibility and apologizing to those affected by our mistakes,
   and learning from the experience
-* Focusing on what is best, not just for us as individuals, but for the
+- Focusing on what is best, not just for us as individuals, but for the
   overall community
 
 Examples of unacceptable behavior include:
 
-* The use of sexualized language or imagery, and sexual attention or
+- The use of sexualized language or imagery, and sexual attention or
   Advances of any kind
-* Trolling, insulting or derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or email
+- Trolling, insulting or derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or email
   address, without their explicit permission
-* Other conduct that could reasonably be considered inappropriate in a
+- Other conduct that could reasonably be considered inappropriate in a
   professional setting
 
 ## Enforcement Responsibilities
@@ -106,7 +106,7 @@ Violating these terms may lead to a permanent ban.
 ### 4. Permanent Ban
 
 **Community Impact**: Demonstrating a pattern of violation of community
-standards, including sustained inappropriate behavior,  harassment of an
+standards, including sustained inappropriate behavior, harassment of an
 individual, or aggression toward or disparagement of classes of individuals.
 
 **Consequence**: A permanent ban from any sort of public interaction within

CONTRIBUTING.md

@@ -1,21 +1,28 @@
-![](https://github.com/Valerioageno/tuono/actions/workflows/rust.yml/badge.svg)
-![](https://github.com/Valerioageno/tuono/actions/workflows/typescript.yml/badge.svg)
+![](https://github.com/tuono-labs/tuono/actions/workflows/rust.yml/badge.svg)
+![](https://github.com/tuono-labs/tuono/actions/workflows/typescript.yml/badge.svg)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 # How to Contribute to Tuono
 
-## Contributions 
+## Contributions
+
 Any feature contribution or suggestion is strongly appreciated.
-Since the current project size, there isn't yet a defined way to start a discussion. Consider [opening a new issue](https://github.com/Valerioageno/tuono/issues/new/choose)
-or to reach me using my email address, [valerioageno@yahoo.it](mailto:valerioageno@ahoo.it). I'm also available on Twitter (X); DM @valerioageno.
+
+We are currently managing the tasks' prioritization in the [Road to V1](https://github.com/orgs/tuono-labs/projects/2) project. You can pick any task that you see in the `ready` column that is not already assigned.
+
+If you want to contribute on something that is in the `backlog` column, or it hasn't been scoped yet, please drop a message in the [#general](https://discord.com/invite/khQzPa654B) discord channel so we can all have visibility of it.
+
+Consider [opening a new issue](https://github.com/tuono-labs/tuono/issues/new/choose) if you find a bug.
 
 ## Bugs
 
 **Did you find a bug?**
-- Ensure the bug was not already reported by searching on GitHub under [Issues](https://github.com/Valerioageno/tuono/issues).
-- If you're unable to find an open issue addressing the problem, [open a new one](https://github.com/Valerioageno/tuono/issues/new/choose). Be sure to include a title and clear description, as much relevant information as possible, and a code sample or an executable test case demonstrating the expected behavior that is not occurring.
+
+- Ensure the bug was not already reported by searching on GitHub under [Issues](https://github.com/tuono-labs/tuono/issues).
+- If you're unable to find an open issue addressing the problem, [open a new one](https://github.com/tuono-labs/tuono/issues/new/choose). Be sure to include a title and clear description, as much relevant information as possible, and a code sample or an executable test case demonstrating the expected behavior that is not occurring.
 
 **Did you write a patch that fixes a bug?**
+
 - Open a new GitHub pull request with the patch.
 - Ensure the PR description clearly describes the problem and solution. Include the relevant issue number, if applicable.
 - The pull requests must pass all the CI pipelines

Cargo.toml

@@ -7,8 +7,8 @@ members = [
 ]
 exclude = [
 		"apps/documentation",
-		"examples/mdx",
-		"examples/tuono",
-		"examples/tutorial",
+		"examples/with-mdx",
+		"examples/tuono-app",
+		"examples/tuono-tutorial",
 		"benches/tuono"
 ]

README.md

@@ -1,14 +1,15 @@
 [Documentation](https://tuono.dev) | [Tutorial](https://tuono.dev/documentation/tutorial) |
-[✨Contributing](https://tuono.dev/documentation/contributing)
+[Discord](https://discord.com/invite/khQzPa654B) | [✨Contributing](https://tuono.dev/documentation/contributing)
 
 # Tuono
 
-<img align="right" src="https://raw.githubusercontent.com/Valerioageno/tuono/main/assets/logo.png" width="160px">
+<img align="right" src="https://raw.githubusercontent.com/tuono-labs/tuono/main/assets/logo.png" width="160px">
 
-![](https://github.com/Valerioageno/tuono/actions/workflows/rust.yml/badge.svg)
-![](https://github.com/Valerioageno/tuono/actions/workflows/typescript.yml/badge.svg)
+![](https://github.com/tuono-labs/tuono/actions/workflows/rust.yml/badge.svg)
+![](https://github.com/tuono-labs/tuono/actions/workflows/typescript.yml/badge.svg)
 
-**Tuono is the fastest React framework out there**
+**Tuono is a full-stack web framework for building React applications using Rust as the backend with
+a strong focus on usability and performance.**
 
 Tuono (Italian word for "thunder", pronounced /2 Oh No/).
 Why Tuono? Just a badass name.
@@ -25,7 +26,7 @@ Some of its features are:
 
 ## 📖 Documentation
 
-The [documentation](https://tuono.dev/documentation) is available on
+The [documentation](https://tuono.dev/) is available on
 [tuono.dev](https://tuono.dev/).
 
 ## Introduction
@@ -47,13 +48,10 @@ by Tuono based on the files defined within the `./src/routes` directory.
 The Tuono API tries to stick as much as possible to the Next.js one (or at least takes a huge inspiration
 from it). The major difference is the backend system. While Next.js relies entirely on Node/Deno/Bun,
 Tuono runs the server without any intermediary runtime. This enables impressive performance improvements
-(check the benchmarks [here](https://github.com/Valerioageno/tuono/tree/main/benches)).
+(check the benchmarks [here](https://github.com/tuono-labs/tuono/tree/main/benches)).
 
 ## Getting started
 
-As already mentioned above, I strongly suggest you take a look at the
-[tutorial](https://tuono.dev/documentation/tutorial).
-
 Tuono is the CLI that provides all the needed commands to handle the full-stack project.
 To download it is required [cargo](https://doc.rust-lang.org/cargo/), which is the [rust](https://www.rust-lang.org/)
 package manager.
@@ -63,9 +61,9 @@ Then run `cargo install tuono`.
 To list all the available commands, run `tuono -h`
 
 To create a new project, run `tuono new [NAME]` (optionally, you can pass the `--template` (or `-t`) flag - check the
-[examples](https://github.com/Valerioageno/tuono/tree/main/examples) folder).
+[examples](https://github.com/tuono-labs/tuono/tree/main/examples) folder).
 
-Then, to run the local development environment, run it inside the project folder `tuono dev`
+Then, to run the local development environment, install the JS dependencies (`npm install`) and run inside the project folder `tuono dev`
 
 Finally, when the project is ready to be deployed, just run `tuono build` to create the final React assets
 and to set the server project in `production` mode.

apps/documentation/.eslintrc

@@ -1,106 +0,0 @@
-{
-  "root": true,
-  "reportUnusedDisableDirectives": true,
-  "ignorePatterns": ["**/build", "**/dist"],
-  "parser": "@typescript-eslint/parser",
-  "plugins": ["@typescript-eslint", "import"],
-  "extends": [
-    "eslint:recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:@typescript-eslint/stylistic",
-    "plugin:import/recommended",
-    "plugin:import/typescript",
-    "prettier",
-  ],
-  "env": {
-    "browser": true,
-    "es2020": true,
-  },
-  "parserOptions": {
-    "tsconfigRootDir": ".",
-    "project": true,
-    "sourceType": "module",
-    "ecmaVersion": 2020,
-  },
-  "settings": {
-    "import/parsers": {
-      "@typescript-eslint/parser": [".ts", ".tsx"],
-    },
-    "import/resolver": {
-      "typescript": true,
-    },
-    "react": {
-      "version": "detect",
-    },
-  },
-  "rules": {
-    "@typescript-eslint/array-type": "error",
-    "@typescript-eslint/no-wrapper-object-types": "error",
-    "@typescript-eslint/no-empty-object-type": "error",
-    "@typescript-eslint/no-unsafe-function-type": "error",
-    "@typescript-eslint/ban-ts-comment": "error",
-    "@typescript-eslint/consistent-type-definitions": "error",
-    "@typescript-eslint/consistent-type-imports": [
-      "error",
-      { "prefer": "type-imports" },
-    ],
-    "@typescript-eslint/explicit-module-boundary-types": "error",
-    "@typescript-eslint/method-signature-style": ["error", "property"],
-    "@typescript-eslint/naming-convention": [
-      "error",
-      {
-        "selector": "typeParameter",
-        "format": ["PascalCase"],
-        "leadingUnderscore": "forbid",
-        "trailingUnderscore": "forbid",
-        "custom": {
-          "regex": "^(T|T[A-Z][A-Za-z]+)$",
-          "match": true,
-        },
-      },
-    ],
-    "@typescript-eslint/no-deprecated": "error",
-    "@typescript-eslint/no-empty-function": "error",
-    "@typescript-eslint/no-empty-interface": "error",
-    "@typescript-eslint/no-explicit-any": "off",
-    "@typescript-eslint/no-non-null-assertion": "error",
-    "@typescript-eslint/no-unnecessary-condition": "error",
-    "@typescript-eslint/no-unnecessary-type-assertion": "error",
-    "@typescript-eslint/no-unused-vars": "error",
-    "@typescript-eslint/explicit-function-return-type": "error",
-    "@typescript-eslint/no-inferrable-types": [
-      "error",
-      { "ignoreParameters": true },
-    ],
-    "import/default": "error",
-    "import/export": "error",
-    "import/namespace": "error",
-    "import/newline-after-import": "error",
-    "import/no-cycle": "error",
-    "import/no-duplicates": "off",
-    "import/no-named-as-default-member": "error",
-    "import/no-unused-modules": "error",
-    "import/order": [
-      "off",
-      {
-        "groups": [
-          "builtin",
-          "external",
-          "internal",
-          "parent",
-          "sibling",
-          "index",
-          "object",
-          "type",
-        ],
-      },
-    ],
-    "no-case-declarations": "error",
-    "no-empty": "error",
-    "no-prototype-builtins": "error",
-    "no-redeclare": "error",
-    "no-shadow": "error",
-    "no-undef": "off",
-    "sort-imports": "off",
-  },
-}

apps/documentation/Cargo.toml

@@ -8,7 +8,7 @@ name = "tuono"
 path = ".tuono/main.rs"
 
 [dependencies]
-tuono_lib = "0.12.3"
+tuono_lib = "0.16.4"
 glob = "0.3.1"
 time = { version = "0.3", features = ["macros"] }
 serde = { version = "1.0.202", features = ["derive"] }

apps/documentation/package.json

@@ -3,29 +3,30 @@
   "description": "The react/rust fullstack framework documentation",
   "version": "0.0.1",
   "private": true,
+  "type": "module",
   "scripts": {
-    "lint": "eslint --ext .ts,.tsx ./src -c .eslintrc",
-    "format": "prettier -u --write --ignore-unknown './src/**/*'",
-    "format:check": "prettier --check --ignore-unknown './src/**/*'",
+    "lint": "eslint .",
+    "format": "prettier --write --ignore-unknown .",
+    "format:check": "prettier --check --ignore-unknown .",
     "types": "tsc --noEmit"
   },
   "dependencies": {
-    "@mantine/code-highlight": "^7.11.2",
-    "@mantine/core": "^7.11.2",
-    "@mantine/hooks": "^7.11.2",
-    "@mdx-js/react": "^3.0.1",
-    "@tabler/icons-react": "^3.11.0",
-    "clsx": "^2.1.1",
+    "@mantine/code-highlight": "7.14.2",
+    "@mantine/core": "7.14.2",
+    "@mantine/hooks": "7.14.2",
+    "@mdx-js/react": "3.1.0",
+    "@tabler/icons-react": "3.22.0",
+    "clsx": "2.1.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "tuono": "npm:tuono@0.12.3"
+    "tuono": "npm:tuono@0.16.4"
   },
   "devDependencies": {
-    "@types/mdx": "^2.0.13",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
-    "postcss": "^8.4.39",
-    "postcss-preset-mantine": "^1.17.0",
-    "postcss-simple-vars": "^7.0.1"
+    "@mdx-js/rollup": "3.1.0",
+    "@types/react": "18.3.13",
+    "@types/react-dom": "18.3.0",
+    "postcss": "8.4.49",
+    "postcss-preset-mantine": "1.17.0",
+    "postcss-simple-vars": "7.0.1"
   }
 }

apps/documentation/postcss.config.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   plugins: {
     'postcss-preset-mantine': {},
     'postcss-simple-vars': {

apps/documentation/public/polyfill-db.json

@@ -0,0 +1,18 @@
+{
+  "polyfills": [
+    {
+      "identifier": "HTMLElement",
+      "import": {
+        "package": "@lit-labs/ssr-dom-shim",
+        "name": "HTMLElement"
+      }
+    },
+    {
+      "identifier": "customElements",
+      "import": {
+        "package": "@lit-labs/ssr-dom-shim",
+        "name": "customElements"
+      }
+    }
+  ]
+}

apps/documentation/public/site.webmanifest

@@ -1 +1,19 @@
-{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

apps/documentation/src/components/breadcrumbs/breadcrumbs.tsx

@@ -9,7 +9,7 @@ interface Breadcrumb {
   label: string
 }
 interface BreadcrumbsProps {
-  breadcrumbs: Breadcrumb[]
+  breadcrumbs: Array<Breadcrumb>
 }
 
 export default function TuonoBreadcrumbs({
@@ -28,12 +28,6 @@ export default function TuonoBreadcrumbs({
                   "position": 1,
                   "name": "Tuono - The React/Rust fullstack framework",
                   "item": "https://tuono.dev"
-                },
-                {
-                  "@type": "ListItem",
-                  "position": 2,
-                  "name": "Tuono - Documentation",
-                  "item": "https://tuono.dev/documentation"
                 }${breadcrumbs.length > 0 ? ',' : ''}
                 ${breadcrumbs
                   .map((br, i) =>
@@ -54,13 +48,7 @@ export default function TuonoBreadcrumbs({
         mb="md"
         mt="md"
       >
-        <Button
-          href="/documentation"
-          component={Link}
-          variant="subtle"
-          radius="xl"
-          p={5}
-        >
+        <Button href="/" component={Link} variant="subtle" radius="xl" p={5}>
           <IconBolt />
         </Button>
         {breadcrumbs.map((br) => (

apps/documentation/src/components/edit-page/edit-page.tsx

@@ -4,7 +4,7 @@ import { IconEdit } from '@tabler/icons-react'
 import { useRouter } from 'tuono'
 
 const GITHUB_URL =
-  'https://github.com/Valerioageno/tuono/tree/main/apps/documentation/src/routes'
+  'https://github.com/tuono-labs/tuono/tree/main/apps/documentation/src/routes'
 
 export default function EditPage(): JSX.Element {
   const { pathname } = useRouter()

apps/documentation/src/components/mdx-provider/mdx-code/mdx-code.tsx

@@ -1,9 +1,8 @@
-import type { JSX } from 'react'
+import type { JSX, HTMLAttributes } from 'react'
 import { Code } from '@mantine/core'
-import type { HTMLAttributes } from 'react'
 
 export default function MdxCode(
   props: HTMLAttributes<HTMLPreElement>,
 ): JSX.Element {
-  return <Code {...props} style={{ fontSize: 14 }} />
+  return <Code {...props} style={{ fontSize: 'inherit' }} />
 }

apps/documentation/src/components/mdx-provider/mdx-pre/mdx-pre.tsx

@@ -1,10 +1,17 @@
 import type { JSX } from 'react'
 import { CodeHighlight } from '@mantine/code-highlight'
+
 import styles from './mdx-pre.module.css'
 
 interface PreProps {
-  children: any
+  children: {
+    props: {
+      children: string
+      className?: string
+    }
+  }
 }
+
 export default function MdxPre({ children }: PreProps): JSX.Element {
   return (
     <CodeHighlight

apps/documentation/src/components/mdx-provider/mdx-provider.tsx

@@ -1,8 +1,7 @@
-import type { JSX } from 'react'
+import type { JSX, ReactNode } from 'react'
 import { MDXProvider } from '@mdx-js/react'
 
 import MdxLink from './mdx-link'
-import type { ReactNode } from 'react'
 import MdxPre from './mdx-pre'
 import MdxQuote from './mdx-quote'
 import MdxCode from './mdx-code'

apps/documentation/src/components/mdx-provider/mdx-title/mdx-title.tsx

@@ -8,6 +8,7 @@ export default function MdxTitle(props: TitleProps): JSX.Element {
       data-order={props.order}
       mt={20}
       {...props}
+      // eslint-disable-next-line @typescript-eslint/no-base-to-string
       id={String(props.children ?? '')
         .toLowerCase()
         .replaceAll(' ', '-')}
@@ -15,6 +16,12 @@ export default function MdxTitle(props: TitleProps): JSX.Element {
   )
 }
 
-export const h =
-  (order: 1 | 2 | 3 | 4 | 5 | 6) =>
-  (props: TitleProps): JSX.Element => <MdxTitle order={order} {...props} />
+export const h = (
+  order: 1 | 2 | 3 | 4 | 5 | 6,
+): React.ElementType<TitleProps> => {
+  function render(props: TitleProps): JSX.Element {
+    return <MdxTitle order={order} {...props} />
+  }
+  render.displayName = 'H'
+  return render
+}

apps/documentation/src/components/navbar/actions.tsx

@@ -1,11 +1,6 @@
 import type { JSX } from 'react'
-import { Flex, Button, ActionIcon, Group } from '@mantine/core'
-import {
-  IconBrandGithub,
-  IconBook,
-  IconBrandDiscord,
-} from '@tabler/icons-react'
-import { Link } from 'tuono'
+import { Flex, ActionIcon, Group } from '@mantine/core'
+import { IconBrandGithub, IconBrandDiscord } from '@tabler/icons-react'
 
 import ThemeBtn from '../theme-btn'
 
@@ -13,21 +8,11 @@ export default function Actions(): JSX.Element {
   return (
     <Flex gap={8}>
       <Group gap={8}>
-        <Button
-          component={Link}
-          href="/documentation"
-          visibleFrom="sm"
-          size="compact-lg"
-          rightSection={<IconBook />}
-          autoContrast
-        >
-          Get started
-        </Button>
         <ActionIcon
           variant="default"
           size="lg"
           aria-label="Check the project on github"
-          href="https://github.com/Valerioageno/tuono"
+          href="https://github.com/tuono-labs/tuono"
           target="_blank"
           component="a"
         >
@@ -37,7 +22,7 @@ export default function Actions(): JSX.Element {
           variant="default"
           size="lg"
           aria-label="Join the Tuono's community on Discord!"
-          href="https://discord.gg/BUvWmmRARx"
+          href="https://discord.com/invite/khQzPa654B"
           target="_blank"
           component="a"
         >

apps/documentation/src/components/navbar/navbar.tsx

@@ -1,32 +1,31 @@
 import type { JSX } from 'react'
-import { AppShell, Burger, Button, Flex } from '@mantine/core'
-import { Link, useRouter } from 'tuono'
+import { AppShell, Box, Burger, Button, Flex } from '@mantine/core'
+import { Link } from 'tuono'
 
 import Actions from './actions'
 
 interface NavbarProps {
-  opened: boolean
   toggle: () => void
 }
 
-export default function Navbar({ opened, toggle }: NavbarProps): JSX.Element {
-  const { pathname } = useRouter()
+export default function Navbar({ toggle }: NavbarProps): JSX.Element {
   return (
     <AppShell.Header p="sm">
       <Flex justify="space-between">
-        <Button component={Link} href="/" variant="transparent" p={0} fz={28}>
+        <Button
+          component={Link}
+          href="/"
+          variant="transparent"
+          p={0}
+          fz={28}
+          hiddenFrom="sm"
+        >
           Tuono
         </Button>
+        <Box />
         <Flex align="center" gap={8}>
           <Actions />
-          {pathname.startsWith('/documentation') && (
-            <Burger
-              opened={opened}
-              onClick={toggle}
-              hiddenFrom="sm"
-              size="sm"
-            />
-          )}
+          <Burger onClick={toggle} hiddenFrom="sm" size="sm" />
         </Flex>
       </Flex>
     </AppShell.Header>

apps/documentation/src/components/sidebar/config.ts

@@ -0,0 +1,265 @@
+import type { ReactNode } from 'react'
+
+interface SidebarElementBase<T extends string> {
+  type: T
+}
+
+type SidebarDivider = SidebarElementBase<'divider'>
+
+interface SidebarLink extends SidebarElementBase<'element'> {
+  label: string
+  href: string
+  children?: Array<SidebarLink>
+  leftIcon?: ReactNode
+}
+
+interface SidebarTitle extends SidebarElementBase<'title'> {
+  label: string
+}
+
+type SidebarElement = SidebarDivider | SidebarLink | SidebarTitle
+
+export const sidebarElements: Array<SidebarElement> = [
+  {
+    type: 'element',
+    label: 'Home',
+    href: '/',
+  },
+  {
+    type: 'element',
+    label: 'Getting started',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'Installation',
+        href: '/documentation/installation',
+      },
+      {
+        type: 'element',
+        label: 'How is tuono different?',
+        href: '/documentation/how-is-tuono-different',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'Tutorial',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        href: '/documentation/tutorial',
+        label: 'Intro',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/development-setup',
+        label: 'Development setup',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/api-fetching',
+        label: 'API fetching',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/components',
+        label: 'Components',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/dynamic-routes',
+        label: 'Dynamic routes',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/error-handling',
+        label: 'Error handling',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/seo',
+        label: 'SEO and meta tags',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/redirections',
+        label: 'Redirections',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/production',
+        label: 'Production build',
+      },
+      {
+        type: 'element',
+        href: '/documentation/tutorial/conclusion',
+        label: 'Conclusion',
+      },
+    ],
+  },
+  { type: 'divider' },
+  { type: 'title', label: 'Overview' },
+  {
+    type: 'element',
+    label: 'Routing',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'Defining routes',
+        href: '/documentation/routing/defining-routes',
+      },
+      {
+        type: 'element',
+        label: 'Dynamic routes',
+        href: '/documentation/routing/dynamic-routes',
+      },
+      {
+        type: 'element',
+        label: 'Link and navigation',
+        href: '/documentation/routing/link-and-navigation',
+      },
+      {
+        type: 'element',
+        label: 'Pages',
+        href: '/documentation/routing/pages',
+      },
+      {
+        type: 'element',
+        label: 'Loading state',
+        href: '/documentation/routing/loading-state',
+      },
+      {
+        type: 'element',
+        label: 'Layouts',
+        href: '/documentation/routing/layouts',
+      },
+      {
+        type: 'element',
+        label: 'Redirecting',
+        href: '/documentation/routing/redirecting',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'Rendering',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'Server side rendering',
+        href: '/documentation/rendering/server-side-rendering',
+      },
+      {
+        type: 'element',
+        label: 'Static site rendering',
+        href: '/documentation/rendering/static-site-rendering',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'Styles',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'CSS modules',
+        href: '/documentation/styles/css-modules',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'Integrations',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'MDX',
+        href: '/documentation/integrations/mdx',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'Core concepts',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'Multithreading',
+        href: '/documentation/core-concepts/multithreading',
+      },
+    ],
+  },
+  { type: 'divider' },
+  { type: 'title', label: 'API reference' },
+  {
+    type: 'element',
+    label: 'Components',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'Head',
+        href: '/documentation/components/head',
+      },
+      {
+        type: 'element',
+        label: 'Link',
+        href: '/documentation/components/link',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'Hooks',
+    href: '#focus',
+    children: [
+      {
+        type: 'element',
+        label: 'useRouter',
+        href: '/documentation/hooks/use-router',
+      },
+    ],
+  },
+  {
+    type: 'element',
+    label: 'CLI',
+    href: '/documentation/cli',
+  },
+  {
+    type: 'element',
+    label: 'Application state',
+    href: '/documentation/application-state',
+  },
+  {
+    type: 'element',
+    label: 'tuono.config.ts',
+    href: '/documentation/configuration',
+  },
+
+  { type: 'divider' },
+  {
+    type: 'element',
+    label: 'Contributing',
+    href: '#focus',
+    leftIcon: '✨',
+    children: [
+      {
+        type: 'element',
+        label: 'Guildelines',
+        href: '/documentation/contributing',
+      },
+      {
+        type: 'element',
+        label: 'Local development',
+        href: '/documentation/contributing/local-development',
+      },
+    ],
+  },
+]

apps/documentation/src/components/sidebar/sidebar-link.module.css

@@ -1,6 +1,17 @@
 .link {
   border-radius: 8px;
   margin-top: 0.25rem;
-  line-height: 1.25rem;
+  line-height: 1rem;
   font-weight: 500;
+  transition: 0.3s;
+}
+
+.link span {
+  font-size: 14px !important;
+  color: var(--mantine-color-sidebar-gray);
+}
+
+.link:hover span,
+.active span {
+  color: var(--mantine-color-sidebar-text-hover);
 }

apps/documentation/src/components/sidebar/sidebar-link.tsx

@@ -1,6 +1,6 @@
 import type { JSX, ReactNode } from 'react'
-import { useState } from 'react'
 import { NavLink, type NavLinkProps } from '@mantine/core'
+import clsx from 'clsx'
 import { Link, useRouter } from 'tuono'
 import { IconChevronRight } from '@tabler/icons-react'
 
@@ -17,24 +17,19 @@ export default function SidebarLink(
   props: SidebarLinkProps & NavLinkProps,
 ): JSX.Element {
   const { pathname } = useRouter()
-  const [isOpen, setIsOpen] = useState<boolean>(!!props.defaultOpened)
+
+  const isActive = pathname === props.href
 
   const internalProps = {
-    active: pathname === props.href,
-    className: styles.link,
+    active: isActive,
+    className: clsx(styles.link, isActive && styles.active),
     rightSection: props.children && (
       <IconChevronRight
         size="1.2rem"
         stroke={1.5}
         className="mantine-rotate-rtl"
-        onClick={(e) => {
-          e.preventDefault()
-          e.stopPropagation()
-          setIsOpen((state) => !state)
-        }}
       />
     ),
-    opened: isOpen,
     autoContrast: true,
     ...props,
   }

apps/documentation/src/components/sidebar/sidebar.tsx

@@ -1,97 +1,111 @@
 import type { JSX } from 'react'
-import { AppShell } from '@mantine/core'
 
+import {
+  AppShell,
+  Badge,
+  Flex,
+  Divider,
+  Title,
+  Button,
+  ScrollArea,
+  Text,
+} from '@mantine/core'
+
+import { IconX } from '@tabler/icons-react'
+import { useMediaQuery } from '@mantine/hooks'
+
+import { sidebarElements } from './config'
 import SidebarLink from './sidebar-link'
 
-export default function Sidebar({ close }: { close: () => void }): JSX.Element {
+interface SidebarProps {
+  close: () => void
+}
+
+function SidebarHeader({ close }: SidebarProps): JSX.Element {
+  const isSm = useMediaQuery('(min-width: 48em)')
+  return (
+    <AppShell.Section>
+      <Flex mb={20} w="100%" justify="space-between">
+        <Flex
+          gap={10}
+          align="center"
+          w={isSm ? '100%' : 'auto'}
+          justify="center"
+        >
+          <Title order={3}>Tuono</Title>
+          <Badge mt={4} size="xs" variant="outline">
+            Docs
+          </Badge>
+        </Flex>
+        <Button onClick={close} hiddenFrom="sm" variant="transparent" p="0">
+          <IconX />
+        </Button>
+      </Flex>
+    </AppShell.Section>
+  )
+}
+
+function SidebarElements({ close }: SidebarProps): JSX.Element {
+  return (
+    <AppShell.Section component={ScrollArea}>
+      {sidebarElements.map((el, i) => {
+        if (el.type === 'divider') {
+          return <Divider key={`${el.type}-${i}`} my="md" mx={10} />
+        }
+
+        if (el.type === 'title') {
+          return (
+            <Text
+              key={`${el.type}-${i}`}
+              size="xs"
+              fw={700}
+              fz={12}
+              pl={12}
+              py={5}
+            >
+              {el.label}
+            </Text>
+          )
+        }
+
+        if (el.children?.length) {
+          return (
+            <SidebarLink
+              key={`${el.type}-${i}`}
+              href={el.href}
+              label={el.label}
+              leftSection={el.leftIcon}
+            >
+              {el.children.map((child, index) => (
+                <SidebarLink
+                  href={child.href}
+                  label={child.label}
+                  key={index}
+                  onClick={close}
+                />
+              ))}
+            </SidebarLink>
+          )
+        }
+
+        return (
+          <SidebarLink
+            key={`${el.type}-${i}`}
+            href={el.href}
+            label={el.label}
+            onClick={close}
+          />
+        )
+      })}
+    </AppShell.Section>
+  )
+}
+
+export default function Sidebar({ close }: SidebarProps): JSX.Element {
   return (
     <AppShell.Navbar p="md">
-      <SidebarLink
-        href="/documentation"
-        label="Getting started"
-        onClick={close}
-      />
-      <SidebarLink
-        href="/documentation/installation"
-        label="Installation"
-        onClick={close}
-      />
-      <SidebarLink
-        href="/documentation/tutorial"
-        label="Tutorial"
-        defaultOpened
-        onClick={close}
-      >
-        <SidebarLink
-          href="/documentation/tutorial/development-setup"
-          label="Development setup"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/api-fetching"
-          label="API fetching"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/components"
-          label="Components"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/dynamic-routes"
-          label="Dynamic routes"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/error-handling"
-          label="Error handling"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/seo"
-          label="SEO and meta tags"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/redirections"
-          label="Server redirection"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/production"
-          label="Production build"
-          onClick={close}
-        />
-        <SidebarLink
-          href="/documentation/tutorial/conclusion"
-          label="Conclusion"
-          onClick={close}
-        />
-      </SidebarLink>
-      <SidebarLink href="/documentation/cli" label="CLI" onClick={close} />
-      <SidebarLink
-        label="Application state"
-        href="/documentation/application-state"
-        onClick={close}
-      />
-
-      <SidebarLink
-        label="Routing"
-        href="/documentation/routing"
-        onClick={close}
-      >
-        <SidebarLink
-          href="/documentation/routing/intro"
-          label="Project structure"
-          onClick={close}
-        />
-      </SidebarLink>
-      <SidebarLink
-        label="Contributing"
-        href="/documentation/contributing"
-        onClick={close}
-        leftSection="✨"
-      />
+      <SidebarHeader close={close} />
+      <SidebarElements close={close} />
     </AppShell.Navbar>
   )
 }

apps/documentation/src/components/table-of-content/get-headings.ts

@@ -8,8 +8,8 @@ export interface Heading {
   getNode: () => HTMLHeadingElement
 }
 
-function getHeadingsData(headings: HTMLHeadingElement[]): Heading[] {
-  const result: Heading[] = []
+function getHeadingsData(headings: Array<HTMLHeadingElement>): Array<Heading> {
+  const result: Array<Heading> = []
 
   for (const heading of headings) {
     if (heading.id) {
@@ -26,7 +26,7 @@ function getHeadingsData(headings: HTMLHeadingElement[]): Heading[] {
   return result
 }
 
-export function getHeadings(): Heading[] {
+export function getHeadings(): Array<Heading> {
   const root = document.getElementById('mdx-root')
   console.log(root)
 

apps/documentation/src/components/table-of-content/table-of-content.tsx

@@ -6,6 +6,7 @@ import { useEffect, useRef, useState } from 'react'
 import { useRouter, Link } from 'tuono'
 import { IconList } from '@tabler/icons-react'
 import { Box, rem, ScrollArea, Text } from '@mantine/core'
+
 import { getHeadings, type Heading } from './get-headings'
 import classes from './table-of-content.module.css'
 
@@ -13,7 +14,7 @@ interface TableOfContentsProps {
   withTabs: boolean
 }
 
-function getActiveElement(rects: DOMRect[]): number {
+function getActiveElement(rects: Array<DOMRect>): number {
   if (rects.length === 0) {
     return -1
   }
@@ -39,8 +40,8 @@ export function TableOfContents({
   withTabs,
 }: TableOfContentsProps): JSX.Element | null {
   const [active, setActive] = useState(0)
-  const [headings, setHeadings] = useState<Heading[]>([])
-  const headingsRef = useRef<Heading[]>([])
+  const [headings, setHeadings] = useState<Array<Heading>>([])
+  const headingsRef = useRef<Array<Heading>>([])
   const router = useRouter()
 
   const filteredHeadings = headings.filter((heading) => heading.depth > 1)
@@ -63,7 +64,9 @@ export function TableOfContents({
       ),
     )
     window.addEventListener('scroll', handleScroll)
-    return (): void => window.removeEventListener('scroll', handleScroll)
+    return (): void => {
+      window.removeEventListener('scroll', handleScroll)
+    }
   }, [router.pathname])
 
   if (filteredHeadings.length === 0) {

apps/documentation/src/components/theme-btn/theme-btn.tsx

@@ -17,9 +17,9 @@ export default function ThemeBtn(): JSX.Element {
 
   return (
     <ActionIcon
-      onClick={() =>
+      onClick={() => {
         setColorScheme(computedColorScheme === 'light' ? 'dark' : 'light')
-      }
+      }}
       variant="default"
       size="lg"
       aria-label="Toggle color scheme"

apps/documentation/src/modules.d.ts

@@ -1,2 +1,5 @@
 // declaration.d.ts
-declare module '*.css'
+declare module '*.css' {
+  const CSSModule: Record<string, string>
+  export default CSSModule
+}

apps/documentation/src/routes/__root.tsx

@@ -1,19 +1,24 @@
 import type { ReactNode, JSX } from 'react'
+
 import {
   ColorSchemeScript,
   createTheme,
   MantineProvider,
   AppShell,
+  Container,
 } from '@mantine/core'
+import type { CSSVariablesResolver } from '@mantine/core'
 import { useDisclosure } from '@mantine/hooks'
-import { Head, useRouter } from 'tuono'
-import Navbar from '../components/navbar'
+import { Head } from 'tuono'
+
+import EditPage from '@/components/edit-page'
+import MdxProvider from '@/components/mdx-provider'
+import Navbar from '@/components/navbar'
+import Sidebar from '@/components/sidebar'
 
 import '@mantine/core/styles.css'
 import '@mantine/code-highlight/styles.css'
 
-import Sidebar from '../components/sidebar'
-
 interface RootRouteProps {
   children: ReactNode
 }
@@ -21,7 +26,7 @@ interface RootRouteProps {
 const theme = createTheme({
   primaryColor: 'violet',
   primaryShade: { light: 6, dark: 9 },
-  fontFamily: 'Roboto',
+  fontFamily: 'Inter',
   respectReducedMotion: true,
   radius: {
     xs: '8px',
@@ -56,13 +61,31 @@ const theme = createTheme({
       },
     },
   },
+  other: {
+    sidebarGrayLight: '#495057',
+    sidebarGrayDark: '#adb5bd',
+    sidebarTextHoverLight: '#212529',
+    sidebarTextHoverDark: '#f8f9fa',
+  },
+})
+
+const resolver: CSSVariablesResolver = (th) => ({
+  variables: {},
+  light: {
+    '--mantine-color-sidebar-gray': th.other.sidebarGrayLight as string,
+    '--mantine-color-sidebar-text-hover': th.other
+      .sidebarTextHoverLight as string,
+  },
+  dark: {
+    '--mantine-color-sidebar-gray': th.other.sidebarGrayDark as string,
+    '--mantine-color-sidebar-text-hover': th.other
+      .sidebarTextHoverDark as string,
+  },
 })
 
 export default function RootRoute({ children }: RootRouteProps): JSX.Element {
   const [opened, { toggle }] = useDisclosure()
 
-  const { pathname } = useRouter()
-
   return (
     <>
       <Head>
@@ -88,8 +111,9 @@ export default function RootRoute({ children }: RootRouteProps): JSX.Element {
         <link rel="manifest" href="/site.webmanifest" />
       </Head>
       <ColorSchemeScript />
-      <MantineProvider theme={theme}>
+      <MantineProvider theme={theme} cssVariablesResolver={resolver}>
         <AppShell
+          layout="alt"
           header={{ height: 60 }}
           navbar={{
             width: 300,
@@ -97,9 +121,14 @@ export default function RootRoute({ children }: RootRouteProps): JSX.Element {
             collapsed: { mobile: !opened },
           }}
         >
-          <Navbar opened={opened} toggle={toggle} />
-          {pathname.startsWith('/documentation') && <Sidebar close={toggle} />}
-          {children}
+          <Navbar toggle={toggle} />
+          <Sidebar close={toggle} />
+          <AppShell.Main>
+            <Container id="mdx-root" component="article" size="md" p={20}>
+              <MdxProvider>{children}</MdxProvider>
+              <EditPage />
+            </Container>
+          </AppShell.Main>
         </AppShell>
       </MantineProvider>
     </>

apps/documentation/src/routes/documentation/__root.tsx

@@ -1,20 +0,0 @@
-import type { ReactNode, JSX } from 'react'
-import { AppShell, Container } from '@mantine/core'
-
-import MdxProvider from '../../components/mdx-provider'
-import EditPage from '../../components/edit-page'
-
-interface RootRouteProps {
-  children: ReactNode
-}
-
-export default function RootRoute({ children }: RootRouteProps): JSX.Element {
-  return (
-    <AppShell.Main>
-      <Container id="mdx-root" component="article" size="md" p={20}>
-        <MdxProvider>{children}</MdxProvider>
-        <EditPage />
-      </Container>
-    </AppShell.Main>
-  )
-}

apps/documentation/src/routes/documentation/application-state.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Application state"
@@ -6,19 +6,19 @@ import MetaTags from '../../components/meta-tags'
   description="Learn how to add features to your Tuono application"
 />
 
-import Breadcrumbs, { Element } from '../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs breadcrumbs={[{ label: 'Application state' }]} />
 
 # Application state
 
-The main reason Tuono is fast it's because it loads just the features that are needed for the project.
+The main reason Tuono is fast is that it loads just the features that are needed for the project.
 
-To defined them you need to fill the `ApplicationState` struct in the `./src/main.rs` file and they will be automatically available
-in all the handlers you will define across the application.
+To define them, you need to fill the `ApplicationState` struct in the `./src/app.rs` file, and
+they will be automatically available in all the handlers you will define across the application.
 
 ```rs
-// src/main.rs
+// src/app.rs
 
 #[derive(Clone)]
 pub struct ApplicationState {

apps/documentation/src/routes/documentation/cli.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - CLI"
@@ -6,7 +6,7 @@ import MetaTags from '../../components/meta-tags'
   description="Tuono is the CLI that provides all the needed commands to handle the full-stack project."
 />
 
-import Breadcrumbs, { Element } from '../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs breadcrumbs={[{ label: 'CLI' }]} />
 

apps/documentation/src/routes/documentation/components/head.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Head"
+  canonical="https://tuono.dev/documentation/components/head"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Components' }]} />
+
+# Head
+
+TODO

apps/documentation/src/routes/documentation/components/link.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Link"
+  canonical="https://tuono.dev/documentation/components/link"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Components' }]} />
+
+# Link
+
+TODO

apps/documentation/src/routes/documentation/configuration.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - tuono.config.ts"
+  canonical="https://tuono.dev/documentation/configuration"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Configuration' }]} />
+
+# Configuration
+
+TODO

apps/documentation/src/routes/documentation/contributing.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Contributing"
@@ -6,7 +6,7 @@ import MetaTags from '../../components/meta-tags'
   description="The project is massive - if you like it, do consider contributing!"
 />
 
-import Breadcrumbs, { Element } from '../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs breadcrumbs={[{ label: '✨ Contributing' }]} />
 

apps/documentation/src/routes/documentation/contributing/index.mdx

@@ -0,0 +1,56 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Contributing"
+  canonical="https://tuono.dev/documentation/contributing"
+  description="The project is massive - if you like it, do consider contributing!"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: '✨ Contributing' }]} />
+
+# Contributing
+
+## TL;DR
+
+The project is massive - if you like it, do consider contributing!
+
+## Getting started
+
+The `tuono` project can mostly be split into the following subdomains:
+
+- The CLI
+- The Rust backend
+- The React frontend
+- The documentation website (which is written with tuono 🚀)
+
+To check what the knowledge requirements are for each domain, check the
+[requirements](#requirements) section below.
+
+We are currently managing the tasks' prioritization in the [Road to V1](https://github.com/orgs/tuono-labs/projects/2) project.
+You can pick any task that you see in the `ready` column that is not already assigned.
+
+If you want to contribute on something that is in the `backlog` column, or it hasn't been scoped yet, please drop a message in the [#general](https://discord.com/invite/khQzPa654B) discord channel so we can all have visibility of it.
+
+## Requirements
+
+It's not strictly required to know both React (& typescript) and Rust (even though it
+would be a great nice to have).
+
+Without taking into account specific cases, we can mostly split the domain requirements by:
+
+- The `CLI` needs Rust knowledge (even though a couple of scenarios might also need Typescript)
+- The Backend needs just `Rust`
+- The Frontend needs just `React` & `Typescript`
+- The documentation website needs just `React` & `Typescript` (or even less, since most of the
+  code is markdown).
+
+import NavigationButtons from '../../../components/navigation-buttons'
+
+<NavigationButtons
+  next={{
+    title: 'Local development',
+    href: '/documentation/contributing/local-development',
+  }}
+/>

apps/documentation/src/routes/documentation/contributing/local-development.mdx

@@ -0,0 +1,113 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Contributing - Local development"
+  canonical="https://tuono.dev/documentation/contributing/local-development"
+  description="Contribute to Tuono. Learn here how to setup the repository for local development"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs
+  breadcrumbs={[
+    { label: '✨ Contributing', href: '/documentation/contributing' },
+    { label: 'Local development' },
+  ]}
+/>
+
+# Local development
+
+Thanks for your interest! In this page, you find the instructions to set up `tuono` on your local environment!
+
+## Setup
+
+### Fork and clone repository
+
+After [forking the repo on GitHub](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/fork-a-repo):
+
+```sh
+git clone https://github.com/<your-name-here>/tuono
+cd tuono
+```
+
+### Rust tool chain
+
+Install the Rust programming language tool chain (`rust` and `cargo`).
+Follows instructions in the official [docs](https://rustup.rs/)
+
+### Node.js — runtime
+
+Install `Node.js`.
+You can follow the instructions from the [Node official site](https://nodejs.org/en/download/package-manager)
+
+> 💡 This project has a `.nvmrc` file to specify the node version used in development.
+>
+> Consider to use [nvm](https://github.com/nvm-sh/nvm) so you can run
+>
+> ```sh
+> nvm use
+> ```
+>
+> to simply pick up the correct version!
+
+### Node.js — package manager
+
+We use [`pnpm`](https://pnpm.io) as Node.js package manager.
+
+You can see which version of yarn we use by checking the `packageManager` field in the root `package.json`.
+
+### Pre-flight checks
+
+To check that everything is working properly, run:
+
+```sh
+turbo run check-all
+cargo build
+```
+
+## Tuono development
+
+1. Start tuono frontend build using
+
+   ```sh
+   turbo run dev
+   ```
+
+2. In another terminal run
+
+   ```sh
+   cargo build
+   ```
+
+   To automatically rebuild crates on code change, consider using `cargo-watch` crate
+
+   ```sh
+   cargo watch -x build -w crates/
+   ```
+
+3. You can now use the binary inside `/target/debug/tuono` in another folder on your local machine
+
+   > Consider adding an alias to your shell setup file
+   >
+   > ```sh
+   > alias t="/path-to-repo/target/debug/tuono"
+   > ```
+
+## Documentation development
+
+1. Change the current working directory to the documentation folder:
+
+   ```sh
+   cd apps/documentation
+   ```
+
+2. Run
+
+   ```sh
+   tuono dev
+   ```
+
+3. Open the localhost URL.
+
+> On the documentation remember that `tuono` `npm` package is installed from the registry and
+> it is not linked to the repository.

apps/documentation/src/routes/documentation/core-concepts/multithreading.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Multithreading"
+  canonical="https://tuono.dev/documentation/core-concepts/multithreading"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Core concepts' }]} />
+
+# Multithreading
+
+TODO

apps/documentation/src/routes/documentation/hooks/use-router.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - useRouter"
+  canonical="https://tuono.dev/documentation/hooks/use-router"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Hooks' }]} />
+
+# useRouter
+
+TODO

apps/documentation/src/routes/documentation/how-is-tuono-different.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - tuono.config.ts"
+  canonical="https://tuono.dev/documentation/how-is-tuono-different"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'How is tuono different?' }]} />
+
+# How is tuono different?
+
+TODO

apps/documentation/src/routes/documentation/installation.mdx

@@ -1,6 +1,6 @@
-import Breadcrumbs, { Element } from '../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
-import MetaTags from '../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Installation"

apps/documentation/src/routes/documentation/integrations/mdx.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - MDX"
+  canonical="https://tuono.dev/documentation/integrations/mdx"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Integrations' }]} />
+
+# MDX
+
+TODO

apps/documentation/src/routes/documentation/rendering/server-side-rendering.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Server side rendering"
+  canonical="https://tuono.dev/documentation/rendering/server-side-rendering"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Rendering' }]} />
+
+# SSR
+
+TODO

apps/documentation/src/routes/documentation/rendering/static-site-rendering.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Static site rendering"
+  canonical="https://tuono.dev/documentation/rendering/static-site-rendering"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Rendering' }]} />
+
+# Static Site Rendering
+
+TODO

apps/documentation/src/routes/documentation/routing/defining-routes.mdx

@@ -0,0 +1,101 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/defining-routes"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Defining routes' }]} />
+
+# Defining routes
+
+Tuono has a file-system based router built on the concept of routes.
+
+When a file is added to the `src/routes` directory, it's automatically available as a route.
+
+In Tuono, a page is a [React Component](https://react.dev/learn/your-first-component) exported from a `.tsx` file in the `src/routes` directory.
+Each page is associated with a route based on its file name.
+
+Every page is rendered server side by default.
+
+Example:
+If you create `src/routes/about.tsx` that exports a React component like:
+
+```
+export default function About() {
+  return <div>About</div>
+}
+```
+
+The `About` component will be rendered when loading `/about` route.
+
+## Index routes
+
+The router will automatically route files named `index` to the root of the directory.
+
+- `src/routes/index.tsx` → `/`
+- `src/routes/blog/index.tsx`→ `/blog`
+
+## Nested routes
+
+You can also create a nested folder structure, and files will still be routed in the same way.
+
+- `src/routes/blog/first-post.tsx` → `/blog/first-post`
+- `src/routes/dashboard/settings/username.tsx` → `/dashboard/settings/username`
+
+## Pages with Dynamic Routes
+
+Tuono supports pages with dynamic routes segments.
+For example, if you create a file called `src/routes/posts/[id].tsx`,
+then it will be accessible at `posts/1`, `posts/2`, etc.
+
+## The Root route (Layout components)
+
+Tuono allows you to have a layout component to wrap all the routes included within the same folder.
+To define such component you will have to create a `__root.tsx` file (is allowed only a single `__root` file per folder).
+
+This file won't generate any route.
+
+### Layout component for all routes
+
+A file created in this location will wrap all project route.
+
+```tsx
+// src/routes/__root.tsx
+export default function RootLayout({ children }) {
+  return <main>{children}</main>
+}
+```
+
+### Layout component for specific routes
+
+A file created in this location will wrap only the routes defined within the `src/routes/posts` folder.
+
+```tsx
+// src/routes/posts/__root.tsx
+export default function PostRootLayout({ children }) {
+  return <article>{children}</article>
+}
+```
+
+Referring to the two examples above consider that:
+
+- `/posts/examples-post` → will be wrapped by:
+
+```tsx
+<RootLayout>
+  <PostRootLayout>
+    <ExamplePost />
+  </PostRootLayout>
+</RootLayout>
+```
+
+- `/about` → will be wrapped by:
+
+```tsx
+<RootLayout>
+  <About />
+</RootLayout>
+```

apps/documentation/src/routes/documentation/routing/dynamic-routes.mdx

@@ -0,0 +1,61 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/dynamic-routes"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Dynamic routes' }]} />
+
+# Dynamic routes
+
+> 🚧 Only available for SSR apps. This feature will be soon available also for static generated apps.
+
+When the exact segment names are not known in advance and you need to generate routes from dynamic data,
+you can use dynamic segments, which are populated at request time.
+
+## Convention
+
+A dynamic segment can be created by wrapping a
+file or a folder name in square brackets: `[segmentName]`.
+
+The dynamic segment can be used in folders as well as file names:
+
+- `src/routes/blog/[slug].tsx`
+- `src/routes/blog/[slug]/index.tsx`
+
+A path can contain multiple dynamic segments, allowing for more flexible routing:
+
+- `src/routes/blog/[post]/[comment].tsx`
+
+### Example
+
+Assuming you're working on a blog with multiple posts,
+you can use a dynamic segment to define the post page: `src/routes/blog/[slug].tsx`.
+
+The `[slug]` is the dynamic segment which will be used to identify individual blog posts.
+
+```tsx
+import { useRouter } from 'tuono'
+
+export default function Page() {
+  const router = useRouter()
+  return <p>Post: {router.pathname}</p>
+}
+```
+
+## Catch all segments
+
+Dynamic Segments can be extended to catch-all subsequent segments by adding
+an ellipsis inside the brackets `[...segmentName]`.
+
+Given the following `src/routes/shop/[...slug].tsx`,
+the following paths will be matched:
+
+- `/shop/clothes`
+- `/shop/clothes/tops`
+- `/shop`
+- `/shop/clothes/tops/t-shirts`
+- and so on.

apps/documentation/src/routes/documentation/routing/index.mdx

@@ -1,11 +1,11 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Routing"
   canonical="https://tuono.dev/documentation/routing/intro"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs breadcrumbs={[{ label: 'Routing' }]} />
 

apps/documentation/src/routes/documentation/routing/intro.mdx

@@ -1,19 +0,0 @@
-import MetaTags from '../../../components/meta-tags'
-
-<MetaTags
-  title="Tuono - Routing"
-  canonical="https://tuono.dev/documentation/routing"
-/>
-
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
-
-<Breadcrumbs
-  breadcrumbs={[
-    { label: 'Routing', href: '/documentation/routing' },
-    { label: 'Project structure' },
-  ]}
-/>
-
-# Project structure
-
-Todo

apps/documentation/src/routes/documentation/routing/layouts.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/layouts"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Layouts' }]} />
+
+# Layouts
+
+Todo

apps/documentation/src/routes/documentation/routing/link-and-navigation.mdx

@@ -0,0 +1,75 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/link-and-navigation"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Link and navigation' }]} />
+
+# Link and navigation
+
+The Tuono router facilitates client-side route transitions between pages, enhancing the user experience by:
+
+- Enabling smooth navigation in single-page applications (SPAs)
+- Preventing page reloads during site navigation
+
+How? Using the `Link` component provided from Tuono exports:
+
+```tsx
+import { Link } from 'tuono'
+
+export default function HomePage() {
+  return (
+    <ul>
+      <li>
+        <Link href="/">Home</Link>
+      </li>
+      <li>
+        <Link href="/about">About Us</Link>
+      </li>
+      <li>
+        <Link href="/blog/hello-world">Blog Post</Link>
+      </li>
+    </ul>
+  )
+}
+```
+
+The example above uses multiple links. Each one maps a path (`href`) to a known route:
+
+- `/` → `src/routes/index.tsx`
+- `/about` → `src/routes/about.tsx`
+- `/blog/hello-world` → `src/routes/blog/[slug].tsx`
+
+> Additional considerations:
+>
+> - Any `<Link />` in the viewport is prefetched by default when it appears within the viewport.
+> - The corresponding data for server-rendered routes is fetched only when the `<Link />` is clicked.
+
+## The `useRouter` hook
+
+The Link component is not suitable for programmatic navigation.
+To handle this, the library provides the `useRouter` hook.
+
+For example, after a user submits a form and the API request succeeds, they can be redirected to another page.
+
+```tsx
+import { useRouter } from 'tuono'
+
+export default function GoToAboutPage() {
+  const router = useRouter()
+
+  return (
+    <ProfileForm
+      onUpdateSuccess={() => {
+        router.push('/profile')
+      }}
+    />
+  )
+}
+```
+
+> For more information about this hook visit the [dedicated API reference page](/documentation/hooks/use-router).

apps/documentation/src/routes/documentation/routing/loading-state.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/loading-state"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Loading state' }]} />
+
+# Loading state
+
+Todo

apps/documentation/src/routes/documentation/routing/pages.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/pages"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Pages' }]} />
+
+# Pages
+
+Todo

apps/documentation/src/routes/documentation/routing/redirecting.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - Routing"
+  canonical="https://tuono.dev/documentation/routing/redirecting"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Redirecting' }]} />
+
+# Redirecting
+
+Todo

apps/documentation/src/routes/documentation/styles/css-modules.mdx

@@ -0,0 +1,14 @@
+import MetaTags from '@/components/meta-tags'
+
+<MetaTags
+  title="Tuono - CSS Modules"
+  canonical="https://tuono.dev/documentation/styles/css-modules"
+/>
+
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
+
+<Breadcrumbs breadcrumbs={[{ label: 'Styles' }]} />
+
+# CSS Modules
+
+TODO

apps/documentation/src/routes/documentation/tutorial/api-fetching.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - API fetching"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="Learn how to fetch remote APIs on the backend"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[
@@ -68,9 +68,9 @@ Let's fix these in the next section.
 
 ## Application state
 
-Compared to the common Javascript runtimes Tuono is fast because only the features you need for your project will be loaded.
+Compared to the common Javascript runtimes, Tuono is fast because only the features you need for your project will be loaded.
 
-You can load them in the `ApplicationState` of your app inside the `./src/main.rs` file. This is the file that will be executed just once at the very beginning of your application.
+You can load them in the `ApplicationState` of your app inside the `./src/app.rs` file. This is the file that will be executed just once at the very beginning of your application.
 
 > For the tutorial we will use [Reqwest](https://docs.rs/reqwest/latest/reqwest/) which is one of the most famous HTTP library.
 
@@ -98,9 +98,10 @@ serde = { version = "1.0.202", features = ["derive"] }
 ++ reqwest = "0.12.9" # the version might be different
 ```
 
-> The `Cargo.toml` is the manifest file of your application in which handling the Rust's dependencies (similarly as the `package.json` for Javascript).
+> The `Cargo.toml` is the manifest file of your application, in which you handle Rust's dependencies
+> (similarly as the package.json for Javascript).
 
-Now let's define the `ApplicationState` in the `./src/main.rs` file.
+Now let's define the `ApplicationState` in the `./src/app.rs` file.
 
 ```rs
 // Import here the just added reqwest library
@@ -119,7 +120,7 @@ pub fn main() -> ApplicationState {
 }
 ```
 
-Now the `fetch: Client` argument is available in the above defined handler and the terminal should not complain anymore.
+Now the `fetch: Client` argument is available in the above defined handler, and the terminal should not complain anymore.
 Let's see in the next section how to show the fetched data on the browser.
 
 ## Handling the page UI

apps/documentation/src/routes/documentation/tutorial/components.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Components"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="Learn how to manage the components in a Tuono codebase"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[

apps/documentation/src/routes/documentation/tutorial/conclusion.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Conclusion"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="You just created a multi thread full stack application with Rust and React"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[

apps/documentation/src/routes/documentation/tutorial/development-setup.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Development setup"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="Learn how to setup a new Tuono project"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[

apps/documentation/src/routes/documentation/tutorial/dynamic-routes.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Dynamic routes"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="Learn how to catch more endpoint with the same route loading dynamic data"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[
@@ -32,7 +32,7 @@ Let’s first work on the server side file. Paste into the new `[pokemon].rs` fi
 ```rust
 // src/routes/pokemons/[pokemon].rs
 use serde::{Deserialize, Serialize};
-use tuono_lib::reqwest::Client;
+use reqwest::Client;
 use tuono_lib::{Props, Request, Response};
 
 const POKEMON_API: &str = "https://pokeapi.co/api/v2/pokemon";

apps/documentation/src/routes/documentation/tutorial/error-handling.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Error handling"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="Learn how to handle the server side error on your Tuono project"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[
@@ -27,8 +27,8 @@ Let's see how it works!
 ```diff
 // src/routes/pokemons/[pokemon].rs
 use serde::{Deserialize, Serialize};
--- use tuono_lib::reqwest::Client;
-++ use tuono_lib::reqwest::{Client, StatusCode};
+-- use reqwest::Client;
+++ use reqwest::{Client, StatusCode};
 use tuono_lib::{Props, Request, Response};
 
 const POKEMON_API: &str = "https://pokeapi.co/api/v2/pokemon";
@@ -69,8 +69,8 @@ async fn get_pokemon(req: Request, fetch: Client) -> Response {
 ```diff
 // src/routes/index.rs
 use serde::{Deserialize, Serialize};
--- use tuono_lib::reqwest::Client;
-++ use tuono_lib::reqwest::{Client, StatusCode};
+-- use reqwest::Client;
+++ use reqwest::{Client, StatusCode};
 use tuono_lib::{Props, Request, Response};
 
 const ALL_POKEMON: &str = "https://pokeapi.co/api/v2/pokemon?limit=151";

apps/documentation/src/routes/documentation/tutorial/index.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Tutorial"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="This tutorial is meant to give you a sneak peek at the framework and is intended to evolve during the development - be sure to have installed the latest version"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs breadcrumbs={[{ label: 'Tutorial' }]} />
 
@@ -21,7 +21,7 @@ This tutorial is not meant for people who don't know React - in that case, I sug
 If you prefer to just read the code rather than write you can download the finished tutorial project with:
 
 ```bash
-$ tuono new tutorial --template tutorial
+$ tuono new tutorial --template tuono-tutorial
 ```
 
 > I'd love to hear your thoughts about the framework and the tutorial - feel free to reach me at [valerioageno@yahoo.it](mailto:valerioageno@ahoo.it)

apps/documentation/src/routes/documentation/tutorial/production.mdx

@@ -1,4 +1,4 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Building for production"
@@ -6,7 +6,7 @@ import MetaTags from '../../../components/meta-tags'
   description="Learn how to build the production project and run the optimize version"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[

apps/documentation/src/routes/documentation/tutorial/redirections.mdx

@@ -1,12 +1,12 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Redirection"
-  canonical="https://tuono.dev/documentation/tutorial/redirection"
+  canonical="https://tuono.dev/documentation/tutorial/redirections"
   description="Learn how to redirect to different route from the server"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[

apps/documentation/src/routes/documentation/tutorial/seo.mdx

@@ -1,12 +1,12 @@
-import MetaTags from '../../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - SEO and meta tags"
-  canonical="https://tuono.dev/documentation/tutorial/eeo"
+  canonical="https://tuono.dev/documentation/tutorial/seo"
   description="Learn how to handle meaningful meta tags for your Tuono project"
 />
 
-import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
+import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs
   breadcrumbs={[

apps/documentation/src/routes/index.mdx

@@ -1,12 +1,12 @@
-import MetaTags from '../../components/meta-tags'
+import MetaTags from '@/components/meta-tags'
 
 <MetaTags
   title="Tuono - Documentation"
-  canonical="https://tuono.dev/documentation"
+  canonical="https://tuono.dev"
   description="Tuono is a full-stack framework for building React applications using Rust as the backend."
 />
 
-import Breadcrumbs from '../../components/breadcrumbs'
+import Breadcrumbs from '@/components/breadcrumbs'
 
 <Breadcrumbs />
 
@@ -36,7 +36,7 @@ Tuono addresses the following two limits:
 
 #### NodeJs/Deno/Bun are the only runtimes that allow a React app to be server-side rendered (SSR)? (no)
 
-Tuono is the first full-stack React framework with the server side written in Rust (check the [ssr-rs](https://github.com/Valerioageno/ssr-rs) crate).
+Tuono is the first full-stack React framework with the server side written in Rust (check the [ssr-rs](https://github.com/tuono-labs/ssr-rs) crate).
 Because of this, Tuono is extremely fast, and the requests are handled by a multithreaded Rust server.
 React is still React - it is just superpowered.
 
@@ -51,4 +51,4 @@ The routing is handled by Tuono based on the files defined within the `./src/rou
 The Tuono API tries to stick as much as possible to the Next.js one (or at least takes a huge inspiration
 from it). The major difference is the backend system. While Next.js relies entirely on Node/Deno/Bun,
 Tuono runs the server without any intermediary runtime. This enables impressive performance improvements
-(check the benchmarks [here](https://github.com/Valerioageno/tuono/tree/main/benches)).
+(check the benchmarks [here](https://github.com/tuono-labs/tuono/tree/main/benches)).

apps/documentation/src/routes/index.tsx

@@ -1,17 +0,0 @@
-import type { JSX } from 'react'
-
-import Hero from '../components/hero'
-import MetaTags from '../components/meta-tags'
-
-export default function IndexPage(): JSX.Element {
-  return (
-    <>
-      <MetaTags
-        title="Tuono - The React/Rust full-stack framework"
-        canonical="https://tuono.dev"
-        description="The technologies we love seamlessly working together to unleash the highest web performance ever met on React"
-      />
-      <Hero />
-    </>
-  )
-}

apps/documentation/src/routes/sitemap.xml.rs

@@ -1,8 +1,7 @@
-use tuono_lib::reqwest::StatusCode;
-use tuono_lib::{Request, Response};
-use tuono_lib::axum::http::{header, HeaderMap};
 use glob::glob;
 use time::OffsetDateTime;
+use tuono_lib::axum::http::{header, HeaderMap, StatusCode};
+use tuono_lib::{Request, Response};
 
 const FILE_TO_EXCLUDE: [&str; 2] = ["sitemap.xml", "__root"];
 
@@ -14,11 +13,17 @@ const SITEMAP: &str = r#"<?xml version="1.0" encoding="UTF-8"?>
 fn load_routes() -> Vec<String> {
     let mut paths: Vec<String> = vec![];
 
-    for entry in glob("./src/routes/**/*").expect("Failed to glob src/routes folder").flatten() {
+    for entry in glob("./src/routes/**/*")
+        .expect("Failed to glob src/routes folder")
+        .flatten()
+    {
         if !entry.is_dir() {
             let path = clean_path(format!("/{}", entry.to_string_lossy()));
 
-            if !FILE_TO_EXCLUDE.iter().any(|exclude|  path.ends_with(exclude)) {
+            if !FILE_TO_EXCLUDE
+                .iter()
+                .any(|exclude| path.ends_with(exclude))
+            {
                 paths.push(path)
             }
         }
@@ -51,11 +56,16 @@ async fn generate_sitemap(_req: Request) -> Response {
             url.pop();
         }
 
-        sitemaps.push_str(
-            &format!(r#"<url><loc>{}</loc><lastmod>{}</lastmod></url>"#,url, OffsetDateTime::now_utc().date())
-        )
+        sitemaps.push_str(&format!(
+            r#"<url><loc>{}</loc><lastmod>{}</lastmod></url>"#,
+            url,
+            OffsetDateTime::now_utc().date()
+        ))
     }
 
-    Response::Custom((StatusCode::OK, headers, SITEMAP.replace("[PLACEHOLDER]", &sitemaps)))
+    Response::Custom((
+        StatusCode::OK,
+        headers,
+        SITEMAP.replace("[PLACEHOLDER]", &sitemaps),
+    ))
 }
-

apps/documentation/src/styles/global.css

@@ -1 +1 @@
-@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

apps/documentation/tsconfig.json

@@ -1,25 +1,36 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": ["ES2021", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-
-    /* Linting */
+    // Typechecking
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true
+    "noFallthroughCasesInSwitch": true,
+
+    // Modules
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "paths": {
+      "@/*": ["./src/*"]
+    },
+
+    // Emit
+    "noEmit": true,
+
+    // JavaScript Support
+    "allowJs": true,
+
+    // Interop Constraints
+    "isolatedModules": true,
+
+    // Language and Environment
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2021", "DOM", "DOM.Iterable"],
+    "jsx": "react-jsx",
+
+    // Completeness
+    "skipLibCheck": true
   },
-  "include": ["src"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "include": ["src", "tuono.config.ts", "postcss.config.js"]
 }

apps/documentation/tsconfig.node.json

@@ -1,11 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "include": ["vite.config.ts"]
-}

apps/documentation/tuono.config.ts

@@ -0,0 +1,16 @@
+import type { TuonoConfig } from 'tuono/config'
+import mdx from '@mdx-js/rollup'
+
+const config: TuonoConfig = {
+  vite: {
+    alias: {
+      '@': 'src',
+      '@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
+    },
+    plugins: [
+      { enforce: 'pre', ...mdx({ providerImportSource: '@mdx-js/react' }) },
+    ],
+  },
+}
+
+export default config

crates/tuono/Cargo.toml

@@ -1,12 +1,12 @@
 [package]
 name = "tuono"
-version = "0.13.0"
+version = "0.16.9"
 edition = "2021"
 authors = ["V. Ageno <valerioageno@yahoo.it>"]
 description = "Superfast React fullstack framework"
 homepage = "https://tuono.dev"
 keywords = [ "react", "typescript", "fullstack", "web", "ssr"]
-repository = "https://github.com/Valerioageno/tuono"
+repository = "https://github.com/tuono-labs/tuono"
 readme = "../../README.md"
 license-file = "../../LICENSE.md"
 categories = ["web-programming"]
@@ -21,9 +21,9 @@ path = "src/lib.rs"
 
 [dependencies]
 clap = { version = "4.5.4", features = ["derive", "cargo"] }
-watchexec = "4.0.0"
+watchexec = "5.0.0"
 miette = "7.2.0"
-watchexec-signals = "3.0.0"
+watchexec-signals = "4.0.0"
 tokio = { version = "1", features = ["full"] }
 serde = { version = "1.0.202", features = ["derive"] }
 watchexec-supervisor = "3.0.0"
@@ -32,3 +32,9 @@ regex = "1.10.4"
 reqwest = {version = "0.12.4", features =["blocking", "json"]}
 serde_json = "1.0"
 fs_extra = "1.3.0"
+http = "1.1.0"
+
+[dev-dependencies]
+tempfile = "3.14.0"
+assert_cmd = "2.0.16"
+serial_test = "0.4.0"

crates/tuono/src/app.rs

@@ -1,5 +1,7 @@
 use glob::glob;
 use glob::GlobError;
+use http::Method;
+use std::collections::hash_set::HashSet;
 use std::collections::{hash_map::Entry, HashMap};
 use std::fs::File;
 use std::io::prelude::*;
@@ -14,15 +16,31 @@ use crate::route::Route;
 const IGNORE_EXTENSIONS: [&str; 3] = ["css", "scss", "sass"];
 const IGNORE_FILES: [&str; 1] = ["__root"];
 
+#[cfg(target_os = "windows")]
+const ROUTES_FOLDER_PATH: &str = "\\src\\routes";
+#[cfg(target_os = "windows")]
+const BUILD_JS_SCRIPT: &str = ".\\node_modules\\.bin\\tuono-build-prod.cmd";
+
+#[cfg(target_os = "windows")]
+const BUILD_TUONO_CONFIG: &str = ".\\node_modules\\.bin\\tuono-build-config.cmd";
+
+#[cfg(not(target_os = "windows"))]
+const ROUTES_FOLDER_PATH: &str = "/src/routes";
+#[cfg(not(target_os = "windows"))]
+const BUILD_JS_SCRIPT: &str = "./node_modules/.bin/tuono-build-prod";
+
+#[cfg(not(target_os = "windows"))]
+const BUILD_TUONO_CONFIG: &str = "./node_modules/.bin/tuono-build-config";
+
 #[derive(Debug)]
 pub struct App {
     pub route_map: HashMap<String, Route>,
     pub base_path: PathBuf,
-    pub has_main_file: bool,
+    pub has_app_state: bool,
 }
 
-fn has_main_file(base_path: PathBuf) -> std::io::Result<bool> {
-    let file = File::open(base_path.join("src/main.rs"))?;
+fn has_app_state(base_path: PathBuf) -> std::io::Result<bool> {
+    let file = File::open(base_path.join("src/app.rs"))?;
     let mut buf_reader = BufReader::new(file);
     let mut contents = String::new();
     buf_reader.read_to_string(&mut contents)?;
@@ -31,12 +49,12 @@ fn has_main_file(base_path: PathBuf) -> std::io::Result<bool> {
 
 impl App {
     pub fn new() -> Self {
-        let base_path = std::env::current_dir().unwrap();
+        let base_path = std::env::current_dir().expect("Failed to read current_dir");
 
         let mut app = App {
             route_map: HashMap::new(),
             base_path: base_path.clone(),
-            has_main_file: has_main_file(base_path).unwrap_or(false),
+            has_app_state: has_app_state(base_path).unwrap_or(false),
         };
 
         app.collect_routes();
@@ -45,18 +63,31 @@ impl App {
     }
 
     fn collect_routes(&mut self) {
-        glob(self.base_path.join("src/routes/**/*.*").to_str().unwrap())
-            .expect("Failed to read glob pattern")
-            .for_each(|entry| {
-                if self.should_collect_route(&entry) {
-                    self.collect_route(entry)
-                }
-            })
+        glob(
+            self.base_path
+                .join("src/routes/**/*.*")
+                .to_str()
+                .expect("Failed to glob routes folder"),
+        )
+        .expect("Failed to read glob pattern")
+        .for_each(|entry| {
+            if self.should_collect_route(&entry) {
+                self.collect_route(entry)
+            }
+        })
     }
 
     fn should_collect_route(&self, entry: &Result<PathBuf, GlobError>) -> bool {
-        let file_extension = entry.as_ref().unwrap().extension().unwrap();
-        let file_name = entry.as_ref().unwrap().file_stem().unwrap();
+        let file_extension = entry
+            .as_ref()
+            .unwrap()
+            .extension()
+            .expect("Failed to read file extension");
+        let file_name = entry
+            .as_ref()
+            .unwrap()
+            .file_stem()
+            .expect("Failed to read file name");
 
         if IGNORE_EXTENSIONS.iter().any(|val| val == &file_extension) {
             return false;
@@ -69,17 +100,23 @@ impl App {
     }
 
     fn collect_route(&mut self, path_buf: Result<PathBuf, GlobError>) {
-        let entry = path_buf.unwrap();
-        let base_path_str = self.base_path.to_str().unwrap();
+        let entry = path_buf.expect("Failed to read glob path");
+
+        let base_path_str = self
+            .base_path
+            .to_str()
+            .expect("Failed to read as str base_path");
         let path = entry
             .to_str()
-            .unwrap()
-            .replace(&format!("{base_path_str}/src/routes"), "")
+            .expect("Failed to read entry as str")
+            .replace(&format!("{base_path_str}{ROUTES_FOLDER_PATH}"), "")
+            // Cleanup windows paths
+            .replace("\\", "/")
             .replace(".rs", "")
             .replace(".mdx", "")
             .replace(".tsx", "");
 
-        if entry.extension().unwrap() == "rs" {
+        if entry.extension().expect("failed to read entry extension") == "rs" {
             if let Entry::Vacant(route_map) = self.route_map.entry(path.clone()) {
                 let mut route = Route::new(path);
                 route.update_axum_info();
@@ -101,7 +138,7 @@ impl App {
     }
 
     pub fn build_react_prod(&self) {
-        Command::new("./node_modules/.bin/tuono-build-prod")
+        Command::new(BUILD_JS_SCRIPT)
             .output()
             .expect("Failed to build the react source");
     }
@@ -115,6 +152,31 @@ impl App {
             .spawn()
             .expect("Failed to run the rust server")
     }
+
+    pub fn build_tuono_config(&self) -> Result<std::process::Output, std::io::Error> {
+        Command::new(BUILD_TUONO_CONFIG)
+            .stdin(Stdio::piped())
+            .stdout(Stdio::piped())
+            .stderr(Stdio::piped())
+            .output()
+    }
+    pub fn get_used_http_methods(&self) -> HashSet<Method> {
+        let mut acc = HashSet::new();
+
+        for (_, route) in self.route_map.clone().into_iter() {
+            if route.axum_info.is_some() {
+                acc.insert(Method::GET);
+            }
+            if !route.is_api() {
+                continue;
+            }
+            for method in route.api_data.unwrap().methods.into_iter() {
+                acc.insert(method);
+            }
+        }
+
+        acc
+    }
 }
 
 #[cfg(test)]
@@ -125,8 +187,27 @@ mod tests {
     #[test]
     fn should_collect_routes() {
         let mut app = App::new();
-        app.base_path = "/home/user/Documents/tuono".into();
+        #[cfg(target_os = "windows")]
+        let base_path = "\\home\\user\\Documents\\tuono";
 
+        #[cfg(not(target_os = "windows"))]
+        let base_path = "/home/user/Documents/tuono";
+
+        app.base_path = base_path.into();
+
+        #[cfg(target_os = "windows")]
+        let routes = [
+            "\\home\\user\\Documents\\tuono\\src\\routes\\about.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\index.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\index.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\[post].rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\handle-this.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\handle-this\\[post].rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\UPPERCASE.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\sitemap.xml.rs",
+        ];
+
+        #[cfg(not(target_os = "windows"))]
         let routes = [
             "/home/user/Documents/tuono/src/routes/about.rs",
             "/home/user/Documents/tuono/src/routes/index.rs",
@@ -173,8 +254,25 @@ mod tests {
     #[test]
     fn should_create_multi_level_axum_paths() {
         let mut app = App::new();
-        app.base_path = "/home/user/Documents/tuono".into();
 
+        #[cfg(target_os = "windows")]
+        let base_path = "\\home\\user\\Documents\\tuono";
+
+        #[cfg(not(target_os = "windows"))]
+        let base_path = "/home/user/Documents/tuono";
+
+        app.base_path = base_path.into();
+
+        #[cfg(target_os = "windows")]
+        let routes = [
+            "\\home\\user\\Documents\\tuono\\src\\routes\\about.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\index.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\index.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\any-post.rs",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\posts\\[post].rs",
+        ];
+
+        #[cfg(not(target_os = "windows"))]
         let routes = [
             "/home/user/Documents/tuono/src/routes/about.rs",
             "/home/user/Documents/tuono/src/routes/index.rs",
@@ -199,7 +297,7 @@ mod tests {
             assert_eq!(
                 app.route_map
                     .get(path)
-                    .unwrap()
+                    .expect("Failed to get route path")
                     .axum_info
                     .as_ref()
                     .unwrap()
@@ -251,8 +349,23 @@ mod tests {
     #[test]
     fn should_correctly_parse_routes_with_server_handler() {
         let mut app = App::new();
-        app.base_path = "/home/user/Documents/tuono".into();
 
+        #[cfg(target_os = "windows")]
+        let base_path = "\\home\\user\\Documents\\tuono";
+
+        #[cfg(not(target_os = "windows"))]
+        let base_path = "/home/user/Documents/tuono";
+
+        app.base_path = base_path.into();
+
+        #[cfg(target_os = "windows")]
+        let routes = [
+            "\\home\\user\\Documents\\tuono\\src\\routes\\about.rs",
+            "\\home\\user\\Documents/tuono\\src\\routes\\about.tsx",
+            "\\home\\user\\Documents\\tuono\\src\\routes\\index.tsx",
+        ];
+
+        #[cfg(not(target_os = "windows"))]
         let routes = [
             "/home/user/Documents/tuono/src/routes/about.rs",
             "/home/user/Documents/tuono/src/routes/about.tsx",
@@ -269,9 +382,19 @@ mod tests {
             .into_iter()
             .for_each(|(path, expected_has_server_handler)| {
                 if expected_has_server_handler {
-                    assert!(app.route_map.get(path).unwrap().axum_info.is_some())
+                    assert!(app
+                        .route_map
+                        .get(path)
+                        .expect("Failed to get route path")
+                        .axum_info
+                        .is_some())
                 } else {
-                    assert!(app.route_map.get(path).unwrap().axum_info.is_none())
+                    assert!(app
+                        .route_map
+                        .get(path)
+                        .expect("Failed to get route path")
+                        .axum_info
+                        .is_none())
                 }
             })
     }

crates/tuono/src/cli.rs

@@ -11,6 +11,9 @@ use crate::scaffold_project;
 use crate::source_builder::{bundle_axum_source, check_tuono_folder, create_client_entry_files};
 use crate::watch;
 
+const TUONO_PORT: u16 = 3000;
+const VITE_PORT: u16 = 3001;
+
 #[derive(Subcommand, Debug)]
 enum Actions {
     /// Start the development environment
@@ -20,6 +23,10 @@ enum Actions {
         #[arg(short, long = "static")]
         /// Statically generate the website HTML
         ssg: bool,
+
+        #[arg(short, long)]
+        /// Prevent to export the js assets
+        no_js_emit: bool,
     },
     /// Scaffold a new project
     New {
@@ -39,12 +46,38 @@ struct Args {
     action: Actions,
 }
 
-fn init_tuono_folder(mode: Mode) -> std::io::Result<()> {
+fn init_tuono_folder(mode: Mode) -> std::io::Result<App> {
     check_tuono_folder()?;
-    bundle_axum_source(mode)?;
+    let app = bundle_axum_source(mode)?;
     create_client_entry_files()?;
 
-    Ok(())
+    Ok(app)
+}
+
+fn check_ports(mode: Mode) {
+    let rust_listener = std::net::TcpListener::bind(format!("0.0.0.0:{TUONO_PORT}"));
+
+    if let Err(_e) = rust_listener {
+        eprintln!("Error: Failed to bind to port {}", TUONO_PORT);
+        eprintln!(
+            "Please ensure that port {} is not already in use by another process or application.",
+            TUONO_PORT
+        );
+        std::process::exit(1);
+    }
+
+    if mode == Mode::Dev {
+        let vite_listener = std::net::TcpListener::bind(format!("0.0.0.0:{VITE_PORT}"));
+
+        if let Err(_e) = vite_listener {
+            eprintln!("Error: Failed to bind to port {}", VITE_PORT);
+            eprintln!(
+                "Please ensure that port {} is not already in use by another process or application.",
+                VITE_PORT
+            );
+            std::process::exit(1);
+        }
+    }
 }
 
 pub fn app() -> std::io::Result<()> {
@@ -52,12 +85,21 @@ pub fn app() -> std::io::Result<()> {
 
     match args.action {
         Actions::Dev => {
-            init_tuono_folder(Mode::Dev)?;
+            check_ports(Mode::Dev);
+
+            let app = init_tuono_folder(Mode::Dev)?;
+            app.build_tuono_config()
+                .expect("Failed to build tuono.config.ts");
+
             watch::watch().unwrap();
         }
-        Actions::Build { ssg } => {
-            init_tuono_folder(Mode::Prod)?;
-            let app = App::new();
+        Actions::Build { ssg, no_js_emit } => {
+            let app = init_tuono_folder(Mode::Prod)?;
+
+            if no_js_emit {
+                println!("Rust build successfully finished");
+                return Ok(());
+            }
 
             if ssg && app.has_dynamic_routes() {
                 // TODO: allow dynamic routes static generation
@@ -65,9 +107,14 @@ pub fn app() -> std::io::Result<()> {
                 return Ok(());
             }
 
+            app.build_tuono_config()
+                .expect("Failed to build tuono.config.ts");
+
             app.build_react_prod();
 
             if ssg {
+                check_ports(Mode::Prod);
+
                 println!("SSG: generation started");
 
                 let static_dir = PathBuf::from("out/static");
@@ -86,6 +133,8 @@ pub fn app() -> std::io::Result<()> {
                 )
                 .expect("Failed to clone assets into static output folder");
 
+                // the process is killed below so we don't really need to use wait() function
+                #[allow(clippy::zombie_processes)]
                 let mut rust_server = app.run_rust_server();
 
                 let reqwest = reqwest::blocking::Client::builder()
@@ -97,7 +146,8 @@ pub fn app() -> std::io::Result<()> {
                 let mut is_server_ready = false;
 
                 while !is_server_ready {
-                    if reqwest.get("http://localhost:3000").send().is_ok() {
+                    let server_url = format!("http://localhost:{}", TUONO_PORT);
+                    if reqwest.get(server_url).send().is_ok() {
                         is_server_ready = true
                     }
                     // TODO: add maximum tries

crates/tuono/src/lib.rs

@@ -1,3 +1,8 @@
+//! ## Tuono
+//! Tuono is a full-stack web framework for building React applications using Rust as the backend with a strong focus on usability and performance.
+//!
+//! You can find the full documentation at [tuono.dev](https://tuono.dev/)
+
 mod app;
 pub mod cli;
 mod mode;

crates/tuono/src/route.rs

@@ -1,17 +1,19 @@
 use fs_extra::dir::create_all;
+use http::Method;
 use regex::Regex;
 use reqwest::blocking::Client;
 use reqwest::Url;
 use std::fs::File;
 use std::io;
 use std::path::PathBuf;
+use std::str::FromStr;
 
 fn has_dynamic_path(route: &str) -> bool {
     let regex = Regex::new(r"\[(.*?)\]").expect("Failed to create the regex");
     regex.is_match(route)
 }
 
-#[derive(Debug, PartialEq, Eq)]
+#[derive(Debug, PartialEq, Eq, Clone)]
 pub struct AxumInfo {
     // Path for importing the module
     pub module_import: String,
@@ -20,12 +22,12 @@ pub struct AxumInfo {
 }
 
 impl AxumInfo {
-    pub fn new(path: String) -> Self {
+    pub fn new(route: &Route) -> Self {
         // Remove first slash
-        let mut module = path.chars();
+        let mut module = route.path.chars();
         module.next();
 
-        let axum_route = path.replace("/index", "");
+        let axum_route = route.path.replace("/index", "");
 
         let module_import = module
             .as_str()
@@ -42,7 +44,7 @@ impl AxumInfo {
             };
         }
 
-        if has_dynamic_path(&path) {
+        if route.is_dynamic {
             return AxumInfo {
                 module_import: module
                     .as_str()
@@ -50,8 +52,12 @@ impl AxumInfo {
                     .replace('/', "_")
                     .replace('-', "_hyphen_")
                     .replace('[', "dyn_")
+                    .replace("...", "catch_all_")
+                    .replace(']', ""),
+                axum_route: axum_route
+                    .replace("[...", "*")
+                    .replace('[', ":")
                     .replace(']', ""),
-                axum_route: axum_route.replace('[', ":").replace(']', ""),
             };
         }
 
@@ -65,11 +71,56 @@ impl AxumInfo {
 // TODO: to be extended with common scenarios
 const NO_HTML_EXTENSIONS: [&str; 1] = ["xml"];
 
-#[derive(Debug, PartialEq, Eq)]
+// TODO: Refine this function to catch
+// if the methods are commented.
+fn read_http_methods_from_file(path: &String) -> Vec<Method> {
+    let regex = Regex::new(r"tuono_lib::api\((.*?)\)]").expect("Failed to create API regex");
+
+    let file = fs_extra::file::read_to_string(path).expect("Failed to read API file");
+
+    regex
+        .find_iter(&file)
+        .map(|proc_macro| {
+            let http_method = proc_macro
+                .as_str()
+                // Extract just the element surrounded by the phrantesist.
+                .replace("tuono_lib::api(", "")
+                .replace(")]", "");
+            Method::from_str(http_method.as_str()).unwrap_or(Method::GET)
+        })
+        .collect::<Vec<Method>>()
+}
+
+#[derive(Debug, PartialEq, Eq, Clone)]
+pub struct ApiData {
+    pub methods: Vec<Method>,
+}
+
+impl ApiData {
+    pub fn new(path: &String) -> Option<Self> {
+        if !path.starts_with("/api/") {
+            return None;
+        }
+
+        let base_path = std::env::current_dir().expect("Failed to get the base_path");
+
+        let file_path = base_path
+            .join(format!("src/routes{path}.rs"))
+            .to_str()
+            .unwrap()
+            .to_string();
+        let methods = read_http_methods_from_file(&file_path);
+
+        Some(ApiData { methods })
+    }
+}
+
+#[derive(Debug, PartialEq, Eq, Clone)]
 pub struct Route {
     path: String,
     pub is_dynamic: bool,
     pub axum_info: Option<AxumInfo>,
+    pub api_data: Option<ApiData>,
 }
 
 impl Route {
@@ -78,11 +129,16 @@ impl Route {
             path: cleaned_path.clone(),
             axum_info: None,
             is_dynamic: has_dynamic_path(&cleaned_path),
+            api_data: ApiData::new(&cleaned_path),
         }
     }
 
+    pub fn is_api(&self) -> bool {
+        self.api_data.is_some()
+    }
+
     pub fn update_axum_info(&mut self) {
-        self.axum_info = Some(AxumInfo::new(self.path.clone()))
+        self.axum_info = Some(AxumInfo::new(self))
     }
 
     pub fn save_ssg_file(&self, reqwest: &Client) {
@@ -107,8 +163,7 @@ impl Route {
 
         // Saving also the server response
         if self.axum_info.is_some() {
-            let data_file_path =
-                PathBuf::from(&format!("out/static/__tuono/data{}/data.json", path));
+            let data_file_path = PathBuf::from(&format!("out/static/__tuono/data{path}"));
 
             let data_parent_dir = data_file_path.parent().unwrap();
 
@@ -117,11 +172,11 @@ impl Route {
                     .expect("Failed to create data parent directories");
             }
 
-            let base = Url::parse("http://localhost:3000/__tuono/data/data.json").unwrap();
+            let base = Url::parse("http://localhost:3000/__tuono/data").unwrap();
 
             let path = if path == "/" { "" } else { path };
 
-            let pathname = &format!("/__tuono/data{path}/data.json");
+            let pathname = &format!("/__tuono/data{path}");
 
             let url = base
                 .join(pathname)
@@ -177,12 +232,12 @@ mod tests {
 
     #[test]
     fn should_correctly_create_the_axum_infos() {
-        let info = AxumInfo::new("/index".to_string());
+        let info = AxumInfo::new(&Route::new("/index".to_string()));
 
         assert_eq!(info.axum_route, "/");
         assert_eq!(info.module_import, "index");
 
-        let dyn_info = AxumInfo::new("/[posts]".to_string());
+        let dyn_info = AxumInfo::new(&Route::new("/[posts]".to_string()));
 
         assert_eq!(dyn_info.axum_route, "/:posts");
         assert_eq!(dyn_info.module_import, "dyn_posts");

crates/tuono/src/scaffold_project.rs

@@ -6,10 +6,12 @@ use std::fs::{self, create_dir, File, OpenOptions};
 use std::io::{self, prelude::*};
 use std::path::{Path, PathBuf};
 
-const GITHUB_TUONO_REPO_URL: &str =
-    "https://api.github.com/repos/Valerioageno/tuono/git/trees/main?recursive=1";
+const GITHUB_TUONO_TAGS_URL: &str = "https://api.github.com/repos/tuono-labs/tuono/git/ref/tags/";
 
-const GITHUB_RAW_CONTENT_URL: &str = "https://raw.githubusercontent.com/Valerioageno/tuono/main/";
+const GITHUB_TUONO_TAG_COMMIT_TREES_URL: &str =
+    "https://api.github.com/repos/tuono-labs/tuono/git/trees/";
+
+const GITHUB_RAW_CONTENT_URL: &str = "https://raw.githubusercontent.com/tuono-labs/tuono/main/";
 
 #[derive(Deserialize, Debug)]
 enum GithubFileType {
@@ -20,7 +22,17 @@ enum GithubFileType {
 }
 
 #[derive(Deserialize, Debug)]
-struct GithubResponse<T> {
+struct GithubTagObject {
+    sha: String,
+}
+
+#[derive(Deserialize, Debug)]
+struct GithubTagResponse {
+    object: GithubTagObject,
+}
+
+#[derive(Deserialize, Debug)]
+struct GithubTreeResponse<T> {
     tree: Vec<T>,
 }
 
@@ -42,32 +54,54 @@ pub fn create_new_project(folder_name: Option<String>, template: Option<String>)
     let folder = folder_name.unwrap_or(".".to_string());
 
     // In case of missing select the tuono example
-    let template = template.unwrap_or("tuono".to_string());
+    let template = template.unwrap_or("tuono-app".to_string());
 
     let client = blocking::Client::builder()
         .user_agent("")
         .build()
         .expect("Failed to build reqwest client");
 
-    let res = client
-        .get(GITHUB_TUONO_REPO_URL)
-        .send()
-        .expect("Failed to call the folder github API")
-        .json::<GithubResponse<GithubFile>>()
-        .expect("Failed to parse the repo structure");
+    let cli_version: &str = crate_version!();
 
-    let new_project_files = res
+    let res_tag = client
+        .get(format!("{}v{}", GITHUB_TUONO_TAGS_URL, cli_version))
+        .send()
+        .unwrap_or_else(|_| panic!("Failed to call the tag github API for v{cli_version}"))
+        .json::<GithubTagResponse>()
+        .expect("Failed to parse the tag response");
+
+    let sha_tagged_commit = res_tag.object.sha;
+
+    let res_tree = client
+        .get(format!(
+            "{}{}?recursive=1",
+            GITHUB_TUONO_TAG_COMMIT_TREES_URL, sha_tagged_commit
+        ))
+        .send()
+        .unwrap_or_else(|_| {
+            panic!("Failed to call the tagged commit tree github API for v{cli_version}")
+        })
+        .json::<GithubTreeResponse<GithubFile>>()
+        .expect("Failed to parse the tree structure");
+
+    let new_project_files = res_tree
         .tree
         .iter()
         .filter(|GithubFile { path, .. }| path.starts_with(&format!("examples/{template}/")))
         .collect::<Vec<&GithubFile>>();
 
     if new_project_files.is_empty() {
-        println!("Template not found: {template}");
-        return;
+        eprintln!("Error: Template '{template}' not found");
+        println!("Hint: you can view the available templates at https://github.com/tuono-labs/tuono/tree/main/examples");
+        std::process::exit(1);
     }
 
     if folder != "." {
+        if Path::new(&folder).exists() {
+            eprintln!("Error: Directory '{folder}' already exists");
+            println!("Hint: you can scaffold a tuono project within an existing folder with 'cd {folder} && tuono new .'");
+            std::process::exit(1);
+        }
         create_dir(&folder).unwrap();
     }
 

crates/tuono/src/source_builder.rs

@@ -82,13 +82,22 @@ fn create_routes_declaration(routes: &HashMap<String, Route>) -> String {
                 module_import,
             } = axum_info.as_ref().unwrap();
 
-            route_declarations.push_str(&format!(
-                r#".route("{axum_route}", get({module_import}::route))"#
-            ));
-            let slash = if axum_route.ends_with('/') { "" } else { "/" };
-            route_declarations.push_str(&format!(
-                r#".route("/__tuono/data{axum_route}{slash}data.json", get({module_import}::api))"#
-            ));
+            if !route.is_api() {
+                route_declarations.push_str(&format!(
+                    r#".route("{axum_route}", get({module_import}::tuono__internal__route))"#
+                ));
+
+                route_declarations.push_str(&format!(
+                    r#".route("/__tuono/data{axum_route}", get({module_import}::tuono__internal__api))"#
+                ));
+            } else {
+                for method in route.api_data.as_ref().unwrap().methods.clone() {
+                    let method = method.to_string().to_lowercase();
+                    route_declarations.push_str(&format!(
+                        r#".route("{axum_route}", {method}({module_import}::{method}__tuono_internal_api))"#
+                    ));
+                }
+            }
         }
     }
 
@@ -113,7 +122,7 @@ fn create_modules_declaration(routes: &HashMap<String, Route>) -> String {
     route_declarations
 }
 
-pub fn bundle_axum_source(mode: Mode) -> io::Result<()> {
+pub fn bundle_axum_source(mode: Mode) -> io::Result<App> {
     let base_path = std::env::current_dir().unwrap();
 
     let app = App::new();
@@ -122,7 +131,7 @@ pub fn bundle_axum_source(mode: Mode) -> io::Result<()> {
 
     create_main_file(&base_path, &bundled_file);
 
-    Ok(())
+    Ok(app)
 }
 
 fn generate_axum_source(app: &App, mode: Mode) -> String {
@@ -139,8 +148,8 @@ fn generate_axum_source(app: &App, mode: Mode) -> String {
         .replace("/*MODE*/", mode.as_str())
         .replace(
             "//MAIN_FILE_IMPORT//",
-            if app.has_main_file {
-                r#"#[path="../src/main.rs"]
+            if app.has_app_state {
+                r#"#[path="../src/app.rs"]
                     mod tuono_main_state;
                     "#
             } else {
@@ -149,7 +158,7 @@ fn generate_axum_source(app: &App, mode: Mode) -> String {
         )
         .replace(
             "//MAIN_FILE_DEFINITION//",
-            if app.has_main_file {
+            if app.has_app_state {
                 "let user_custom_state = tuono_main_state::main();"
             } else {
                 ""
@@ -157,27 +166,23 @@ fn generate_axum_source(app: &App, mode: Mode) -> String {
         )
         .replace(
             "//MAIN_FILE_USAGE//",
-            if app.has_main_file {
+            if app.has_app_state {
                 ".with_state(user_custom_state)"
             } else {
                 ""
             },
         );
 
-    let has_server_handlers = app
-        .route_map
-        .iter()
-        .filter(|(_, route)| route.axum_info.is_some())
-        .collect::<Vec<(&String, &Route)>>()
-        .is_empty();
+    let mut import_http_handler = String::new();
 
-    if !has_server_handlers {
-        return src.replace(
-            "// AXUM_GET_ROUTE_HANDLER",
-            "use tuono_lib::axum::routing::get;",
-        );
+    let used_http_methods = app.get_used_http_methods();
+
+    for method in used_http_methods.into_iter() {
+        let method = method.to_string().to_lowercase();
+        import_http_handler.push_str(&format!("use tuono_lib::axum::routing::{method};\n"))
     }
-    src
+
+    src.replace("// AXUM_GET_ROUTE_HANDLER", &import_http_handler)
 }
 
 pub fn check_tuono_folder() -> io::Result<()> {