Use an Angular App, version 17+, if possible no additional frameworks or libraries to display an arbitrarily deeply nested object. Think of two parts of the app: one offers the object (e.g. as a result of a form, an API Call or a method => you can hard code your object there), the second one is used to display the result.
Example object:
{
a: true,
b: 44,
c: 'Hello, Klicktipp!',
d: {
e: 'I am a nested object with strings!',
f: {
g: {
h: {
i: 'So am I!',
j: false,
k: 123,
l: 'And I am last!'
}
}
}
}
}
Use appropriate types of form elements to display the values: e.g. check boxes for boolean
Additional: try to style the UI in an appealing manner - SCSS/SASS/LESS (including frameworks) is allowed.
✨ This workspace has been generated by Nx, Smart Monorepos · Fast CI. ✨
Enhance your Nx experience by installing Nx Console for your favorite editor. Nx Console provides an interactive UI to view your projects, run tasks, generate code, and more! Available for VSCode, IntelliJ and comes with a LSP for Vim users.
Run npx nx serve kt-angular-ce to start the development server. Happy coding!
Run npx nx build kt-angular-ce to build the application. The build artifacts are stored in the output directory (e.g. dist/ or build/), ready to be deployed.
To execute tasks with Nx use the following syntax:
npx nx <target> <project> <...options>
You can also run multiple targets:
npx nx run-many -t <target1> <target2>
..or add -p to filter specific projects
npx nx run-many -t <target1> <target2> -p <proj1> <proj2>
Targets can be defined in the package.json or projects.json. Learn more in the docs.
Nx comes with local caching already built-in (check your nx.json). On CI you might want to go a step further.
Run npx nx graph to show the graph of the workspace.
It will show tasks that you can run with Nx.