In this little tutorial we present you a trivial sample application in 7 incremental steps. The steps 1 and 2 are still bad code which you never should write, but which allows you to understand the functionality and result and let you approach our final structure. In step 3 we kick in the component system but are still incomplete from a functionality point of view. In step 4 we are functionality wise complete and in step 5 to 7 we use more and more features of the component system to even better structure our application. Each step contains the complete sources but the differences to the previous step are highlighted.
From a domain-specific point of view the sample consists of three optical components: an outer "panel" component d0, an inner "select" component d1 and an inner "detail" component d2. The dynamic behaviour is: clicking into d1 triggers a background color toggling in d2. This intentionally is just an ultra trivial functionality and optical presentation, because it should illustrate the underlying use of a component system only.
index.jswhich is like
index.htmlbut can be directly executed in batch by Node.js. And in