diff --git a/src/frontend/src/content/docs/app-host/container-files.mdx b/src/frontend/src/content/docs/app-host/container-files.mdx index 01f5fb8a9..18d683eaa 100644 --- a/src/frontend/src/content/docs/app-host/container-files.mdx +++ b/src/frontend/src/content/docs/app-host/container-files.mdx @@ -364,7 +364,7 @@ await builder.build().run(); In this example: 1. The `frontend` resource builds inside its container, producing compiled JavaScript, CSS, and HTML. -2. During publish, Aspire copies those files from the frontend container into the `api` container at `./wwwroot`. +2. During publish, Aspire copies those files from the `frontend` container into the `api` container at `./wwwroot`. 3. The resulting `api` container includes both the API code and the frontend static assets, ready to serve the full application. ### Serve a frontend from YARP diff --git a/src/frontend/src/content/docs/app-host/migrate-from-docker-compose.mdx b/src/frontend/src/content/docs/app-host/migrate-from-docker-compose.mdx index 56ebc03d3..7f802b024 100644 --- a/src/frontend/src/content/docs/app-host/migrate-from-docker-compose.mdx +++ b/src/frontend/src/content/docs/app-host/migrate-from-docker-compose.mdx @@ -43,7 +43,7 @@ This section demonstrates practical migration scenarios you'll likely encounter ### Multi-service web application -This example shows a typical three-tier application with frontend, API, and database. +This example shows a typical three-tier application with a frontend, API, and database. **Docker Compose example:** diff --git a/src/frontend/src/content/docs/architecture/overview.mdx b/src/frontend/src/content/docs/architecture/overview.mdx index c3877acf6..45fe84e4b 100644 --- a/src/frontend/src/content/docs/architecture/overview.mdx +++ b/src/frontend/src/content/docs/architecture/overview.mdx @@ -43,14 +43,14 @@ Why is modality important when it comes to the AppHost's execution context? This - Database: PostgreSQL - Cache: Redis - AI service: Ollama or OpenAI -- Back end: ASP.NET Core minimal API -- Front end: React app +- Backend: ASP.NET Core minimal API +- Frontend: React app Depending on the mode, the AppHost might treat these resources differently. For example, in run mode, the AppHost might use a local PostgreSQL database and Redis cache—using containers, while in publish mode, it might generate deployment artifacts for Azure PostgreSQL and Redis Cache. #### Run mode -The default mode is run mode, which is ideal for local development and testing. In this mode, the Aspire AppHost orchestrates your application model, including processes, containers, and cloud emulators, to facilitate fast and iterative development. Resources behave like real runtime entities with lifecycles that mirror production. With a simple F5, the AppHost launches everything in your app model—storage, databases, caches, messaging, jobs, APIs, front ends—all fully configured and ready to debug locally. Let's considering the app model from the previous section—where AppHost would orchestrate the following resources locally: +The default mode is run mode, which is ideal for local development and testing. In this mode, the Aspire AppHost orchestrates your application model, including processes, containers, and cloud emulators, to facilitate fast and iterative development. Resources behave like real runtime entities with lifecycles that mirror production. With a simple F5, the AppHost launches everything in your app model—storage, databases, caches, messaging, jobs, APIs, frontends—all fully configured and ready to debug locally. Let's considering the app model from the previous section—where AppHost would orchestrate the following resources locally: import ThemeImage from '@components/ThemeImage.astro'; diff --git a/src/frontend/src/content/docs/community/contributor-guide.mdx b/src/frontend/src/content/docs/community/contributor-guide.mdx index 24cebd200..2cf1a660a 100644 --- a/src/frontend/src/content/docs/community/contributor-guide.mdx +++ b/src/frontend/src/content/docs/community/contributor-guide.mdx @@ -112,7 +112,7 @@ Before you begin, ensure you have the following installed: pnpm dev ``` - This starts the Vite development server for the front end and provide hot-reload capabilities. + This starts the Vite development server for the frontend and provide hot-reload capabilities. 1. View the site locally diff --git a/src/frontend/src/content/docs/community/thanks.mdx b/src/frontend/src/content/docs/community/thanks.mdx index a04f847b1..d663c2560 100644 --- a/src/frontend/src/content/docs/community/thanks.mdx +++ b/src/frontend/src/content/docs/community/thanks.mdx @@ -880,7 +880,7 @@ Aspire speaks many languages — thanks to these communities.

