Update npm init astro instructions to npm create astro@latest (#360)

* edit: change "npm init astro" -> "npm create astro@latest"

* add: pnpm and yarn instructions across create-astro docs

* fix: missing @latest flag in de

src/components/TabBox.astro

@@ -59,7 +59,7 @@ node --version
 mkdir my-astro-project && cd $_
 
 # prepare for liftoff...
-npm init astro
+npm create astro@latest
 
 # install dependencies
 npm install
@@ -101,4 +101,4 @@ document.getElementById("install-npm").addEventListener("click", () => {
     document.getElementById("install-npm").classList.remove("active");
     console.log("click");
   });
-  </script>
+  </script>

src/data/themes.json

@@ -6,7 +6,7 @@
       "github": "https://github.com/one-aalam/astro-ink",
       "demo": "https://astro-ink.vercel.app/",
       "sandbox": "https://github.dev/one-aalam/astro-ink",
-      "command": "npm init astro -- --template one-aalam/astro-ink"
+      "command": "npm create astro@latest -- --template one-aalam/astro-ink"
     }
   ],
   "official": [
@@ -16,47 +16,47 @@
       "github": "https://github.com/withastro/astro/tree/main/examples/starter",
       "demo": null,
       "sandbox": "https://github.dev/withastro/astro/tree/main/examples/starter",
-      "command": "npm init astro"
+      "command": "npm create astro@latest"
     },
     {
       "name": "Docs",
       "description": "A documentation website theme, complete with i18n, search, dark mode and more.",
       "github": "https://github.com/withastro/astro/tree/main/examples/docs",
       "demo": null,
       "sandbox": "https://github.dev/withastro/astro/tree/main/examples/docs",
-      "command": "npm init astro -- --template docs"
+      "command": "npm create astro@latest -- --template docs"
     },
     {
       "name": "Blog",
       "description": "A blog theme, perfect for personal and company blogs.",
       "github": "https://github.com/withastro/astro/tree/main/examples/blog",
       "demo": null,
       "sandbox": "https://github.dev/withastro/astro/tree/main/examples/blog",
-      "command": "npm init astro -- --template blog"
+      "command": "npm create astro@latest -- --template blog"
     },
     {
       "name": "Portfolio",
       "description": "A portfolio theme, perfect for your personal or professional online portfolio.",
       "github": "https://github.com/withastro/astro/tree/main/examples/portfolio",
       "demo": null,
       "sandbox": "https://github.dev/withastro/astro/tree/main/examples/portfolio",
-      "command": "npm init astro -- --template portfolio"
+      "command": "npm create astro@latest -- --template portfolio"
     },
     {
       "name": "Portfolio-svelte",
       "description": "A portfolio theme using Svelte components, perfect for your personal or professional online portfolio.",
       "github": "https://github.com/withastro/astro/tree/main/examples/portfolio-svelte",
       "demo": null,
       "sandbox": "https://github.dev/withastro/astro/tree/main/examples/portfolio-svelte",
-      "command": "npm init astro -- --template portfolio-svelte"
+      "command": "npm create astro@latest -- --template portfolio-svelte"
     },
     {
       "name": "Minimal",
       "description": "A minimal theme, with just the bare minimum needed to get started.",
       "github": "https://github.com/withastro/astro/tree/main/examples/minimal",
       "demo": null,
       "sandbox": "https://github.dev/withastro/astro/tree/main/examples/minimal",
-      "command": "npm init astro -- --template minimal"
+      "command": "npm create astro@latest -- --template minimal"
     }
   ],
   "community": [
@@ -66,15 +66,15 @@
       "github": "https://github.com/markteekman/accessible-astro-starter",
       "demo": "https://accessible-astro.markteekman.nl/",
       "sandbox": "https://github.dev/markteekman/accessible-astro-starter",
-      "command": "npm init astro -- --template markteekman/accessible-astro-starter"
+      "command": "npm create astro@latest -- --template markteekman/accessible-astro-starter"
     },
     {
       "name": "Astro Theme Creek",
       "description": "Creek is an open source blog theme for Astro SSG.",
       "github": "https://github.com/robertguss/Astro-Theme-Creek",
       "demo": "https://astro-theme-creek.netlify.app/",
       "sandbox": "https://github.dev/robertguss/Astro-Theme-Creek",
-      "command": "npm init astro -- --template robertguss/Astro-Theme-Creek"
+      "command": "npm create astro@latest -- --template robertguss/Astro-Theme-Creek"
     }
   ]
 }

