Exercise No. 2 - Lit Web Component

Exercise notes:

• Around 24 hrs spent
• Used Chart.js to display the graph layout
• The component is isolated generating its own data, but that can easily change later on if wanted, we can pass in props as the entry point
• Some time was spent looking at the litElement documentation and seeing how it works
• Deploying the component and making it actually work w/ next.js there were some dif there

How to Install

From inside your project run

npm i score-tracker-demo

Usage

<script type="module">
    import 'score-tracker-demo';
</script> 
<score-tracker-demo><score-tracker-demo/>

React Integration: there is several ways but by far the easiest is to install reactify-wc

import reactifyWc from 'reactify-wc';
import 'score-tracker-demo';

const ScoreTracker = reactifyWc('score-tracker-demo');

Dev

To run the project for development run: npm run serve

Go to: localhost:8000/dev/index.html