Frontend Demos

The purpose of this Project is:

• accelerate the implementation of new Projects
• standardizing and vetting of solutions
• improve the quality of the code
• documentation of current Guidelines
• example for new projects
• playground for our Trainees

We maintain demo projects for the following frameworks:

• Vuejs
• Angular
• React

The goal is not to "support" all the Frameworks that we can find but to focus our atention and expertise on the main ones.

Topics to be discussed

• Authentication
• Error handling
• Logging
• Usage of (high level) CSS frameworks.
  • Design Tokens
  • Styles Dictionary
• Usage of prettier
• Usage of ESLint
• Unified configuration of Prettier/ESLint/Editorconfig
• State Management
• Routing
• Folder structure
• API Client generation. OpenAPI.
• ARIA - Accessibility, Markup. When should you use a p, button or link?
• SEO - Search Engine Optimization
• CSP - Content Security Policy
• Translations (/translation engine)
• npm commands (run, start, deploy, etc.)
• Testdefinition (every new found bug results in a new test)

Folder Structure

DRAFT For a small to medium Angular application, look in this demo app angular.folder-structure