for Mac, Windows and Linux. HTML5, Javascript and CSS3 plus the power of Python, Ruby or PHP when you need it.
Because it is simple and yet powerful. Using AppJS you don't need to be worry about coding cross-platform or learning new languages and tools. You are already familiar with HTML, CSS and Javascript. What is better than this stack for application development? Beside, AppJS uses Chromium at the core so you get latest HTML 5 APIs working. So relax and focus on the task your application should do.
AppJS allows you to use HTML 5 APIs to create attractive applications from Word Processors to 3D Games. You are no longer limited to default GUI widgets that plaforms force you to use. Creating custom UIs is now only limited to your imagination!
Using CSS you can decorate widgets as you like. Create a custom widget in HTML and complete your work with decorating it. Adding shadows, animating elements and transforming objects in 3D space are a few examples of what you can do with CSS 3.
The interesting part of AppJS is that it uses Node.js as the backbone. Node.js has been built to ease the process of developing scalable network applications. But today, you can see Node nearly everywhere! It has a nice API and lots of modules.
Make sure you have the latest Node.js installed.
Before you continue, install node-gyp using npm (node's package manager).
$ npm install node-gyp -g
Again use npm to install AppJS.
$ npm install appjs
AppJS tries to install dependencies based on the platform you are working with.
Now you are ready to develop your first desktop application with HTML/assets/css/JS! Create a file named app.js. Open it with your favorite editor and start coding:
/** * Begin by requiring appjs. appjs object has only one function that initializes everything you need. **/ var appjs = require('appjs'); /** * We will use window and app variables later. * settings is the object that you will use to set window properties like width or height. * There are more options like disabling chrome (frame around the window) or enabling fullscreen * mode but we don't need them. **/ var window,app,settings = { width: 800, height: 600, autoResize: false }; // Initialize application. It tells appjs that you are going to start desktop application. app = appjs.init(); /** * This event is fired when window is ready to show up. Calling window.show() before this event * causes exception. **/ app.on("window_ready",function(){ console.log("Event WindowReady called"); window.show(); }); /** * use a static router to serve html, css and javascript files that are in public folder. * appjs uses your routers when you request a resource with appjs:// custom scheme. **/ app.use(app.staticRouter('./public')); /** * There are other routing functions that you can use like `post`, `get` or `all`. **/ app.post('/',function(req,res,next){ res.send(200,'Hey! How are you '+req.post('firstname')); }) /** * Create a window and point it to htt://appassets/js/. This url is a special url. It is not a http * request. AppJS manages these requests manually using routers you defined. **/ window = app.createWindow("http://appassets/js/",settings);
Create a folder named public
and create a html file named index.html
inside it. Open index.html
in the editor. We want to create a form to submit first name and last name.
<!doctype html> <html> <head> <title>Hello World!</title> </head> <body> <form action="/" method="POST"> <input name="firstname" type="text" placeholder="Firstname"/> <input name="lastname" type="text" placeholder="Firstname"/> <input type="submit"/> </form> </body> </html>
Now everything is ready. Open terminal and navigate to your project directory.
$ node app.js
You will see a window that asks you for firstname and lastname! Fill the form and click submit. AppJS routes the request to post router at line 42 of app.js
. We process the request and send response.
It was a simple application to show how AppJS works. For more detailed information read the documentation
AppJS is a work in progress and needs a lot of improvement. There are unimplemented stuff waiting for your help! You can find them at github issue tracker or read the code and find @TODO tags! You can also subscribe to the development mailing list where we talk about AppJS features.
There are two areas you can help. If you code in C++ try to implement features that are only supported in one platform or two. We need all three major platforms to work (Mac, Linux and Windows). If you are professional in Javascript and Node.js then you can help us by implementing JS wrappers for C++ APIs.
To start contributing, fork git repository from github, clone the forked repository and make your changes according to instructions below. Then send a pull request. We discuss changes you have made. After that you can see your changes merged in the main repository!
Please follow the guidelines below before making any change to source code. Otherwise we can not merge your pull request.
Fixes #111 Describe what changed in this commit here.
AppJS should be used as a module for Nodejs. If you have npm
installed then downloading AppJS is easy:
$ npm install appjs
There is no tarball at the time. We are working hard to make them available.