docs(core): ci section for tutorials (#24728)

- update CI section in tutorials to not include screenshots of
onboarding flow
- add CI section to `nx init` tutorials

docs/shared/migration/adding-to-existing-project.md

@@ -284,6 +284,67 @@ Now if you run `npm run test` or `nx test` twice, the results will be retrieved
 this example are as cautious as possible, so you can significantly improve the value of the cache
 by [customizing Nx Inputs](/recipes/running-tasks/configure-inputs) for each task.
 
+## Set Up CI for Your Workspace
+
+This tutorial walked you through how Nx can improve the local development experience, but the biggest difference Nx makes is in CI. As repositories get bigger, making sure that the CI is fast, reliable and maintainable can get very challenging. Nx provides a solution.
+
+- Nx reduces wasted time in CI with the [`affected` command](/ci/features/affected).
+- Nx Replay's [remote caching](/ci/features/remote-cache) will reuse task artifacts from different CI executions making sure you will never run the same computation twice.
+- Nx Agents [efficiently distribute tasks across machines](/ci/concepts/parallelization-distribution) ensuring constant CI time regardless of the repository size. The right number of machines is allocated for each PR to ensure good performance without wasting compute.
+- Nx Atomizer [automatically splits](/ci/features/split-e2e-tasks) large e2e tests to distribute them across machines. Nx can also automatically [identify and rerun flaky e2e tests](/ci/features/flaky-tasks).
+
+### Generate a CI Workflow
+
+If you are starting a new project, you can use the following command to generate a CI workflow file.
+
+```shell
+npx nx generate ci-workflow --ci=github
+```
+
+{% callout type="note" title="Choose your CI provider" %}
+You can choose `github`, `circleci`, `azure`, `bitbucket-pipelines`, or `gitlab` for the `ci` flag.
+{% /callout %}
+
+This generator creates a `.github/workflows/ci.yml` file that contains a CI pipeline that will run the `lint`, `test`, `build` and `e2e` tasks for projects that are affected by any given PR.
+
+The key line in the CI pipeline is:
+
+```yml
+- run: npx nx affected -t lint test build e2e-ci
+```
+
+### Connect to Nx Cloud
+
+Nx Cloud is a companion app for your CI system that provides remote caching, task distribution, e2e tests deflaking, better DX and more.
+
+To connect to Nx Cloud:
+
+- Commit and push your changes
+- Go to [https://cloud.nx.app](https://cloud.nx.app), create an account, and connect your repository
+
+#### Connect to Nx Cloud Manually
+
+If you are not able to connect via the automated process at [https://cloud.nx.app](https://cloud.nx.app), you can connect your workspace manually by running:
+
+```shell
+npx nx connect
+```
+
+You will then need to merge your changes and connect to your workspace on [https://cloud.nx.app](https://cloud.nx.app).
+
+### Enable a Distributed CI Pipeline
+
+The current CI pipeline runs on a single machine and can only handle small workspaces. To transform your CI into a CI that runs on multiple machines and can handle workspaces of any size, uncomment the `npx nx-cloud start-ci-run` line in the `.github/workflows/ci.yml` file.
+
+```yml
+- run: npx nx-cloud start-ci-run --distribute-on="5 linux-medium-js" --stop-agents-after="e2e-ci"
+```
+
+For more information about how Nx can improve your CI pipeline, check out one of these detailed tutorials:
+
+- [Circle CI with Nx](/ci/intro/tutorials/circle)
+- [GitHub Actions with Nx](/ci/intro/tutorials/github-actions)
+
 ## Learn More
 
 {% cards %}
@@ -298,15 +359,3 @@ inputs" type="documentation" url="/recipes/running-tasks/configure-inputs" /%}
 monorepo" type="documentation" url="/recipes/adopting-nx/adding-to-monorepo" /%}
 
 {% /cards %}
-
-<!-- {% short-embeds %}
-{% short-video
-title="Nx Tips: Nx Init"
-embedUrl="https://www.youtube.com/embed/Wpj3KSpN0Xw" /%}
-{% short-video
-title="How Long Does It Take To Add Nx?"
-embedUrl="https://www.youtube.com/embed/fPt_pFP6hn8" /%}
-{% short-video
-title="Nx is Complicated?"
-embedUrl="https://www.youtube.com/embed/AQbSwPtPBiw" /%}
-{% /short-embeds %} -->

docs/shared/migration/adding-to-monorepo.md

@@ -307,6 +307,67 @@ pnpm run -r test
 
 This allows for incrementally adopting Nx in your existing workspace.
 
+## Set Up CI for Your Workspace
+
+This tutorial walked you through how Nx can improve the local development experience, but the biggest difference Nx makes is in CI. As repositories get bigger, making sure that the CI is fast, reliable and maintainable can get very challenging. Nx provides a solution.
+
+- Nx reduces wasted time in CI with the [`affected` command](/ci/features/affected).
+- Nx Replay's [remote caching](/ci/features/remote-cache) will reuse task artifacts from different CI executions making sure you will never run the same computation twice.
+- Nx Agents [efficiently distribute tasks across machines](/ci/concepts/parallelization-distribution) ensuring constant CI time regardless of the repository size. The right number of machines is allocated for each PR to ensure good performance without wasting compute.
+- Nx Atomizer [automatically splits](/ci/features/split-e2e-tasks) large e2e tests to distribute them across machines. Nx can also automatically [identify and rerun flaky e2e tests](/ci/features/flaky-tasks).
+
+### Generate a CI Workflow
+
+If you are starting a new project, you can use the following command to generate a CI workflow file.
+
+```shell
+npx nx generate ci-workflow --ci=github
+```
+
+{% callout type="note" title="Choose your CI provider" %}
+You can choose `github`, `circleci`, `azure`, `bitbucket-pipelines`, or `gitlab` for the `ci` flag.
+{% /callout %}
+
+This generator creates a `.github/workflows/ci.yml` file that contains a CI pipeline that will run the `lint`, `test`, `build` and `e2e` tasks for projects that are affected by any given PR.
+
+The key line in the CI pipeline is:
+
+```yml
+- run: npx nx affected -t lint test build e2e-ci
+```
+
+### Connect to Nx Cloud
+
+Nx Cloud is a companion app for your CI system that provides remote caching, task distribution, e2e tests deflaking, better DX and more.
+
+To connect to Nx Cloud:
+
+- Commit and push your changes
+- Go to [https://cloud.nx.app](https://cloud.nx.app), create an account, and connect your repository
+
+#### Connect to Nx Cloud Manually
+
+If you are not able to connect via the automated process at [https://cloud.nx.app](https://cloud.nx.app), you can connect your workspace manually by running:
+
+```shell
+npx nx connect
+```
+
+You will then need to merge your changes and connect to your workspace on [https://cloud.nx.app](https://cloud.nx.app).
+
+### Enable a Distributed CI Pipeline
+
+The current CI pipeline runs on a single machine and can only handle small workspaces. To transform your CI into a CI that runs on multiple machines and can handle workspaces of any size, uncomment the `npx nx-cloud start-ci-run` line in the `.github/workflows/ci.yml` file.
+
+```yml
+- run: npx nx-cloud start-ci-run --distribute-on="5 linux-medium-js" --stop-agents-after="e2e-ci"
+```
+
+For more information about how Nx can improve your CI pipeline, check out one of these detailed tutorials:
+
+- [Circle CI with Nx](/ci/intro/tutorials/circle)
+- [GitHub Actions with Nx](/ci/intro/tutorials/github-actions)
+
 ## Learn More
 
 {% cards %}

docs/shared/migration/migration-angular.md

@@ -108,6 +108,67 @@ Your workspace is now powered by Nx! You can verify that your application still
 
 > Your project graph will grow as you add and use more applications and libraries. You can add the `--watch` flag to `nx graph` to see the changes in-browser as you add them.
 
+## Set Up CI for Your Angular Workspace
+
+This tutorial walked you through how Nx can improve the local development experience, but the biggest difference Nx makes is in CI. As repositories get bigger, making sure that the CI is fast, reliable and maintainable can get very challenging. Nx provides a solution.
+
+- Nx reduces wasted time in CI with the [`affected` command](/ci/features/affected).
+- Nx Replay's [remote caching](/ci/features/remote-cache) will reuse task artifacts from different CI executions making sure you will never run the same computation twice.
+- Nx Agents [efficiently distribute tasks across machines](/ci/concepts/parallelization-distribution) ensuring constant CI time regardless of the repository size. The right number of machines is allocated for each PR to ensure good performance without wasting compute.
+- Nx Atomizer [automatically splits](/ci/features/split-e2e-tasks) large e2e tests to distribute them across machines. Nx can also automatically [identify and rerun flaky e2e tests](/ci/features/flaky-tasks).
+
+### Generate a CI Workflow
+
+If you are starting a new project, you can use the following command to generate a CI workflow file.
+
+```shell
+npx nx generate ci-workflow --ci=github
+```
+
+{% callout type="note" title="Choose your CI provider" %}
+You can choose `github`, `circleci`, `azure`, `bitbucket-pipelines`, or `gitlab` for the `ci` flag.
+{% /callout %}
+
+This generator creates a `.github/workflows/ci.yml` file that contains a CI pipeline that will run the `lint`, `test`, `build` and `e2e` tasks for projects that are affected by any given PR.
+
+The key line in the CI pipeline is:
+
+```yml
+- run: npx nx affected -t lint test build e2e-ci
+```
+
+### Connect to Nx Cloud
+
+Nx Cloud is a companion app for your CI system that provides remote caching, task distribution, e2e tests deflaking, better DX and more.
+
+To connect to Nx Cloud:
+
+- Commit and push your changes
+- Go to [https://cloud.nx.app](https://cloud.nx.app), create an account, and connect your repository
+
+#### Connect to Nx Cloud Manually
+
+If you are not able to connect via the automated process at [https://cloud.nx.app](https://cloud.nx.app), you can connect your workspace manually by running:
+
+```shell
+npx nx connect
+```
+
+You will then need to merge your changes and connect to your workspace on [https://cloud.nx.app](https://cloud.nx.app).
+
+### Enable a Distributed CI Pipeline
+
+The current CI pipeline runs on a single machine and can only handle small workspaces. To transform your CI into a CI that runs on multiple machines and can handle workspaces of any size, uncomment the `npx nx-cloud start-ci-run` line in the `.github/workflows/ci.yml` file.
+
+```yml
+- run: npx nx-cloud start-ci-run --distribute-on="5 linux-medium-js" --stop-agents-after="e2e-ci"
+```
+
+For more information about how Nx can improve your CI pipeline, check out one of these detailed tutorials:
+
+- [Circle CI with Nx](/ci/intro/tutorials/circle)
+- [GitHub Actions with Nx](/ci/intro/tutorials/github-actions)
+
 ## Learn More
 
 Learn more about the advantages of Nx in the following guides:

docs/shared/tutorials/angular-monorepo.md

@@ -1254,7 +1254,7 @@ This tutorial walked you through how Nx can improve the local development experi
 - Nx Agents [efficiently distribute tasks across machines](/ci/concepts/parallelization-distribution) ensuring constant CI time regardless of the repository size. The right number of machines is allocated for each PR to ensure good performance without wasting compute.
 - Nx Atomizer [automatically splits](/ci/features/split-e2e-tasks) large e2e tests to distribute them across machines. Nx can also automatically [identify and rerun flaky e2e tests](/ci/features/flaky-tasks).
 
-### Generating a CI Workflow
+### Generate a CI Workflow
 
 If you are starting a new project, you can use the following command to generate a CI workflow file.
 
@@ -1274,24 +1274,24 @@ The key line in the CI pipeline is:
 - run: npx nx affected -t lint test build e2e-ci
 ```
 
-### Connecting to Nx Cloud
+### Connect to Nx Cloud
 
 Nx Cloud is a companion app for your CI system that provides remote caching, task distribution, e2e tests deflaking, better DX and more.
 
 To connect to Nx Cloud:
 
-- Commit and push your changes to GitHub
+- Commit and push your changes
 - Go to [https://cloud.nx.app](https://cloud.nx.app), create an account, and connect your repository
 
-![Connect to your repository](/shared/tutorials/connect-to-repository.webp)
+#### Connect to Nx Cloud Manually
 
-`cloud.nx.app` will send a PR to your repository enabling Nx Cloud, after which caching, distribution and more will start working.
+If you are not able to connect via the automated process at [https://cloud.nx.app](https://cloud.nx.app), you can connect your workspace manually by running:
 
-![Add an Nx Cloud access token to your repository dialog](/shared/tutorials/send-cloud-pr.webp)
-
-Once you merge that PR, you'll be able to see CI pipeline runs appearing in the Nx Cloud dashboard:
+```shell
+npx nx connect
+```
 
-![CI Pipeline Executions](/shared/tutorials/ci-pipeline-executions.webp)
+You will then need to merge your changes and connect to your workspace on [https://cloud.nx.app](https://cloud.nx.app).
 
 ### Enable a Distributed CI Pipeline
 
@@ -1301,8 +1301,6 @@ The current CI pipeline runs on a single machine and can only handle small works
 - run: npx nx-cloud start-ci-run --distribute-on="5 linux-medium-js" --stop-agents-after="e2e-ci"
 ```
 
-![Run details](/shared/tutorials/gradle-run-details.webp)
-
 For more information about how Nx can improve your CI pipeline, check out one of these detailed tutorials:
 
 - [Circle CI with Nx](/ci/intro/tutorials/circle)

docs/shared/tutorials/angular-standalone.md

@@ -1050,7 +1050,7 @@ This tutorial walked you through how Nx can improve the local development experi
 - Nx Agents [efficiently distribute tasks across machines](/ci/concepts/parallelization-distribution) ensuring constant CI time regardless of the repository size. The right number of machines is allocated for each PR to ensure good performance without wasting compute.
 - Nx Atomizer [automatically splits](/ci/features/split-e2e-tasks) large e2e tests to distribute them across machines. Nx can also automatically [identify and rerun flaky e2e tests](/ci/features/flaky-tasks).
 
-### Generating a CI Workflow
+### Generate a CI Workflow
 
 If you are starting a new project, you can use the following command to generate a CI workflow file.
 
@@ -1070,24 +1070,24 @@ The key line in the CI pipeline is:
 - run: npx nx affected -t lint test build e2e-ci
 ```
 
-### Connecting to Nx Cloud
+### Connect to Nx Cloud
 
 Nx Cloud is a companion app for your CI system that provides remote caching, task distribution, e2e tests deflaking, better DX and more.
 
 To connect to Nx Cloud:
 
-- Commit and push your changes to GitHub
+- Commit and push your changes
 - Go to [https://cloud.nx.app](https://cloud.nx.app), create an account, and connect your repository
 
-![Connect to your repository](/shared/tutorials/connect-to-repository.webp)
+#### Connect to Nx Cloud Manually
 
-`cloud.nx.app` will send a PR to your repository enabling Nx Cloud, after which caching, distribution and more will start working.
+If you are not able to connect via the automated process at [https://cloud.nx.app](https://cloud.nx.app), you can connect your workspace manually by running:
 
-![Add an Nx Cloud access token to your repository dialog](/shared/tutorials/send-cloud-pr.webp)
-
-Once you merge that PR, you'll be able to see CI pipeline runs appearing in the Nx Cloud dashboard:
+```shell
+npx nx connect
+```
 
-![CI Pipeline Executions](/shared/tutorials/ci-pipeline-executions.webp)
+You will then need to merge your changes and connect to your workspace on [https://cloud.nx.app](https://cloud.nx.app).
 
 ### Enable a Distributed CI Pipeline
 
@@ -1097,8 +1097,6 @@ The current CI pipeline runs on a single machine and can only handle small works
 - run: npx nx-cloud start-ci-run --distribute-on="5 linux-medium-js" --stop-agents-after="e2e-ci"
 ```
 
-![Run details](/shared/tutorials/gradle-run-details.webp)
-
 For more information about how Nx can improve your CI pipeline, check out one of these detailed tutorials:
 
 - [Circle CI with Nx](/ci/intro/tutorials/circle)

docs/shared/tutorials/gradle.md

@@ -269,40 +269,44 @@ This tutorial walked you through how Nx can improve the local development experi
 - Nx Agents [efficiently distribute tasks across machines](/ci/concepts/parallelization-distribution) ensuring constant CI time regardless of the repository size. The right number of machines is allocated for each PR to ensure good performance without wasting compute.
 - Nx Atomizer [automatically splits](/ci/features/split-e2e-tasks) large e2e tests to distribute them across machines. Nx can also automatically [identify and rerun flaky e2e tests](/ci/features/flaky-tasks).
 
-### Generating a CI Workflow
+### Generate a CI Workflow
 
 If you are starting a new project, you can use the following command to generate a CI workflow file.
 
 ```shell
-./nx generate @nx/gradle:ci-workflow --ci=github
+npx nx generate ci-workflow --ci=github
 ```
 
-This generator creates a `.github/workflows/ci.yml` file that contains a CI pipeline that will run the `test` and `build` tasks for projects that are affected by any given PR.
+{% callout type="note" title="Choose your CI provider" %}
+You can choose `github`, `circleci`, `azure`, `bitbucket-pipelines`, or `gitlab` for the `ci` flag.
+{% /callout %}
+
+This generator creates a `.github/workflows/ci.yml` file that contains a CI pipeline that will run the `lint`, `test`, `build` and `e2e` tasks for projects that are affected by any given PR.
 
 The key line in the CI pipeline is:
 
-```
-./nx affected -t test build
+```yml
+- run: npx nx affected -t lint test build e2e-ci
 ```
 
-### Connecting to Nx Cloud
+### Connect to Nx Cloud
 
 Nx Cloud is a companion app for your CI system that provides remote caching, task distribution, e2e tests deflaking, better DX and more.
 
 To connect to Nx Cloud:
 
-- Commit and push your changes to GitHub
+- Commit and push your changes
 - Go to [https://cloud.nx.app](https://cloud.nx.app), create an account, and connect your repository
 
-![Connect to your repository](/shared/tutorials/connect-to-repository.webp)
+#### Connect to Nx Cloud Manually
 
-`cloud.nx.app` will send a PR to your repository enabling Nx Cloud, after which caching, distribution and more will start working.
+If you are not able to connect via the automated process at [https://cloud.nx.app](https://cloud.nx.app), you can connect your workspace manually by running:
 
-![Add an Nx Cloud access token to your repository dialog](/shared/tutorials/send-cloud-pr.webp)
-
-Once you merge that PR, you'll be able to see CI pipeline runs appearing in the Nx Cloud dashboard:
+```shell
+npx nx connect
+```
 
-![CI Pipeline Executiosn](/shared/tutorials/ci-pipeline-executions.webp)
+You will then need to merge your changes and connect to your workspace on [https://cloud.nx.app](https://cloud.nx.app).
 
 ### Enable a Distributed CI Pipeline