Skip to content

Latest commit

 

History

History
54 lines (32 loc) · 1.7 KB

LAB.md

File metadata and controls

54 lines (32 loc) · 1.7 KB
Raw

💻 Lab 7 - Add an Express API

⏰  Estimated time: 10-15 minutes

Up until now we've had a single app in our repository, and a few other libs that it uses.

But remember how we created that fake-api way back in the second lab, that only our store app can access?

Our new routed component suddenly needs access to the games as well, so in this lab we'll be adding a completely new app, this time on the backend, as an API. And we'll use the @nx/express plugin to easily generate everything we need.

All the Express specific code for serving the games is provided in the solution.

📚 Learning outcomes:

  • Explore other plugins in the Nx ecosystem

📲 After this workshop, you should have:

App Screenshot No change in how the app looks!

🏋️‍♀️ Steps:

  1. Stop any running nx serve instance

  2. yarn add @nx/express or npm i -S @nx/express

  3. Generate a new Express app, called api

    ⚠️  Make sure you instruct the generator to configure a proxy from the frontend store to the new api service (use --help to see the available options)

  4. Copy the code from the fake api to a new file called apps/api/src/app/games.repository.ts

  5. Update the Express main.ts to use the repository data

  6. Let's now inspect the dependency graph!

  7. Inspect what changed from the last time you committed, then commit your changes

🎓  If you get stuck, check out the solution

➡️  Next lab ➡️