The starter template should look like the following.
Right click on the AppHost project (e.g. SampleAspireApp.AppHost) and click Manage NuGet packages... . Go to the updates tab and check the Include prerelease checkbox. Update to the latest Aspire Hosting package.
Time to bootstrap a Qwik application. From the terminal change your directory to the created Aspire project.
Use the following command to create a Qwik project,
npm create qwik@latest
Type in the directory name under which the project files will reside.
Add a Dockerfile to the Qwik project,
Also add a .env file containing the following environment variable that points to the Aspire ApiService project running on the Docker container.
AddNpmApp takes two arguments, first argument is the name of the node project and the second one is the project path to your node project. The container port is set to 5173 means the Qwik app will be hosted on http://localhost:5173.
The final Program.cs file should look like this,
And done, Run the Aspire project and two browser window should pop up.
Let's fetch the forcast from the ApiService and show it in the UI. Add the following to the index.tsx file.
The app should show the forecast in a styled table like the following,