src/pages/ar/getting-started.md

@@ -10,7 +10,7 @@ Astro هو باني موقع ثابت. تعرف أكثر حول ماهية Astro
 
 ## جرب Astro
 
-أبسط طريقة لتجرب Astro هي بتنفيذ أمر `npm init astro` في داخل مُجلد جديد على جهازك، وسيقوم Astro CLI بمُساعدتك على بدأ مشروع Astro جديد.
+أبسط طريقة لتجرب Astro هي بتنفيذ أمر `npm create astro@latest` في داخل مُجلد جديد على جهازك، وسيقوم Astro CLI بمُساعدتك على بدأ مشروع Astro جديد.
 
 لتباشر البدأ باستخدام Astro من خلال 5 خطوات سريعة وبسيطة، تفقد [دليل البدأ-بسرعة](quick-start).
 
@@ -21,15 +21,15 @@ Astro هو باني موقع ثابت. تعرف أكثر حول ماهية Astro
 أن كنت تفضل التعلم عن طريق الأمثلة، ألقي نظرةٍ على [مكتبة الأمثلة الشاملة](https://github.com/withastro/astro/tree/main/examples) المتواجدة على Github.
 
 بمقدورك الإطلاع على أي من هذه الأمثلة وتجربتها مُباشرةً على جهازك،
-فقط نفذ الأمر <code ltr="left">npm init astro</code> متبوعًا بـ
+فقط نفذ الأمر <code ltr="left">npm create astro@latest</code> متبوعًا بـ
 `--template`. الإشارة `--template` أيضًا تدعم الامثلة الخارجية التي يصنعها المجتمع
 
 ```bash
 # أمر تهيئة أحد القوالب الرسمية التي يوفرها استرو
-npm init astro -- --template [OFFICIAL_EXAMPLE_NAME]
+npm create astro@latest -- --template [OFFICIAL_EXAMPLE_NAME]
 # أمر تهيئة القوالب الخارجية التي يوفرها المُجتمع
-npm init astro -- --template [GITHUB_USER]/[REPO_NAME]
-npm init astro -- --template [GITHUB_USER]/[REPO_NAME]/path/to/example
+npm create astro@latest -- --template [GITHUB_USER]/[REPO_NAME]
+npm create astro@latest -- --template [GITHUB_USER]/[REPO_NAME]/path/to/example
 ```
 
 ### جربه على المُتصفح

src/pages/bg/getting-started.md

@@ -7,7 +7,7 @@ Astro е модерен builder за статични сайтове. Науче
 
 ## Пробвайте Astro
 
-Най-лесният начин да пробвате Astro е да изпълните `npm init astro` в нова локална директория. Нашият CLI Wizard ще Ви помогне да започнете нов Astro проект.
+Най-лесният начин да пробвате Astro е да изпълните `npm create astro@latest` в нова локална директория. Нашият CLI Wizard ще Ви помогне да започнете нов Astro проект.
 
 За да започнете с Astro в 5 бързи и лесни стъпки, посетете нашия [Гид за бърз старт](quick-start).
 

src/pages/bn/getting-started.md

@@ -7,7 +7,7 @@ Astro হচ্ছে একটি আধুনিক স্ট্যাটি
 
 ## Astro ব্যবহার করুন
 
-Astro ব্যবহার করার সবচেয়ে সহজ উপায় হচ্ছে আপনার কম্পিউটারের নতুন কোন ফোল্ডারে `npm init astro` রান করা। আমাদের সিএলআই উইজার্ড আপনাকে একটি নতুন Astro প্রোজেক্ট শুরু করতে সাহায্য করবে।
+Astro ব্যবহার করার সবচেয়ে সহজ উপায় হচ্ছে আপনার কম্পিউটারের নতুন কোন ফোল্ডারে `npm create astro@latest` রান করা। আমাদের সিএলআই উইজার্ড আপনাকে একটি নতুন Astro প্রোজেক্ট শুরু করতে সাহায্য করবে।
 
 মাত্র ৫টি সহজ ও ছোট ধাপে Astro নিয়ে কাজ করা শুরু করতে , আমাদের [কুইকস্টার্ট গাইডটি](quick-start) চেক করুন।
 

src/pages/da/getting-started.md

@@ -8,7 +8,7 @@ Astro er en moderne statisk side bygger. Lær hvad Astro handler om på [vores h
 
 ## Prøv Astro
 
-Den nemmeste måde at prøve Astro på er ved at køre `npm init astro` i en ny mappe på din maskine. Vores CLI-guide vil hjælpe dig med at starte et nyt Astro projekt.
+Den nemmeste måde at prøve Astro på er ved at køre `npm create astro@latest` i en ny mappe på din maskine. Vores CLI-guide vil hjælpe dig med at starte et nyt Astro projekt.
 
 Besøg vores [Hurtigstartsguide](/quick-start) for at komme i gang med Astro i 5 hurtige og nemme trin.
 
@@ -18,14 +18,18 @@ Alternativt kan du læse vores [Installationsguide](/installation) for en fuld g
 
 Hvis du foretrækker at lære Astro ved hjælp af eksempler, kan du tjekke vores [fulde bibliotek af eksempler](https://github.com/withastro/astro/tree/main/examples) på GitHub.
 
-Du kan tjekke alle disse eksempler på din lokale maskine ved at køre `npm init astro` med CLI-flaget `--template`. Flaget `--template` understøtter også tredjeparts-skabeloner lavet af fællesskabet.
+Du kan tjekke alle disse eksempler på din lokale maskine ved at køre `npm create astro@latest` med CLI-flaget `--template`. Flaget `--template` understøtter også tredjeparts-skabeloner lavet af fællesskabet.
 
 ```bash
 # Kør init-guiden og brug denne officielle skabelon
-npm init astro -- --template [OFFICIEL_EKSEMPEL_NAVN]
+npm create astro@latest -- --template [OFFICIEL_EKSEMPEL_NAVN]
+# yarn
+yarn create astro --template [OFFICIEL_EKSEMPEL_NAVN]
+# pnpm
+pnpm create astro -- --template [OFFICIEL_EKSEMPEL_NAVN]
 # Kør init-guiden og brug denne skabelon lavet af fællesskabet
-npm init astro -- --template [GITHUB_BRUGER]/[REPO_NAVN]
-npm init astro -- --template [GITHUB_BRUGER]/[REPO_NAVN]/sti/til/eksempel
+npm create astro@latest -- --template [GITHUB_BRUGER]/[REPO_NAVN]
+npm create astro@latest -- --template [GITHUB_BRUGER]/[REPO_NAVN]/sti/til/eksempel
 ```
 
 ### Online Legepladser

src/pages/de/core-concepts/project-structure.md

@@ -10,7 +10,7 @@ Astro verwendet eine dogmatische Verzeichnisstruktur für dein Projekt. Jedes As
 - `public/*` - Deine Nicht-Code-Assets (Schriften, Icons etc.)
 - `package.json` - Ein Projekt-Manifest
 
-Der einfachste Weg dein neues Projekt aufzusetzen, ist mittels `npm init astro`. Lies unsere [Installationsanleitung](/de/installation), um einen vollständigen Überblick darüber zu erhalten, wie ein Projekt automatisch (mit `npm init astro`) oder manuell aufgesetzt werden kann.
+Der einfachste Weg dein neues Projekt aufzusetzen, ist mittels `npm create astro@latest`. Lies unsere [Installationsanleitung](/de/installation), um einen vollständigen Überblick darüber zu erhalten, wie ein Projekt automatisch (mit `npm create astro@latest`) oder manuell aufgesetzt werden kann.
 
 ## Projektstruktur
 

src/pages/de/getting-started.md

@@ -10,7 +10,7 @@ Diese Seite dient als Übersicht für die Astro-Dokumentation und alle damit ver
 
 ## Astro ausprobieren
 
-Der einfachste Weg Astro auszuprobieren ist `npm init astro` in einem neuen Verzeichnis auf deinem Rechner auszuführen. Der CLI-Wizard wird dir helfen ein neues Astro-Projekt aufzusetzen.
+Der einfachste Weg Astro auszuprobieren ist `npm create astro@latest` in einem neuen Verzeichnis auf deinem Rechner auszuführen. Der CLI-Wizard wird dir helfen ein neues Astro-Projekt aufzusetzen.
 
 Um in fünf einfachen Schritten mit Astro loszulegen, lies [unsere Schnellstart-Anleitung](/de/quick-start).
 
@@ -20,14 +20,18 @@ Alternativ kannst du unsere [Installationsanleitung](/de/installation) lesen, um
 
 Falls du Astro lieber anhand von Beispielen kennenlernen möchtest, sieh dir unsere [vollständige Beispiel-Bibliothek](https://github.com/withastro/astro/tree/main/examples) auf GitHub an.
 
-Du kanst jedes dieser Beispiele lokal auf deinem Rechner ausprobieren, indem du `npm init astro` mit der CLI-Kennzeichnung `--template` im Terminal aufrufst. Die Kennzeichnung `--template` unterstützt auch externe Vorlagen und Vorlagen der Community.
+Du kanst jedes dieser Beispiele lokal auf deinem Rechner ausprobieren, indem du `npm create astro@latest` mit der CLI-Kennzeichnung `--template` im Terminal aufrufst. Die Kennzeichnung `--template` unterstützt auch externe Vorlagen und Vorlagen der Community.
 
 ```bash
 # Rufe den Wizard zur Initialisierung auf und verwende diese offizielle Vorlage
-npm init astro -- --template [OFFIZIELLES_BEISPIEL_NAME]
+npm create astro@latest -- --template [OFFIZIELLES_BEISPIEL_NAME]
+# yarn
+yarn create astro --template [OFFIZIELLES_BEISPIEL_NAME]
+# pnpm
+pnpm create astro -- --template [OFFIZIELLES_BEISPIEL_NAME]
 # Rufe den Wizard zur Initialisierung auf und verwende diese Community-Vorlage
-npm init astro -- --template [GITHUB_NAME]/[REPO_NAME]
-npm init astro -- --template [GITHUB_NAME]/[REPO_NAME]/pfad/zur/vorlage
+npm create astro@latest -- --template [GITHUB_NAME]/[REPO_NAME]
+npm create astro@latest -- --template [GITHUB_NAME]/[REPO_NAME]/pfad/zur/vorlage
 ```
 
 ### Online-Playgrounds

src/pages/de/installation.md

@@ -16,17 +16,17 @@ Zu Demonstrationszwecken verwenden wir in den folgenden Beispielen [`npm`](https
 
 ## Astro-Projekt erzeugen
 
-`npm init astro` ist der einfachste Weg in einem neuen Projekt Astro zu installieren. Führe diesen Befehl in deinem Terminal aus, um unseren `create-astro`-Installationsassistenten zu starten, der dich bei der Einrichtung eines neuen Projekts unterstützt.
+`npm create astro@latest` ist der einfachste Weg in einem neuen Projekt Astro zu installieren. Führe diesen Befehl in deinem Terminal aus, um unseren `create-astro`-Installationsassistenten zu starten, der dich bei der Einrichtung eines neuen Projekts unterstützt.
 
 ```shell
-# Mit NPM
-npm init astro
+# Mit npm
+npm create astro@latest
 
-# Yarn
+# yarn
 yarn create astro
 
-# Pnpm
-pnpm create astro
+# pnpm
+pnpm create astro@latest
 ```
 
 Der [`create-astro`](https://github.com/withastro/astro/tree/main/packages/create-astro)-Assistent lässt dich aus einer Reihe von [Start-Vorlagen](https://github.com/withastro/astro/tree/main/examples) auswählen. Alternativ könntest du auch dein eigenes Astro-Projekt direkt aus GitHub heraus importieren.
@@ -35,17 +35,17 @@ Der [`create-astro`](https://github.com/withastro/astro/tree/main/packages/creat
 # Hinweis: Ersetze "mein-astro-projekt" durch den Namen deines Projekts.
 
 # npm 6.x
-npm init astro mein-astro-projekt --template starter
+npm create astro@latest mein-astro-projekt --template starter
 # npm 7+ (zusätzliche Bindestriche sind erforderlich)
-npm init astro mein-astro-projekt -- --template starter
+npm create astro@latest mein-astro-projekt -- --template starter
 # yarn
 yarn create astro mein-astro-projekt --template starter
 # pnpm
 pnpm create astro mein-astro-projekt -- --template starter
 # Verwenden einer Drittanbietervorlage
-npm init astro mein-astro-projekt -- --template [GITHUB_NAME]/[REPO_NAME]
+npm create astro@latest mein-astro-projekt -- --template [GITHUB_NAME]/[REPO_NAME]
 # Verwenden einer Drittanbietervorlage innerhalb eines Repos
-npm init astro mein-astro-projekt -- --template [GITHUB_NAME]/[REPO_NAME]/pfad/zur/vorlage
+npm create astro@latest mein-astro-projekt -- --template [GITHUB_NAME]/[REPO_NAME]/pfad/zur/vorlage
 ```
 
 Nachdem `create-astro` dein Projekt eingerichtet hat, denke daran die Abhängigkeiten deines Projekts mittels npm oder dem Paketmanager deiner Wahl zu installieren. In diesem Beispiel verwenden wir npm:
@@ -87,7 +87,7 @@ Soweit du den obigen Anweisungen gefolgt bist, solltest du ein Verzeichnis mit e
 npm install astro
 ```
 
-Jetzt kannst du den Platzhalter im Abschnitt "scripts" deiner `package.json`-Datei, die `npm init` für dich erstellt hat, durch Folgendes ersetzen:
+Jetzt kannst du den Platzhalter im Abschnitt "scripts" deiner `package.json`-Datei, die `npm create@latest` für dich erstellt hat, durch Folgendes ersetzen:
 
 ```diff
   "scripts": {

src/pages/de/quick-start.md

@@ -12,7 +12,7 @@ node --version
 mkdir mein-astro-projekt && cd $_
 
 # Bereite dich auf den Start vor
-npm init astro
+npm create astro@latest
 
 # Installiere benötigte Pakete
 npm install
@@ -31,7 +31,7 @@ npm run build
 Um mehr über den Installationsprozess und den ersten Einsatz von Astro zu lernen [lies unsere Installationsanleitung](/de/installation).
 
 Wenn du es bevorzugst anhand eines Beispiels zu lernen, werfe einen Blick auf die [komplette Liste der Beispiele](https://github.com/withastro/astro/tree/main/examples) auf GitHub.  
-Du kannst jedes dieser Beispiele ausprobieren, indem du `npm init astro -- --template "BEISPIEL_NAME"` ausführst.
+Du kannst jedes dieser Beispiele ausprobieren, indem du `npm create astro@latest -- --template "BEISPIEL_NAME"` ausführst.
 
 ## Starte dein Projekt
 

src/pages/en/getting-started.md

@@ -30,8 +30,17 @@ Ready to install?
 Get a new project up and running locally in no time with our easy `create-astro` CLI wizard!
 
 ```bash
-# run this command in a new directory to get started!
-npm init astro
+# make a new project directory and jump into it
+mkdir my-astro-project && cd $_
+
+# create a new project with npm
+npm create astro@latest
+
+# or yarn
+yarn create astro
+
+# or pnpm
+pnpm create astro@latest
 ```
 
 ⚙️ Our [Installation Guide](/en/install/auto) has full, step-by-step instructions for installing Astro with your favourite package manager.

src/pages/en/guides/deploy.md

@@ -433,19 +433,19 @@ If you don't have an existing Astro site, you can create one by running:
 
 ```bash
 # Make a new project directory, and navigate directly into it
-$ mkdir my-astro-project && cd $_
+mkdir my-astro-project && cd $_
 
 # prepare for liftoff...
-$ npm init astro
+npm create astro@latest
 
 # install dependencies
-$ npm install
+npm install
 
 # start developing!
-$ npm run dev
+npm run dev
 
 # when you're ready: build your static site to `dist/`
-$ npm run build
+npm run build
 ```
 
 ### Add Layer0

src/pages/en/guides/publish-to-npm.md

@@ -18,7 +18,11 @@ To get started developing your component quickly, we have a template already set
 
 ```bash
 # Initialize the Astro Component template in a new directory
-npm init astro my-new-component-directory -- --template component
+npm create astro@latest my-new-component-directory -- --template component
+# yarn
+yarn create astro my-new-component-directory --template component
+# pnpm
+npm create astro@latest my-new-component-directory -- --template component
 ```
 
 ## Creating a package
@@ -58,7 +62,11 @@ This is configured in the project root’s `package.json` file.
 In this example, multiple packages can be developed together from the `packages` directory. These packages can also be referenced from `demo`, where you can install a working copy of Astro.
 
 ```shell
-npm init astro demo --template minimal
+npm create astro@latest demo -- --template minimal
+# yarn
+yarn create astro my-new-component-directory --template minimal
+# pnpm
+pnpm create astro@latest my-new-component-directory -- --template minimal
 ```
 
 There are two initial files that will make up your individual package: `package.json` and `index.js`.

src/pages/en/install/auto.md

@@ -11,8 +11,14 @@ layout: ~/layouts/InstallLayout.astro
 Run the following command in your terminal to start our handy install wizard, `create-astro`. This will walk you through creating your very first Astro project in whichever directory you run it in.
 
 ```shell
-# Run the create-astro wizard right from npm:
-npm init astro
+# npm
+npm create astro@latest
+
+# yarn
+yarn create astro
+
+# pnpm
+pnpm create astro@latest
 ```
 
 If `create-astro` starts successfully, you will see a short list of starter templates to choose from: