Skip to content

Conversation

@kabaros
Copy link
Contributor

@kabaros kabaros commented Jan 5, 2026

This PR updates the npm-create command used to scaffold a new DHIS2 web app to change the default template, and add more options and flexibility.

The changes fall into two categories:

  1. The new templates: right now, there are two templates but the same mechanism can be used to add more.
  2. The way scaffolding works under the hood

You can test these changes from alpha channel of the CLI with npm create @dhis2/app@alpha

The new templates

This PR updates the default template that is provided out of the box to give a starting point that is more helpful, and less basic, than the previous version. These templates (and the defaults) are a result of conversations with the Dev Champions, and own experience of the amount of work we seem to have to do with the previous default templates to get them to a reaonsable working state.

The defaults aim to give a better starting point without being too opinionated, but also be pragmatic and use the template as a way to promote the rest of our app-platform eco-system - it's a lot of unnecessary work to get basics like the UI library and runtime query figured out right now.

Default template

The default template now shows:

  1. A list of data elements - the most basic action any new project would do is to list some metadata. Doing that is not intuitive enough in our stack, and providing one example of such an operation seems like a good place to start.
  2. Links to the documentation for the platform and UI library.
image

Like before, it allows choosing a package manager pnpm (default), npm or yarn, and a choice between TypeScript (default) and JavaScript.

In addition, it uses some of the features of the platform by default:

  • Installs and uses @dhis2/ui library to display the list of data elements
  • It sets up prettier, and eslint (and uses the shared configs for DHIS2)
  • It extends vite config, and configures @ aliases.

Secondary template (with react-router)

In addition to the basic template, there is an additional template with React Router.

image

Changes to how it works

ToDO.. add more details

The PR also changes how things work under the hood - this is less important imo, and I am happy to change it back if we still see a value in keeping and updating d2 app script init for example. These are the changes :

  1. Decouple from app script init - the logic to scaffold was moved to the npm-create CLI directly. This seems to me just another unnecessary level of indirection - we can keep app script init for backwards compatibility, but it's much simpler to have the scaffolding logic, and easier to work with, directly in the module now responsible for scaffolding new apps.
  2. Starting with a zip file for the template - these can be generated with git archive (more info to follow)
  3. Having typescript as the default (then using tsc to generate JavaScript from it)

@sonarqubecloud
Copy link

sonarqubecloud bot commented Jan 5, 2026

Quality Gate Failed Quality Gate failed

Failed conditions
9 New issues
9 New Code Smells (required ≤ 0)
1 New Critical Issues (required ≤ 0)

See analysis details on SonarQube Cloud

Catch issues before they fail your Quality Gate with our IDE extension SonarQube for IDE

@kabaros
Copy link
Contributor Author

kabaros commented Jan 6, 2026

supersed by #635

@kabaros kabaros closed this Jan 6, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants