https://github.com/typecode/gadgets-gizmos
Assorted demo GUI components to illustrate some basic frontend dev concepts
https://github.com/typecode/gadgets-gizmos
Last synced: 10 months ago
JSON representation
Assorted demo GUI components to illustrate some basic frontend dev concepts
- Host: GitHub
- URL: https://github.com/typecode/gadgets-gizmos
- Owner: typecode
- Created: 2019-10-21T23:16:08.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2022-12-31T03:58:35.000Z (about 3 years ago)
- Last Synced: 2025-01-24T16:14:59.514Z (12 months ago)
- Language: JavaScript
- Size: 1 MB
- Stars: 0
- Watchers: 4
- Forks: 0
- Open Issues: 23
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Gadgets & Gizmos
Assorted demo GUI components to illustrate some of the techniques that are important for building web app frontends, including encapsulation, loose coupling and composition, events, callbacks, event delegation, simple state management, etc. The implementation here is intentionally simplistic, and these demo components are limited, in an effort to show the basics without obscuring them behind a lot more code or powerful frameworks like React or Vue, or templating engines, or native web components, and so on. In other words, while one probably wouldn't build a professional production grade modern web application precisely in the way I've implemented these examples, one _would_ still employ and build upon the same foundational concepts, and ought to be able to work at this level in order to get the most out of more sophisticated tools and techniques. These examples should also begin to illuminate why more advanced concepts that haven't been applied, such as templates, two-way data binding, reactivity, virtual DOM trees, and more, are desirable in complex projects.
## To install and run the dev server
```
npm install
npm start
```
[localhost:8080](http://localhost:8080/) should automatically open in your default bowser.
_Bootstrapped using [webpack-starter](https://github.com/wbkd/webpack-starter)._