istesequi
Version:
Lightweight and intuitive javascript library
104 lines (91 loc) • 4.03 kB
text/jade
extends layout
block content
header.hero
.cover.color
.cover.cloud
.cover.city
.cover.rain
div.wrap
div.content
h1 Umbrella JS
p.slogan Tiny and intuitive javascript library
pre.install bower install umbrella
a.button.icon-link(href="http://www.jsdelivr.com/projects/umbrella" target="_blank") CDN
= ' '
a.button.icon-download(href="umbrella.min.js" target="_blank" download="umbrella.min.js") Download
= ' '
a.button.icon-jsfiddle(href="https://jsfiddle.net/franciscop/mwpcqddj/" target="_blank") Try it
a.keepgoing(href="#go") ▼
main
section.row#go
div
:markdown
## Intuitive and Documented
It is <strong>strongly influenced by jquery</strong> so there are many similar methods and you'll feel at ease developing with Umbrella.
However there are also some improvements to make your code intuitive such as ajax(). It's all detailed here:
a.button.icon-doc(href="documentation" target="_blank") Documentation
div
pre
code.language-javascript.
// Simple events like jquery
u("button").on('click', function(){
alert("Hello world");
});
// Send form through ajax when submitted
u('form.login').ajax(function(err, res){
window.href = '/user/' + res.id;
});
section.row
div
:markdown
## Tiny and Clear
**2kb** when gzipped means it will load in a snap on mobile. The core is reusable so new features are also tiny.
You can see two features of Umbrella JS source code on the right, or check it all on github:
a.button.icon-g(href="https://github.com/umbrellajs/umbrella" target="_blank") Source on Github
div
pre
code.language-javascript.
// Add child after all of the current nodes
u.prototype.after = function(text) {
return this.adjacent('afterend', text);
};
// Check if any node matches the selector
u.prototype.is = function(selector){
return this.filter(selector).nodes.length > 0;
};
section.row
div
:markdown
## Tested and Performant
The speed is similar to jquery and there are many tests, including performance ones.
They run on development, on deploy and live in different browsers so you know everything will work as expected:
a.button.icon-ok(href="tests" target="_blank") Tests
div
pre
code.language-javascript.
it("can select by class", function() {
expect(u('.demo').nodes.length).to.equal(1);
});
it("can select the children of ul", function() {
var ul = base.find('li').closest('ul');
expect(ul.nodes.length).to.equal(1);
});
section.row
div
:markdown
## MIT License
If you love something set it free. This license allows you to use Umbrella JS in a broad variety of projects.
a.button.icon-info(href="https://github.com/umbrellajs/umbrella/blob/master/LICENSE" target="_blank") MIT License
div.thanks
:markdown
## Special Thanks
- [Contributors](https://github.com/umbrellajs/umbrella/graphs/contributors) for helping Umbrella to improve
- [You Might Not Need jQuery](http://youmightnotneedjquery.com/) for its *awesomeness*
- [Picnic CSS](http://picnicss.com/) for making the website look alive
- [Browser Stack](http://browserstack.com/) for cross-browser checks
- [Can I use?](http://caniuse.com/) for compatibility checks
section.row
div.love
div With love,
a(href="http://francisco.io/" target="_blank") Francisco Presencia
script(src="umbrella.min.js")