Can you do Desktop Development using JavaScript?
Windows 8 allows for Windows Store Apps to be written in HTML5/JavaScript.
Creating Desktop applications that run on web browser
Many development models with web technologies exist, but they have different purposes and it all depends on what you want to do.
You seem to be mixing 3 models
Classic websites
A server (with PHP, Java or whatever) generates HTML.
A user uses a browser to access it.
When the user clicks somewhere, the server is called again and generates another HTML file.
Single Page Applications
This model is often used when writing websites that need a lot of interactivity. For example Gmail, or Google docs are SPAs (more or less).
SPAs are websites (you can access them at an URL) where all templating is done client side, and the webserver only exposes a HTTP API.
Most of the times, people use frameworks to make those like:
- AngularJS
- React
- Backbone
Desktop apps with web technologies
That's just coding an application that you can install on a computer or phone with web technologies (javascript, css, html).
There is no server.
Tools that enable programmers to do this are
- Node webkit (for desktops)
- Cordova (for phones)
- Many others
Most of the time, programmers also use SPA tools in conjonction with those to help them during development
How to develop Desktop Apps using HTML/CSS/JavaScript?
You may start with Titanium for desktop dev. Also you may have a look at Chromium Embedded Framework. It's basically a web browser control based on chromium.
It's written in C++ so you can do all the low level OS stuff you want(Growl, tray icons, local file access, com ports, etc) in your container app, and then all the application logic and gui in html/javascript. It allows you to intercept any http request to either serve local resources or perform some custom action. For example, a request to http://localapp.com/SetTrayIconState?state=active could be intercepted by the container and then call the C++ function to update the tray icon.
It also allows you to create functions that can be called directly from JavaScript.
It's very difficult to debug JavaScript directly in CEF. There's no support for anything like Firebug.
You may also try AppJS.com (Helps to build Desktop Applications. for Linux, Windows and Mac using HTML, CSS and JavaScript)
Also, as pointed out by @Clint, the team at brackets.io (Adobe) created an awesome shell using Chromium Embedded Framework that makes it much easier to get started. It is called the brackets shell: github.com/adobe/brackets-shell Find out more about it here: clintberry.com/2013/html5-desktop-apps-with-brackets-shell
HTML, JS, and CSS Desktop applications
So, the main idea behind creating JS, HTML, CSS apps that feel native is to write some sort of desktop application with embedded browser control that runs your HTML and JS. Nowadays, there are a lot of different tools to do so and each of them offers unique capabilities.
- AppJS - a framework to build cross-platform desktop apps using JS, HTML, CSS. It uses Node.js as the backbone.
- Electron - much like AppJS but built on top of Chrome's V8.
- Chromium Embedded Framework (CEF) - a simple framework for embedding Chromium-based browsers in other applications.
- NW.js - an app runtime based on Chromium and node.js. You can write native apps in HTML and JavaScript with NW.js. It also lets you call Node.js modules directly from the DOM and enables a new way of writing native applications with all Web technologies.
Of course, there are a lot of other great tools.
Desktop application development with Javascript and HTML
I started looking into Titanium for desktop dev. I liked the concept but not the implementation. I then stumbled upon chromiumembedded and have been mostly very happy with it. It's basically a web browser control based on chromium.
http://code.google.com/p/chromiumembedded/
It's written in C++ so you can do all the low level OS stuff you want(Growl, tray icons, local file access, com ports, etc) in your container app, and then all the application logic and gui in html/javascript. It allows you to intercept any http request to either serve local resources or perform some custom action. For example, a request to http://localapp.com/SetTrayIconState?state=active could be intercepted by the container and then call the C++ function to update the tray icon.
It also allows you to create functions that can be called directly from javascript.
My biggest challenge has been debuging. It's very difficult to debug javascript directly in CEF. There's no support for anything like Firebug that I am aware of.
How to create website-based desktop application for Windows, Linux and MacOS?
Electron is a very popular approach for this sort of thing. Using front-end code (HTML, JS, CSS), you can construct an application (which essentially runs a webpage - or few) and then make it executable in any environment.
If you need any (privileged) backend code, you can write it in Node (in Electron's main process) and have it communicate to the page script through the preload script.
JavaScript desktop applications?
Latest .NET version doesn't have such feature, but you've options to do it:
a) A WebBrowserObject in a WPF or Windows Forms application (it'll be an embedded Internet Explorer).
b) Opera Widgets, which is a Opera browser-based presentation engine which lets you implement desktop applications with standard Web technologies and it follows the W3C widgets standard. These applications can run standalone, meaning that user won't need to open Opera to run them. There's a counterpart: Opera must be installed in user's machine.
There're other options like Mozilla XUL but its limited support for desktop application development would prevent you from using it.
Related Topics
JavaScript Number Split into Individual Digits
How to Set State of Response from Axios in React
How to Replace Selected Text with HTML in a Contenteditable Element
Rendering React Components from Array of Objects
How to Perform Flood Fill with HTML Canvas
Secure Random Numbers in JavaScript
JavaScript Runtime Complexity of Array Functions
How to Call Fromlatlngtodivpixel in Google Maps API V3
Vuejs and Vue.Set(), Update Array
Regex for Match/Replacing JavaScript Comments (Both Multiline and Inline)
How to Flatten Nested Array in JavaScript
Selecting an Element in Iframe with Jquery
Window.Print() Not Working in Ie
Jquery Equivalent of JavaScript's Addeventlistener Method
Difference Between Dom Parentnode and Parentelement
How to Overcome the Cors Issue in Reactjs
Fastest Way to Check a String Contain Another Substring in JavaScript
Puppeteer Page.Evaluate Queryselectorall Return Empty Objects