@assecosolutions/fox-badge

🦊 Fox - Future Open Experience

This monorepo is the home of all applications and libraries build by the 🦊 Fox team.

Tech Stack - From Web-Components to Dev-Containers

In the following sections we describe our tech stack and how it all fits together.

Web-Components

We are using Lit-Element and Lit-HTML to write web components. Web Components enables us to ship cross browser compatible, framework / library independent and reusable custom elements. All of our web components are used within our very own applications and are well tested. If you would like to use one of our components just add it as follows e.g. npm install @fox/button --save or yarn add @fox/button and you are good to go. You can find an overview of all our available components in our Storybook.

Angular

As an engine for our applications and to bring our web components to life we decided to go for Angular. Angular is a web application framework / platfrom which is developed by google, and provides everything needed to build robust enterprise web applications.

Monorepo with Nx Workspace

Nx-Workspace and its sophisticated tools enables our team to manage the complexity of having all of our application components in one giant git repository. This approach, called monorepo, was inspired by google and comes with a lot of advantages:

1. Increase Visibility

• In a nx workspace project a change of a library directly affectes all of its consumers
• API contracts are clearly visible for all participants

1. Reuse Code Directly

• No need for usage of npm link or additional build pipelines.

1. Consistency of version Numbers

• One package.json for all your applications and libraries

Furthermore you can even build multi framework or fullstack applications side by side all in one nx-workspace. To get more insights on nx-workspace please see the documentation of nrwl.

Dev-Container

To decrease time for dev machine setup to a minimum and to prevent complicated os specific installations we leverage Docker and VS Code to make it a breeze to get your dev machine ready to code. Just install the Remote Containers extension for VS Code and you are ready to contribute to 🦊 Fox. For more information see the documentation about Dev-Container.