This post will be last part. I will give you videos about how I deploy it to Azure Web App (for Backend) and Azure Static Web App (for Frontend). I will give you some notes that you need to give more attention into it.

Video

Notes

BE Codes

• I install the EF In Memory, since I don't want to deploy SQL Server at Azure yet. I have plan to post it to single article not in this series.

<ItemGroup>
    <!-- other dependencies... -->
    <PackageReference Include="Microsoft.EntityFrameworkCore.InMemory" Version="6.0.0" />
    <!-- other codes ... -->
</ItemGroup>

• I update the Program.cs to use in memory.

// Add services to the container.
builder.Services.AddDbContext<NotesContext>(options =>
{
    // options.UseSqlServer(builder.Configuration.GetConnectionString("Default"));
    options.UseInMemoryDatabase("NotesTest");
});

FE Codes

• I update the backend (GraphQL) URL at index.tsx. You can update it to use environment instead of hardcoded, so you can setup the URL at build stage.

// other codes

const client = new ApolloClient({
  uri: 'https://graph-api-demo.azurewebsites.net/graphql',
  cache: new InMemoryCache()
});

// other codes

Thank you