From b41ca210fea99dde92293e0dc77ced5d5d22948e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Miroslav=20Jona=C5=A1?= Date: Tue, 4 Jul 2023 15:17:49 +0200 Subject: [PATCH] docs(nx-dev): nest 5 minute tutorials under getting started (#17897) --- docs/generated/manifests/menus.json | 71 +++++++++++--- docs/generated/manifests/nx.json | 95 +++++++++++++++---- docs/map.json | 60 ++++++------ .../concepts/integrated-vs-package-based.md | 8 +- docs/shared/core-tutorial/01-create-blog.md | 2 +- docs/shared/getting-started/intro.md | 20 ++-- docs/shared/guides/nx-and-angular-cli.md | 2 +- docs/shared/migration/adding-to-monorepo.md | 4 +- docs/shared/npm-tutorial/integrated.md | 2 +- docs/shared/reference/sitemap.md | 12 +-- nx-dev/data-access-menu/src/lib/menu.utils.ts | 1 - nx-dev/nx-dev/redirect-rules.js | 49 ++++++---- nx-dev/nx-dev/redirect-rules.spec.js | 2 +- nx-dev/ui-common/src/lib/sidebar.tsx | 34 ++++--- 14 files changed, 245 insertions(+), 117 deletions(-) diff --git a/docs/generated/manifests/menus.json b/docs/generated/manifests/menus.json index 469a9a7b55..d67360be6c 100644 --- a/docs/generated/manifests/menus.json +++ b/docs/generated/manifests/menus.json @@ -31,6 +31,55 @@ "isExternal": false, "children": [], "disableCollapsible": false + }, + { + "name": "5 min Tutorials", + "path": "/getting-started/tutorials", + "id": "tutorials", + "isExternal": false, + "children": [ + { + "name": "Package-Based Monorepo", + "path": "/getting-started/tutorials/package-based-repo-tutorial", + "id": "package-based-repo-tutorial", + "isExternal": false, + "children": [], + "disableCollapsible": false + }, + { + "name": "Integrated Monorepo", + "path": "/getting-started/tutorials/integrated-repo-tutorial", + "id": "integrated-repo-tutorial", + "isExternal": false, + "children": [], + "disableCollapsible": false + }, + { + "name": "React Standalone", + "path": "/getting-started/tutorials/react-standalone-tutorial", + "id": "react-standalone-tutorial", + "isExternal": false, + "children": [], + "disableCollapsible": false + }, + { + "name": "Angular Standalone", + "path": "/getting-started/tutorials/angular-standalone-tutorial", + "id": "angular-standalone-tutorial", + "isExternal": false, + "children": [], + "disableCollapsible": false + }, + { + "name": "Node Standalone", + "path": "/getting-started/tutorials/node-server-tutorial", + "id": "node-server-tutorial", + "isExternal": false, + "children": [], + "disableCollapsible": false + } + ], + "disableCollapsible": false } ], "disableCollapsible": false @@ -61,13 +110,13 @@ }, { "name": "5 min Tutorials", - "path": "/tutorials", + "path": "/getting-started/tutorials", "id": "tutorials", "isExternal": false, "children": [ { "name": "Package-Based Monorepo", - "path": "/tutorials/package-based-repo-tutorial", + "path": "/getting-started/tutorials/package-based-repo-tutorial", "id": "package-based-repo-tutorial", "isExternal": false, "children": [], @@ -75,7 +124,7 @@ }, { "name": "Integrated Monorepo", - "path": "/tutorials/integrated-repo-tutorial", + "path": "/getting-started/tutorials/integrated-repo-tutorial", "id": "integrated-repo-tutorial", "isExternal": false, "children": [], @@ -83,7 +132,7 @@ }, { "name": "React Standalone", - "path": "/tutorials/react-standalone-tutorial", + "path": "/getting-started/tutorials/react-standalone-tutorial", "id": "react-standalone-tutorial", "isExternal": false, "children": [], @@ -91,7 +140,7 @@ }, { "name": "Angular Standalone", - "path": "/tutorials/angular-standalone-tutorial", + "path": "/getting-started/tutorials/angular-standalone-tutorial", "id": "angular-standalone-tutorial", "isExternal": false, "children": [], @@ -99,7 +148,7 @@ }, { "name": "Node Standalone", - "path": "/tutorials/node-server-tutorial", + "path": "/getting-started/tutorials/node-server-tutorial", "id": "node-server-tutorial", "isExternal": false, "children": [], @@ -110,7 +159,7 @@ }, { "name": "Package-Based Monorepo", - "path": "/tutorials/package-based-repo-tutorial", + "path": "/getting-started/tutorials/package-based-repo-tutorial", "id": "package-based-repo-tutorial", "isExternal": false, "children": [], @@ -118,7 +167,7 @@ }, { "name": "Integrated Monorepo", - "path": "/tutorials/integrated-repo-tutorial", + "path": "/getting-started/tutorials/integrated-repo-tutorial", "id": "integrated-repo-tutorial", "isExternal": false, "children": [], @@ -126,7 +175,7 @@ }, { "name": "React Standalone", - "path": "/tutorials/react-standalone-tutorial", + "path": "/getting-started/tutorials/react-standalone-tutorial", "id": "react-standalone-tutorial", "isExternal": false, "children": [], @@ -134,7 +183,7 @@ }, { "name": "Angular Standalone", - "path": "/tutorials/angular-standalone-tutorial", + "path": "/getting-started/tutorials/angular-standalone-tutorial", "id": "angular-standalone-tutorial", "isExternal": false, "children": [], @@ -142,7 +191,7 @@ }, { "name": "Node Standalone", - "path": "/tutorials/node-server-tutorial", + "path": "/getting-started/tutorials/node-server-tutorial", "id": "node-server-tutorial", "isExternal": false, "children": [], diff --git a/docs/generated/manifests/nx.json b/docs/generated/manifests/nx.json index 3b683d093f..837d6bcdf8 100644 --- a/docs/generated/manifests/nx.json +++ b/docs/generated/manifests/nx.json @@ -34,6 +34,67 @@ "isExternal": false, "path": "/getting-started/why-nx", "tags": [] + }, + { + "id": "tutorials", + "name": "5 min Tutorials", + "description": "Get started with basic information, concepts and tutorials.", + "file": "", + "itemList": [ + { + "id": "package-based-repo-tutorial", + "name": "Package-Based Monorepo", + "description": "", + "file": "shared/npm-tutorial/package-based", + "itemList": [], + "isExternal": false, + "path": "/getting-started/tutorials/package-based-repo-tutorial", + "tags": [] + }, + { + "id": "integrated-repo-tutorial", + "name": "Integrated Monorepo", + "description": "", + "file": "shared/npm-tutorial/integrated", + "itemList": [], + "isExternal": false, + "path": "/getting-started/tutorials/integrated-repo-tutorial", + "tags": [] + }, + { + "id": "react-standalone-tutorial", + "name": "React Standalone", + "description": "", + "file": "shared/react-standalone-tutorial/react-standalone", + "itemList": [], + "isExternal": false, + "path": "/getting-started/tutorials/react-standalone-tutorial", + "tags": [] + }, + { + "id": "angular-standalone-tutorial", + "name": "Angular Standalone", + "description": "", + "file": "shared/angular-standalone-tutorial/angular-standalone", + "itemList": [], + "isExternal": false, + "path": "/getting-started/tutorials/angular-standalone-tutorial", + "tags": [] + }, + { + "id": "node-server-tutorial", + "name": "Node Standalone", + "description": "", + "file": "shared/node-server-tutorial/1-code-generation", + "itemList": [], + "isExternal": false, + "path": "/getting-started/tutorials/node-server-tutorial", + "tags": [] + } + ], + "isExternal": false, + "path": "/getting-started/tutorials", + "tags": [] } ], "isExternal": false, @@ -70,7 +131,7 @@ "path": "/getting-started/why-nx", "tags": [] }, - "/tutorials": { + "/getting-started/tutorials": { "id": "tutorials", "name": "5 min Tutorials", "description": "Get started with basic information, concepts and tutorials.", @@ -83,7 +144,7 @@ "file": "shared/npm-tutorial/package-based", "itemList": [], "isExternal": false, - "path": "/tutorials/package-based-repo-tutorial", + "path": "/getting-started/tutorials/package-based-repo-tutorial", "tags": [] }, { @@ -93,7 +154,7 @@ "file": "shared/npm-tutorial/integrated", "itemList": [], "isExternal": false, - "path": "/tutorials/integrated-repo-tutorial", + "path": "/getting-started/tutorials/integrated-repo-tutorial", "tags": [] }, { @@ -103,7 +164,7 @@ "file": "shared/react-standalone-tutorial/react-standalone", "itemList": [], "isExternal": false, - "path": "/tutorials/react-standalone-tutorial", + "path": "/getting-started/tutorials/react-standalone-tutorial", "tags": [] }, { @@ -113,7 +174,7 @@ "file": "shared/angular-standalone-tutorial/angular-standalone", "itemList": [], "isExternal": false, - "path": "/tutorials/angular-standalone-tutorial", + "path": "/getting-started/tutorials/angular-standalone-tutorial", "tags": [] }, { @@ -123,62 +184,62 @@ "file": "shared/node-server-tutorial/1-code-generation", "itemList": [], "isExternal": false, - "path": "/tutorials/node-server-tutorial", + "path": "/getting-started/tutorials/node-server-tutorial", "tags": [] } ], "isExternal": false, - "path": "/tutorials", + "path": "/getting-started/tutorials", "tags": [] }, - "/tutorials/package-based-repo-tutorial": { + "/getting-started/tutorials/package-based-repo-tutorial": { "id": "package-based-repo-tutorial", "name": "Package-Based Monorepo", "description": "", "file": "shared/npm-tutorial/package-based", "itemList": [], "isExternal": false, - "path": "/tutorials/package-based-repo-tutorial", + "path": "/getting-started/tutorials/package-based-repo-tutorial", "tags": [] }, - "/tutorials/integrated-repo-tutorial": { + "/getting-started/tutorials/integrated-repo-tutorial": { "id": "integrated-repo-tutorial", "name": "Integrated Monorepo", "description": "", "file": "shared/npm-tutorial/integrated", "itemList": [], "isExternal": false, - "path": "/tutorials/integrated-repo-tutorial", + "path": "/getting-started/tutorials/integrated-repo-tutorial", "tags": [] }, - "/tutorials/react-standalone-tutorial": { + "/getting-started/tutorials/react-standalone-tutorial": { "id": "react-standalone-tutorial", "name": "React Standalone", "description": "", "file": "shared/react-standalone-tutorial/react-standalone", "itemList": [], "isExternal": false, - "path": "/tutorials/react-standalone-tutorial", + "path": "/getting-started/tutorials/react-standalone-tutorial", "tags": [] }, - "/tutorials/angular-standalone-tutorial": { + "/getting-started/tutorials/angular-standalone-tutorial": { "id": "angular-standalone-tutorial", "name": "Angular Standalone", "description": "", "file": "shared/angular-standalone-tutorial/angular-standalone", "itemList": [], "isExternal": false, - "path": "/tutorials/angular-standalone-tutorial", + "path": "/getting-started/tutorials/angular-standalone-tutorial", "tags": [] }, - "/tutorials/node-server-tutorial": { + "/getting-started/tutorials/node-server-tutorial": { "id": "node-server-tutorial", "name": "Node Standalone", "description": "", "file": "shared/node-server-tutorial/1-code-generation", "itemList": [], "isExternal": false, - "path": "/tutorials/node-server-tutorial", + "path": "/getting-started/tutorials/node-server-tutorial", "tags": [] }, "/core-tutorial": { diff --git a/docs/map.json b/docs/map.json index 7e66b21c67..738f1ea083 100644 --- a/docs/map.json +++ b/docs/map.json @@ -27,38 +27,38 @@ "name": "Why Nx?", "id": "why-nx", "file": "shared/getting-started/why-nx" - } - ] - }, - { - "name": "5 min Tutorials", - "id": "tutorials", - "description": "Get started with basic information, concepts and tutorials.", - "itemList": [ - { - "name": "Package-Based Monorepo", - "id": "package-based-repo-tutorial", - "file": "shared/npm-tutorial/package-based" }, { - "name": "Integrated Monorepo", - "id": "integrated-repo-tutorial", - "file": "shared/npm-tutorial/integrated" - }, - { - "name": "React Standalone", - "id": "react-standalone-tutorial", - "file": "shared/react-standalone-tutorial/react-standalone" - }, - { - "name": "Angular Standalone", - "id": "angular-standalone-tutorial", - "file": "shared/angular-standalone-tutorial/angular-standalone" - }, - { - "name": "Node Standalone", - "id": "node-server-tutorial", - "file": "shared/node-server-tutorial/1-code-generation" + "name": "5 min Tutorials", + "id": "tutorials", + "description": "Get started with basic information, concepts and tutorials.", + "itemList": [ + { + "name": "Package-Based Monorepo", + "id": "package-based-repo-tutorial", + "file": "shared/npm-tutorial/package-based" + }, + { + "name": "Integrated Monorepo", + "id": "integrated-repo-tutorial", + "file": "shared/npm-tutorial/integrated" + }, + { + "name": "React Standalone", + "id": "react-standalone-tutorial", + "file": "shared/react-standalone-tutorial/react-standalone" + }, + { + "name": "Angular Standalone", + "id": "angular-standalone-tutorial", + "file": "shared/angular-standalone-tutorial/angular-standalone" + }, + { + "name": "Node Standalone", + "id": "node-server-tutorial", + "file": "shared/node-server-tutorial/1-code-generation" + } + ] } ] }, diff --git a/docs/shared/concepts/integrated-vs-package-based.md b/docs/shared/concepts/integrated-vs-package-based.md index 2d37aac381..c959475dcf 100644 --- a/docs/shared/concepts/integrated-vs-package-based.md +++ b/docs/shared/concepts/integrated-vs-package-based.md @@ -18,7 +18,7 @@ A package-based repo is a collection of packages that depend on each other via ` Lerna, Yarn, Lage, [Turborepo](/more-concepts/turbo-and-nx) and Nx (without plugins) support this style. {% cards %} -{% card title="Tutorial: Getting Started with Package-Based Repos" description="Walkthrough for creating a package-based monorepo with Nx" type="documentation" url="/tutorials/package-based-repo-tutorial" /%} +{% card title="Tutorial: Getting Started with Package-Based Repos" description="Walkthrough for creating a package-based monorepo with Nx" type="documentation" url="/getting-started/tutorials/package-based-repo-tutorial" /%} {% /cards %} ## Integrated Repos @@ -28,7 +28,7 @@ An integrated repo contains projects that depend on each other through standard Bazel and Nx (with plugins) support this style. {% cards %} -{% card title="Tutorial: Getting Started with Integrated Repos" description="Walkthrough for creating an integrated monorepo with Nx" type="documentation" url="/tutorials/integrated-repo-tutorial" /%} +{% card title="Tutorial: Getting Started with Integrated Repos" description="Walkthrough for creating an integrated monorepo with Nx" type="documentation" url="/getting-started/tutorials/integrated-repo-tutorial" /%} {% /cards %} ## Standalone Applications @@ -37,8 +37,8 @@ Nx plugins, especially the [generators](/plugin-features/use-code-generators), [ {% cards %} {% card title="Standalone Applications with Nx" description="Learn what Standlone Apps are and how Nx can be useful" type="video" url="https://youtu.be/qEaVzh-oBBc" /%} -{% card title="Tutorial: React Standalone Tutorial" description="Walkthrough for creating a React standalone application with Nx" type="documentation" url="/tutorials/react-standalone-tutorial" /%} -{% card title="Tutorial: Angular Standalone Tutorial" description="Walkthrough for creating an Angular standalone application with Nx" type="documentation" url="/tutorials/angular-standalone-tutorial" /%} +{% card title="Tutorial: React Standalone Tutorial" description="Walkthrough for creating a React standalone application with Nx" type="documentation" url="/getting-started/tutorials/react-standalone-tutorial" /%} +{% card title="Tutorial: Angular Standalone Tutorial" description="Walkthrough for creating an Angular standalone application with Nx" type="documentation" url="/getting-started/tutorials/angular-standalone-tutorial" /%} {% /cards %} ## How to Choose diff --git a/docs/shared/core-tutorial/01-create-blog.md b/docs/shared/core-tutorial/01-create-blog.md index 0c21a55a53..d7ad61a27a 100644 --- a/docs/shared/core-tutorial/01-create-blog.md +++ b/docs/shared/core-tutorial/01-create-blog.md @@ -3,7 +3,7 @@ In this tutorial you create multiple projects in a monorepo and take advantage of the core Nx features with a minimum of configuration. {% callout type="check" title="Package-Based Repo" %} -This tutorial sets up a [package-based repo](/concepts/integrated-vs-package-based). If you prefer an [integrated repo](/concepts/integrated-vs-package-based), check out the [React](/react-tutorial/1-code-generation), [Angular](/angular-tutorial/1-code-generation) or [Node](/tutorials/node-server-tutorial) tutorials. +This tutorial sets up a [package-based repo](/concepts/integrated-vs-package-based). If you prefer an [integrated repo](/concepts/integrated-vs-package-based), check out the [React](/react-tutorial/1-code-generation), [Angular](/angular-tutorial/1-code-generation) or [Node](/getting-started/tutorials/node-server-tutorial) tutorials. {% /callout %} ## Contents: diff --git a/docs/shared/getting-started/intro.md b/docs/shared/getting-started/intro.md index 3c9161ca58..fd1f2ca146 100644 --- a/docs/shared/getting-started/intro.md +++ b/docs/shared/getting-started/intro.md @@ -17,18 +17,18 @@ You can use Nx to quickly scaffold a new standalone project or even an entire mo Its modular architecture lets you adopt Nx for package-based monorepos in combination with NPM, Yarn or PNPM, or create a fully integrated monorepo using Nx plugins. Learn more with the tutorials below. {% personas %} -{% persona type="javascript" title="New Package-Based Repo" url="/tutorials/package-based-repo-tutorial" %} +{% persona type="javascript" title="New Package-Based Repo" url="/getting-started/tutorials/package-based-repo-tutorial" %} Create a monorepo with Yarn, NPM or PNPM. Nx makes it fast, but lets you run things your way. -- [Get started with your package-based repo](/tutorials/package-based-repo-tutorial) +- [Get started with your package-based repo](/getting-started/tutorials/package-based-repo-tutorial) {% /persona %} -{% persona type="integrated" title="New Integrated Repo" url="/tutorials/integrated-repo-tutorial" %} +{% persona type="integrated" title="New Integrated Repo" url="/getting-started/tutorials/integrated-repo-tutorial" %} Get a pre-configured setup. Nx configures your favorite frameworks and lets you focus on shipping features. -- [Get started with your integrated repo](/tutorials/integrated-repo-tutorial) +- [Get started with your integrated repo](/getting-started/tutorials/integrated-repo-tutorial) {% /persona %} @@ -42,27 +42,27 @@ Nx works well not just for monorepos. Nx plugins help you scaffold new standalon {% cards cols="3" %} -{% persona type="react" title="Create a Standalone React app" url="/tutorials/react-standalone-tutorial" %} +{% persona type="react" title="Create a Standalone React app" url="/getting-started/tutorials/react-standalone-tutorial" %} A modern React setup with built-in support for Vite, ESLint, Cypress, and more. Think CRA but modern, always up-to-date and scalable. -- [Create a Standalone React app](/tutorials/react-standalone-tutorial) +- [Create a Standalone React app](/getting-started/tutorials/react-standalone-tutorial) {% /persona %} -{% persona type="angular" title="Create a Standalone Angular app" url="/tutorials/angular-standalone-tutorial" %} +{% persona type="angular" title="Create a Standalone Angular app" url="/getting-started/tutorials/angular-standalone-tutorial" %} A modern Angular development experience powered by advanced generators and integrations with modern tooling. -- [Create a Standalone Angular app](/tutorials/angular-standalone-tutorial) +- [Create a Standalone Angular app](/getting-started/tutorials/angular-standalone-tutorial) {% /persona %} -{% persona type="node" title="Create a Standalone Node server" url="/tutorials/node-server-tutorial" %} +{% persona type="node" title="Create a Standalone Node server" url="/getting-started/tutorials/node-server-tutorial" %} A modern Node server with scaffolding for Express, Fastify or Koa. There's also Docker support built-in. -- [Create a Standalone Node server](/tutorials/node-server-tutorial) +- [Create a Standalone Node server](/getting-started/tutorials/node-server-tutorial) {% /persona %} diff --git a/docs/shared/guides/nx-and-angular-cli.md b/docs/shared/guides/nx-and-angular-cli.md index a0eedc1063..7ebff2fb30 100644 --- a/docs/shared/guides/nx-and-angular-cli.md +++ b/docs/shared/guides/nx-and-angular-cli.md @@ -46,7 +46,7 @@ Replace `[package]` with the name of the package you're trying to add. Nx can improve your developer experience without rearranging folders in your workspace and without the need to have multiple apps in the same repo. The changes outlined in the previous sections are the only modifications to your existing workflow that are needed, then Nx opens the door to many more DX improvements. -Without any additional changes, Nx provides task caching, automated architecture diagrams and IDE integrations. Then, with some minor configuration, you can add task pipelines, distributed caching and CI improvements. To take full advantage of these features, you can begin to separate your large application into self-contained libraries. For an introduction to this process, complete the [Angular Standalone Tutorial](/tutorials/angular-standalone-tutorial). +Without any additional changes, Nx provides task caching, automated architecture diagrams and IDE integrations. Then, with some minor configuration, you can add task pipelines, distributed caching and CI improvements. To take full advantage of these features, you can begin to separate your large application into self-contained libraries. For an introduction to this process, complete the [Angular Standalone Tutorial](/getting-started/tutorials/angular-standalone-tutorial). ## More Info diff --git a/docs/shared/migration/adding-to-monorepo.md b/docs/shared/migration/adding-to-monorepo.md index cade73fd63..ecaad25e2f 100644 --- a/docs/shared/migration/adding-to-monorepo.md +++ b/docs/shared/migration/adding-to-monorepo.md @@ -4,7 +4,7 @@ Interested in migrating from [Lerna](https://github.com/lerna/lerna) in particular? In case you missed it, Lerna v6 is powering Nx underneath. As a result, Lerna gets all the modern features such as caching and task pipelines. Read more on [https://lerna.js.org/upgrade](https://lerna.js.org/upgrade). {% /callout %} -Nx has first class support for [package-based monorepos](/tutorials/package-based-repo-tutorial). As a result, if you have an existing NPM/Yarn or PNPM based monorepo setup, you can easily add Nx to get +Nx has first-class support for [package-based monorepos](/getting-started/tutorials/package-based-repo-tutorial). As a result, if you have an existing NPM/Yarn or PNPM-based monorepo setup, you can easily add Nx to get - fast [task scheduling](/core-features/run-tasks) - support for [task pipelines](/concepts/task-pipeline-configuration) @@ -12,7 +12,7 @@ Nx has first class support for [package-based monorepos](/tutorials/package-base - optionally [remote caching with Nx Cloud](/core-features/share-your-cache) - optionally [distributed task execution with Nx Cloud](/core-features/distribute-task-execution) -This is a low-impact operation because all that needs to be done is to install the `nx` package at the root-level and add an `nx.json` for configuring caching and task pipelines. +This is a low-impact operation because all that needs to be done is to install the `nx` package at the root level and add an `nx.json` for configuring caching and task pipelines. ## Installing Nx diff --git a/docs/shared/npm-tutorial/integrated.md b/docs/shared/npm-tutorial/integrated.md index b08b1a48f7..aa2c9b5fc1 100644 --- a/docs/shared/npm-tutorial/integrated.md +++ b/docs/shared/npm-tutorial/integrated.md @@ -233,6 +233,6 @@ npx nx affected -t build {% card title="React Tutorial" description="A step-by-step tutorial showing how to build an integrated monorepo with React applications sharing code." url="/react-tutorial/1-code-generation" /%} -{% card title="Node.js Tutorial" description="A step-by-step tutorial showing how to build an integrated monorepo with Node.js applications sharing code." url="/tutorials/node-server-tutorial" /%} +{% card title="Node.js Tutorial" description="A step-by-step tutorial showing how to build an integrated monorepo with Node.js applications sharing code." url="/getting-started/tutorials/node-server-tutorial" /%} {% /cards %} diff --git a/docs/shared/reference/sitemap.md b/docs/shared/reference/sitemap.md index 0b24ca23e6..84fa663977 100644 --- a/docs/shared/reference/sitemap.md +++ b/docs/shared/reference/sitemap.md @@ -4,12 +4,12 @@ - [Getting Started](/getting-started/intro) - [Installation](/getting-started/installation) - [Why Nx?](/getting-started/why-nx) - - [5 min Tutorials](/tutorials) - - [Package-Based Monorepo](/tutorials/package-based-repo-tutorial) - - [Integrated Monorepo](/tutorials/integrated-repo-tutorial) - - [React Standalone](/tutorials/react-standalone-tutorial) - - [Angular Standalone](/tutorials/angular-standalone-tutorial) - - [Node Standalone](/tutorials/node-server-tutorial) + - [5 min Tutorials](/getting-started/tutorials) + - [Package-Based Monorepo](/getting-started/tutorials/package-based-repo-tutorial) + - [Integrated Monorepo](/getting-started/tutorials/integrated-repo-tutorial) + - [React Standalone](/getting-started/tutorials/react-standalone-tutorial) + - [Angular Standalone](/getting-started/tutorials/angular-standalone-tutorial) + - [Node Standalone](/getting-started/tutorials/node-server-tutorial) - [Core Tutorial](/core-tutorial) - [1 - Create Blog](/core-tutorial/01-create-blog) - [2 - Create CLI](/core-tutorial/02-create-cli) diff --git a/nx-dev/data-access-menu/src/lib/menu.utils.ts b/nx-dev/data-access-menu/src/lib/menu.utils.ts index 4c69873462..6ff49c130c 100644 --- a/nx-dev/data-access-menu/src/lib/menu.utils.ts +++ b/nx-dev/data-access-menu/src/lib/menu.utils.ts @@ -9,7 +9,6 @@ export function getBasicNxSection(items: MenuItem[]): MenuSection { .filter( (m) => m.id === 'getting-started' || - m.id === 'tutorials' || m.id === 'core-features' || m.id === 'plugin-features' || m.id === 'concepts' || diff --git a/nx-dev/nx-dev/redirect-rules.js b/nx-dev/nx-dev/redirect-rules.js index 8499d13d72..4142429452 100644 --- a/nx-dev/nx-dev/redirect-rules.js +++ b/nx-dev/nx-dev/redirect-rules.js @@ -369,7 +369,7 @@ const tutorialBaseUrls = { '/(l|latest)/(a|angular)/tutorial/1-code-generation': '/angular-tutorial/1-code-generation', '/(l|latest)/(a|node)/tutorial/1-code-generation': - '/tutorials/node-server-tutorial', + '/getting-started/tutorials/node-server-tutorial', '/(l|latest)/(r|react)/tutorial/1-code-generation': '/react-tutorial/1-code-generation', }; @@ -405,7 +405,7 @@ const oldNodeTutorialPaths = [ ]; const extraNodeRedirects = { - '/getting-started/node-tutorial': '/tutorials/node-server-tutorial', + '/getting-started/node-tutorial': '/getting-started/node-server-tutorial', '/node-tutorial/1-code-generation': '/node-server-tutorial/1-code-generation', '/node-tutorial/2-project-graph': '/node-server-tutorial/2-project-graph', '/node-tutorial/3-task-running': '/node-server-tutorial/3-task-running', @@ -413,7 +413,8 @@ const extraNodeRedirects = { '/node-tutorial/5-docker-target': '/node-server-tutorial/5-docker-target', '/node-tutorial/6-summary': '/node-server-tutorial/6-summary', }; -const nodeRedirectDestination = '/tutorials/node-server-tutorial'; +const nodeRedirectDestination = + '/getting-started/tutorials/node-server-tutorial'; const nodeTutorialRedirects = oldNodeTutorialPaths.reduce((acc, path) => { acc[path] = nodeRedirectDestination; return acc; @@ -451,25 +452,25 @@ for (const path of oldAngularTutorialPaths) { */ const standaloneTutorialRedirects = { '/shared/react-standalone-tutorial/1-code-generation': - '/tutorials/react-standalone-tutorial', + '/getting-started/tutorials/react-standalone-tutorial', '/shared/react-standalone-tutorial/2-project-graph': - '/tutorials/react-standalone-tutorial', + '/getting-started/tutorials/react-standalone-tutorial', '/shared/react-standalone-tutorial/3-task-running': - '/tutorials/react-standalone-tutorial', + '/getting-started/tutorials/react-standalone-tutorial', '/shared/react-standalone-tutorial/4-task-pipelines': - '/tutorials/react-standalone-tutorial', + '/getting-started/tutorials/react-standalone-tutorial', '/shared/react-standalone-tutorial/5-summary': - '/tutorials/react-standalone-tutorial', + '/getting-started/tutorials/react-standalone-tutorial', 'shared/angular-standalone-tutorial/1-code-generation': - '/tutorials/angular-standalone-tutorial', + '/getting-started/tutorials/angular-standalone-tutorial', 'shared/angular-standalone-tutorial/2-project-graph': - '/tutorials/angular-standalone-tutorial', + '/getting-started/tutorials/angular-standalone-tutorial', 'shared/angular-standalone-tutorial/3-task-running': - '/tutorials/angular-standalone-tutorial', + '/getting-started/tutorials/angular-standalone-tutorial', 'shared/angular-standalone-tutorial/4-task-pipelines': - '/tutorials/angular-standalone-tutorial', + '/getting-started/tutorials/angular-standalone-tutorial', 'shared/angular-standalone-tutorial/5-summary': - '/tutorials/angular-standalone-tutorial', + '/getting-started/tutorials/angular-standalone-tutorial', }; const packagesIndexes = { @@ -599,13 +600,26 @@ const conceptUrls = { '/more-concepts/global-nx': '/getting-started/installation#installing-nx-globally', '/getting-started/package-based-repo-tutorial': - '/tutorials/package-based-repo-tutorial', + '/getting-started/tutorials/package-based-repo-tutorial', '/getting-started/integrated-repo-tutorial': - '/tutorials/integrated-repo-tutorial', + '/getting-started/tutorials/integrated-repo-tutorial', '/getting-started/react-standalone-tutorial': - '/tutorials/react-standalone-tutorial', + '/getting-started/tutorials/react-standalone-tutorial', '/getting-started/angular-standalone-tutorial': - '/tutorials/angular-standalone-tutorial', + '/getting-started/tutorials/angular-standalone-tutorial', +}; + +const nested5minuteTutorialUrls = { + '/tutorials/package-based-repo-tutorial': + '/getting-started/tutorials/package-based-repo-tutorial', + '/tutorials/integrated-repo-tutorial': + '/getting-started/tutorials/integrated-repo-tutorial', + '/tutorials/react-standalone-tutorial': + '/getting-started/tutorials/react-standalone-tutorial', + '/tutorials/angular-standalone-tutorial': + '/getting-started/tutorials/angular-standalone-tutorial', + '/tutorials/node-server-tutorial': + '/getting-started/tutorials/node-server-tutorial', }; const pluginUrls = { @@ -648,5 +662,6 @@ module.exports = { packagesIndexes, packagesDocuments, conceptUrls, + nested5minuteTutorialUrls, pluginUrls, }; diff --git a/nx-dev/nx-dev/redirect-rules.spec.js b/nx-dev/nx-dev/redirect-rules.spec.js index 717ba36d65..c4a4d73c17 100644 --- a/nx-dev/nx-dev/redirect-rules.spec.js +++ b/nx-dev/nx-dev/redirect-rules.spec.js @@ -79,7 +79,7 @@ describe('Redirect rules configuration', () => { for (const url of oldNodeTutorialPaths) { expect(redirectRules.tutorialRedirects[url]).toEqual( - '/tutorials/node-server-tutorial' + '/getting-started/tutorials/node-server-tutorial' ); } diff --git a/nx-dev/ui-common/src/lib/sidebar.tsx b/nx-dev/ui-common/src/lib/sidebar.tsx index dbdb341ea4..4a54e840e2 100644 --- a/nx-dev/ui-common/src/lib/sidebar.tsx +++ b/nx-dev/ui-common/src/lib/sidebar.tsx @@ -107,7 +107,7 @@ function SidebarSectionItems({ item }: { item: MenuItem }): JSX.Element { )} -