Where's my project's code hosted?

I have a general knowledge question, likely easy to answer for veterans of this forum :slight_smile:

When I used dfx new to generate my project, it created the following architecture:

β”œβ”€ node_modules/
β”œβ”€ src/
β”‚  β”œβ”€ declarations/
β”‚  β”œβ”€ myapp_backend/
β”‚  β”œβ”€ myapp_frontend/
β”‚  β”‚  β”œβ”€ node_modules/
β”‚  β”‚  β”œβ”€ src/
β”‚  β”‚  β”œβ”€ package.json
β”œβ”€ .env
β”œβ”€ package.json

When I run npm install within the myapp_frontend folder, it appears to install the packages in the root node_modules folder (right under myapp).

I don’t understand that and more generally, why do I need node_modules outside of my 2 canisters’ folders (myapp_backend and myapp_frontend) ? Will any code outside of those 2 folders get deployed when I run dfx deploy ? Maybe I’m misunderstanding how the IC works: if my app has 2 canisters, when I deploy them, are they grouped within some sort of single container or nah they’re just 2 independant containers that happen to work closely together ?

Thanks a lot and sorry if this is trivial.

The location of node_modules is a decision of NPM (or whatever other package manager you might be using) and not related to any IC-specific tech.

When you run dfx deploy, the flow that happens is different for asset canisters than it is for other β€œbackend” canisters.

  • The first few steps are a normal process for frontend development and not related to the IC:
    • First the frontend is built and output to a dist folder
    • The dependencies in node_modules are used to build the UI
    • Once the UI is built, anything necessary from node_modules is already included in the dist folder
  • Now we get to the IC-specific steps:
    • The asset canister is deployed (this is like a special backend canister that is included with DFX)
    • The static assets from your dist folder are uploaded to the asset canister after it is deployed

The two canisters are deployed independently from one another.

Thanks a lot for your answer. I think this was the missing part for me: I didn’t know that the frontend could be built with files outside of its folder. I know, sounds dumb, but now I know :stuck_out_tongue: