# Introduction

## What is Concorde ? 

Based on **[lit.dev](https://lit.dev)**, Concorde is a collection of webcomponents made to build shared apps or websites.  
Develop user interfaces without thinking about the implementation context, where everything is scoped, but preserving graphic consistency by setting the strict minimum of css variables.

## Why and use case

In 2022, Supersoniks wanted to create a new version of his ticketing app, in production un nearly 100 websites. We needed shared components which could be implemented in mobile apps, modern websites, and also old ones made in php, without bundlers or whatever.  
Instead of building a new app for each type of project, which would become impossible to maintain, we've decided to create one app, composed by a few webcomponents wich could easily be recomposed on any website.
Webcomponents appeared to be a the perfect solution to guarantee that compatibility with all past, present and futures environment, and lit seemed to be the best choice to build them.

### Stack

* Lit
* Typescript
* Vite
* Tailwind, not in the core, but in the starter kit

### Functionnal features and components

* Data management with Publisher / Subscriber pattern
* Form management
* Fetching data, lists, queue with lazyload
* Data binding
* Simple router, state component, ...
* And all ui component, with status variants to build an app with a consistent design


## Start a new project easily 

A new project with Vite, Typescript and Tailwind already configured and a simple example of a subscriber component : 

<sonic-code language="bash">
  <template>
  npx @supersoniks/create-concorde-ts-starter "project_name"
  </template>
</sonic-code>