- The JavaScript runtime that enables Aspire to orchestrate front-end and + The JavaScript runtime that enables Aspire to orchestrate frontend and full-stack JS apps.

@@ -1016,7 +1016,7 @@ Aspire speaks many languages — thanks to these communities.

The typed superset of JavaScript that powers Aspire's TypeScript AppHost - and front-end tooling. + and frontend tooling.

@@ -1285,7 +1285,7 @@ The tools that power this very website.

The fast, disk-space efficient package manager that builds the aspire.dev - front end. + frontend.

diff --git a/src/frontend/src/content/docs/community/videos.mdx b/src/frontend/src/content/docs/community/videos.mdx index 3a3047bec..4a2c00e91 100644 --- a/src/frontend/src/content/docs/community/videos.mdx +++ b/src/frontend/src/content/docs/community/videos.mdx @@ -200,7 +200,7 @@ export const communityVideos = [ href: 'https://youtu.be/dftmYBuZOLA?list=PL2E-vlKoo_v2dgxPizLVtdxvurOHvd8_h&t=341', title: 'Microservices: Aspire & Blazor SSR', description: - 'Codewrinkles builds a microservices app, orchestrated with Aspire and using Blazor SSR on the front end.', + 'Codewrinkles builds a microservices app, orchestrated with Aspire and using Blazor SSR on the frontend.', tags: ['Community', 'Blazor', 'SSR'], }, { diff --git a/src/frontend/src/content/docs/dashboard/explore.mdx b/src/frontend/src/content/docs/dashboard/explore.mdx index a5f664a64..494592de6 100644 --- a/src/frontend/src/content/docs/dashboard/explore.mdx +++ b/src/frontend/src/content/docs/dashboard/explore.mdx @@ -121,8 +121,8 @@ You can also obtain the login token from the container logs. For more informatio The **Resources** page is the default home page of the Aspire dashboard. This page lists all of the projects, containers, and executables included in your Aspire solution. For example, the starter application includes two projects: -- **apiservice**: A back-end API project built using Minimal APIs. -- **webfrontend**: The front-end UI project built using Blazor. +- **apiservice**: A backend API project built using Minimal APIs. +- **webfrontend**: The frontend UI project built using Blazor. The dashboard also provides essential details about each resource: diff --git a/src/frontend/src/content/docs/dashboard/overview.mdx b/src/frontend/src/content/docs/dashboard/overview.mdx index 7ae7275a8..dce258055 100644 --- a/src/frontend/src/content/docs/dashboard/overview.mdx +++ b/src/frontend/src/content/docs/dashboard/overview.mdx @@ -70,7 +70,7 @@ For more information, see [Aspire dashboard configuration](/dashboard/configurat ## Architecture -The dashboard user experience is built with a variety of technologies. The frontend is built with [Grpc.AspNetCore](https://www.nuget.org/packages/Grpc.AspNetCore) NuGet package to the resource server. Consider the following diagram that illustrates the architecture of the Aspire dashboard: +The dashboard user experience is built with a variety of technologies. The frontend communicates with the resource server over gRPC using the [Grpc.AspNetCore](https://www.nuget.org/packages/Grpc.AspNetCore) NuGet package. Consider the following diagram that illustrates the architecture of the Aspire dashboard: diff --git a/src/frontend/src/content/docs/deployment/pipelines.mdx b/src/frontend/src/content/docs/deployment/pipelines.mdx index feb56dabd..8ec16e8b1 100644 --- a/src/frontend/src/content/docs/deployment/pipelines.mdx +++ b/src/frontend/src/content/docs/deployment/pipelines.mdx @@ -84,7 +84,7 @@ A pipeline step represents a discrete unit of work in the application pipeline. Each step has: - **Name**: A unique identifier for the step -- **Action**: The work to be performed during deployment +- **Action**: The work to be performed during deployment - **Dependencies**: Other steps that must complete before this step runs - **Resource context**: Access to the application's resource model and configuration @@ -92,7 +92,7 @@ Pipeline steps operate at different levels of granularity. For example, when dep **Infrastructure steps** (can run in parallel): - `provision-cosmosdb`: Provision the CosmosDB database -- `provision-storage`: Provision Azure Storage account +- `provision-storage`: Provision Azure Storage account - `provision-aca-env`: Provision Azure Container Apps environment - `provision-container-registry`: Set up the container image registry diff --git a/src/frontend/src/content/docs/get-started/app-host.mdx b/src/frontend/src/content/docs/get-started/app-host.mdx index fe536897f..3f152e0c1 100644 --- a/src/frontend/src/content/docs/get-started/app-host.mdx +++ b/src/frontend/src/content/docs/get-started/app-host.mdx @@ -31,7 +31,7 @@ Prefer writing your AppHost in TypeScript? Start with [Build your first Aspire a ## Defining your architecture -Consider a simple three-tier architecture where the front end talks to an API, and the API talks to a database: +Consider a simple three-tier architecture where the frontend talks to an API, and the API talks to a database: @@ -40,13 +40,13 @@ architecture-beta service db(logos:postgresql)[PostgreSQL] service api(logos:dotnet)[API service] - service frontend(logos:react)[React front end] + service frontend(logos:react)[React frontend] api:R --> L:db frontend:R --> L:api ``` -This architecture demonstrates a **.NET API** connecting to a **PostgreSQL database**, with a **React front end** consuming the API. The .NET API uses ASP.NET Core and connects to PostgreSQL using Entity Framework or a connection string. The React front end is built with Vite and communicates with the API over HTTP. +This architecture demonstrates a **.NET API** connecting to a **PostgreSQL database**, with a **React frontend** consuming the API. The .NET API uses ASP.NET Core and connects to PostgreSQL using Entity Framework or a connection string. The React frontend is built with Vite and communicates with the API over HTTP. To build this architecture step-by-step, see the [Build your first app](/get-started/first-app/?lang=csharp) quickstart. @@ -58,13 +58,13 @@ architecture-beta service db(logos:postgresql)[PostgreSQL] service api(logos:python)[API service] - service frontend(logos:react)[React front end] + service frontend(logos:react)[React frontend] api:R --> L:db frontend:R --> L:api ``` -This architecture demonstrates a **Python API** (using FastAPI/Uvicorn) connecting to a **PostgreSQL database**, with a **React front end** consuming the API. The Python API uses frameworks like FastAPI or Flask and connects to PostgreSQL using libraries like psycopg2 or SQLAlchemy. The React front end is built with Vite and communicates with the API over HTTP. +This architecture demonstrates a **Python API** (using FastAPI/Uvicorn) connecting to a **PostgreSQL database**, with a **React frontend** consuming the API. The Python API uses frameworks like FastAPI or Flask and connects to PostgreSQL using libraries like psycopg2 or SQLAlchemy. The React frontend is built with Vite and communicates with the API over HTTP. To build this architecture step-by-step, see the [Build your first app](/get-started/first-app/?lang=python) quickstart. @@ -80,13 +80,13 @@ architecture-beta service db(logos:postgresql)[PostgreSQL] service api(logos:nodejs-icon)[API service] - service frontend(logos:react)[React front end] + service frontend(logos:react)[React frontend] api:R --> L:db frontend:R --> L:api ``` -This architecture demonstrates a **Node.js API** connecting to a **PostgreSQL database**, with a **React front end** consuming the API. The Node.js API uses frameworks like Express or Fastify and connects to PostgreSQL using libraries like pg or Prisma. The React front end is built with Vite and communicates with the API over HTTP. +This architecture demonstrates a **Node.js API** connecting to a **PostgreSQL database**, with a **React frontend** consuming the API. The Node.js API uses frameworks like Express or Fastify and connects to PostgreSQL using libraries like pg or Prisma. The React frontend is built with Vite and communicates with the API over HTTP.