[Feedback wanted] Renaming files in starter projects to make it easier for new developers

Developers
1

Summary

I made a PR to make the starter project created from dfx new .... have a directory/file structure which is more user friendly to new people. Since this affects a lot of devs, I wanted to make sure I am not missing anything: Directory naming by dprats · Pull Request #2288 · dfinity/sdk · GitHub

Description

A few weeks ago, friends of mine were confused by some of the files and directories in the default hello project from SDK because they did not realize the project had two canisters, or that one was for frontend, other for backend. I have a PR that changes this but i want to summarize for visibility:

State of the world:

hello/
├── declarations/
    ├── hello/
       └── .did files
    ├── hello_assets/
       └── .did files
├── hello/  <---------------- this was confusing to people
│   ├── main.mo
└── hello_assets/ <---------------- this was confusing to people
    ├── assets/
         ├── CSS files
         └── Images
    ├── src/
         ├── index.html
         └── index.js

You can see the dfx.json attached as well which carries some of the naming.

Here is what my PR does:

hello/
├── declarations/
    ├── hello_backend/ <---renamed
       └── .did files
    ├── hello_frontend/ <---renamed
       └── .did files
├── hello_backend/  <---renamed
│   ├── main.mo
└── hello_frontend/ <---renamed
    ├── assets/
         ├── CSS files
         └── Images
    ├── src/
         ├── index.html
         └── index.js

Follow up on docs

If this PR works for folks, I will of course update the docs as well

6 Likes
2

Mostly looking for anybody to point out any gotchas I may have missed

3

cool :+1:. why not not prefixing hello_backend and hello_frontend subfolders to make it even shorter and more generic - i.e. backend and frontend? doing so when we switch between project we would also find the same structure and naming of the root folders.


hello/
├── declarations/
    ├── backend/ <--- shorter
       └── .did files
    ├── frontend/ <---shorter
       └── .did files
├── backend/  <---shorter
│   ├── main.mo
└── frontend/ <---shorter
    ├── assets/
         ├── CSS files
         └── Images
    ├── src/
         ├── index.html
         └── index.js
4 Likes
4

That’s a good idea.

Pro:

  • simpler
  • similar structure across projects

Con:

  • does that give people the wrong mental model? This makes it look like it’s one canister when it’s actually two. Wdyt @peterparker ?
5

Side note: one thing that hurts my soul is how there is a /src embedded within /src. Reminds me of complex node.js apps with apps within apps.

(Different problem entirely, out of scope)

6

yes and no. to some extension the frontend can ultimately be hosted elsewhere - not on a canister - too. also not sure using the project name to prefix the names strengthness the mental model.

but it was just a suggestion, I welcome the idea to not have hello_assets anymore.

I missed that one, in which folder there is /src/src?

1 Like
7

When you create the project, at the root you get a /src directory which contains another /src directory a few levels down.

Essentially, /src/…./src.

1 Like
8

Ha yeah, it hurts my feeling too :stuck_out_tongue_winking_eye:. Just had a look to a mono-repo of a friend, he used apps to overcome this issue.

apps/
    api/src
    client/src

but rather like your approach, flat is nice.

1 Like
9

Could this give the impression that it’s impossible to have multiple front-/backends in the same project?

2 Likes
10

Good point. The same question is valid for current structure too, as the backend code is currently generated in src/name_of_project.

If we would use plural, it can maybe look like following?

backends
    main
       main.mo
frontend
    project_name (or dapp)
         src

But do really most of the developers need a starter kit that handles multiple frontends? I tend to think that not. So

backends
    main
       main.mo
frontend
    src

But then there is a plural and a singular which give the impression you cannot have multiple frontend.

or (thinking at it now)

canisters
    main
       main.mo
    dapp
       src

but feels like from all of these, actually, backend and frontend at the root are the most comprehensive for newcomer. there might be other questions but at least it feels clear where to start I would say.

3 Likes
11

Follow up:

This was finally executed and merged here: feat: rename canisters in new projects to <project>_frontend and <project>_backend by dprats · Pull Request #2311 · dfinity/sdk · GitHub

2 Likes