neft-dev
v0.9.13-dev8
Published
JavaScript. Everywhere.
Downloads
3
Maintainers
Readme
Neft
JavaScript. Everywhere.
Native, Browser, Server
Manifest
- One Routing for all.
- Virtual HTML document for native.
- Abstract styles with platform-specified elements.
Why?
We ❤ ️JavaScript. It's simple to learn and widely supported language. Native apps need to be trully native - very fast and with platform-specified elements. If you have a native app, why not to reduce it and use like a mobile website? Have a mobile version of your website? Change few styles and prepare a normal website. Needs to be visible in Google? Run Node and serve HTML documents used in the client app for a better logic separation.
Now you know, why Neft was created - Don't repeat boring stuff. Focus on a client.
Supported platforms
- Node >= 0.11.14,
- Browsers (HTML5 or WebGL) IE >= 9,
- Android >= 2.2.0 (API 8),
- iOS >= 8.0.
What next?
Do you know JavaScript, CoffeeScript, C, Java or Swift? Help us and become a contributor. 🚀😃😎
Did you find a bug, have an idea for a new features or just you're pissed off at the documentation? Create an issue, write it on our Gitter or simply tweet us. 🤕🗣🚑💉
Links
Installation
npm install -g neft
Running
neft create MyApp
cd MyApp
neft run node
neft run browser
neft run android
neft run ios
License
Apache 2.0
Example
Routing
routes/index.js
var Dict = require('dict');
module.exports = function(app){
return {
'get /': {
getData: function(){
return new Dict({
clicks: 0
});
},
increaseClick: function(){
this.data.set('clicks', this.data.get('clicks')+1);
}
}
}
};
View
views/index.html
<body>
<p class="large" clicks="${data.clicks}">Clicks ${data.clicks}</p>
<button style:pointer:onClick="${route.increaseClick()}">+</button>
</body>
Styles
styles/view.js
Scrollable {
contentItem: Flow {
document.query: 'body'
}
}
styles/index.js
Text {
document.query: 'p'
property $.clicks: 0
background.color: 'yellow'
if (this.$.clicks > 5){
background.color: 'red'
}
}
for ('p.large'){
font.pixelSize: 23
}
for ('button'){
border.color: 'gray'
border.width: 2
}