ZephJS is often called just "Zeph" and pronounced "Zef".
ZephJS aims to bring the promised ease of web components back to the community. It does so by living up to the following principals:
ZephJS has the following features...
ZephJS has four different use cases that are addressable as one gets started:
Pick the best way to get started for you and start using ZephJS today!
ZephJS Provides a ton of documentation to help you use it...
Command Line Tool
ZephJS ships with a little command line tool (CLI) to help with your ZephJS related needs. This is installed locally when you install ZephJS via npm and can be accessed with the shell command
zeph. It has the following syntax:
There are a number of commands you can do. Very quickly:
hello: Generate the example hello world application.
create: Create a new component including .js, .html, and .css stub files.
serve: Run a small Web Server on http://localhost:4000 that will serve the current directory.
bundle: Bundle multiple ZephJS components into a single file.
For more information, see our documentation on the Zeph Command Line Interface.
ZephJS ships with a set of examples for your reference.
BasicComponent: An example of a basic component.
HelloBadge: A slightly bigger example of a component which uses a second component.
ExampleCollection: An example of grouping several components together into a single file, called a collection.
ExampleService: An example of using the ZephService class to build a re-usable service.
RatingStars: An example of using resources and bundling.
ZephJS is built on modern browser standards and thus requires a modern browser to work. In particular it requires the following Web Standards: Shadow DOM v1, Custom Elements v1, Mutation Observer, and Fetch.
The following browser compatability chart indicates which browsers are supported and which are not. (All browser statistics taken from caniuse.com and used under the conditions of thier license.)
|Browser||Minimum Required Version||Notes|
|Safari||10.1||:host and ::slotted psuedo-selectors are buggy.|
|Microsoft Edge||15 (with Polyfill)||Requires use of Polymer polyfill. See ZephJS Polyfill Documentation.|
|Microsoft Internet Explorer||NOT SUPPORTED|
|IOS Safari||10.3||:host and ::slotted psuedo-selectors are buggy.|
|Blackberry Browser||NOT SUPPORTED||No support as ov v10.|
|Chrome for Android||71|
|Firefox for Android||64|
|IE Mobile||NOT SUPPORTED||No support as of v11|
|UC Browser for Android||11.8|
|QQBrowser||NOT SUPPORTED||No support as of v1.2|
|Baidu Browser||NOT SUPPORTED||No support as of v7.12|
(Chart last updated Feb 25, 2019)
ZephJS is written and maintained by The Awesome Engineering Company. The Awesome Engineering Company believes in building clean, configurable, creative software for engineers and architects and customers.
To learn more about The Awesome Engineering Company and our suite of products, visit us on the web at https://awesomeeng.com.
If you need help working with ZephJS, please do not hesitate to reach out for help. Submit an issue with your help request and we will answer as quickly as we can!
Also, if you find any bugs or typos, please make sure to submit an issue as well.
ZephJS is released under the MIT License. Please read the LICENSE file for details.