I want to convert an Angular JavaScript app into a native Windows application but I don't know how to do it. I heard that electron could be used for this but I don't know how to use electron.
Despite electron there is another solution called nativefier. It is actually quite simple and you don't have to learn a new framework like electron.
As the comments pointed out already, this is not possible.
Why?
JavaScript can't run directly on the machine, neither do HTML and CSS. You need a browser that can understand those languages and turn them into commands your computer can understand.
So your only way to run an Angular App without using chrome or Firefox or whatever browser, is Electron. It's basically a chrome browser plus your custom Angular app packed into an exe. So under the hood, it really just runs your code in a browser environment, but you have more control over it and no address bar etc.
My main experience with developing in Visual Studio is as c#/c++ developer. But now I need to create html+css+javascript front end for [probably] PHP code, and I've heard that Visual Studio has pretty nice capabilities in that range, including debugging javascript.
However, I can't find anywhere a "web" project (except for the ASP.Net stuff, which I'm not sure that it is the right thing).
Here's what I think I need to do:
Create html file
Create css file
Include a bunch of javascript libraries
Write my own javascript code
Press F5 and debug the code in different browsers.
I'm mainly interested in intellisense, not a visual editor.
Is Visual Studio the right IDE for this kind of web development? And if it is, how do I set up the kind of project I described above?
I think the instructions at How do you add a folder to a project in Microsoft Visual Studio Express 2012 for Web? might work for setting up a Visual Studio project:
1) New blank solution
2) Right click on the solution and select Add existing website
3) Browse and select the folder with your html, css, javascript, etc. files
4) Right click on the page you want it to start on and select set as start page
As for running against different websites, you might try a Visual Studio extension. A decent starting list is here: http://www.asp.net/mobile/device-simulators
I have read tons of articles and stackoverflow questions but I seem not get it to work.
I want to distribute some product information for a customer which will be send out on a CD or USB stick. Back in the days I did it with Flash. Because flash could compile into a EXE called Flash projector and could run my Flash content without installation.
Now I want to give HTML5 a spin. And I need a way to pack everything on a CD an make it run everywhere without installation.
I heard something that I could compile chromium and embed it in a c++ application. (http://code.google.com/p/chromiumembedded/)
I could use QT with QtWebkit. (http://developer.qt.nokia.com/doc/qt-4.8/qtwebkit.html)
I could compile Webkit and embed it in a c++ application... (http://www.webkit.org/)
The examples are to big and I do not have any C++ skills =(
Then there are projects like mozilla chromeless (http://mozillalabs.com/chromeless) (and berkelium (https://github.com/sirikata/berkelium)
With chromeless my JQuery Javascript did not work and Berkelium... I did not get to compile...
I have no budget for http://www.appcelerator.com/ or other paid/commercial options... (also Flash/Air and Silverlight are not an option). Because Content should also be deployed on the web server without the use of plugins ...
I do not need any access to the OS. What I want have my Jquery/Backbone app which consumes JSON files to run in a desktop client without installation.
So no browser adressbar just pickup the index.html and everything else is handled by the app...
Something like Fullscreen and Close would be nice...
Unfortunately I cannot rely on the installed browser of the "customers OS" because the target group is to large and I expect alot of old browsers.
Can anyone give me instruction how to compile "easily" an app which makes my web app stuff running on the desktop from CD without security warnings, etc?
Or are there any pre-compiled packeges that I could use?
Node-webkit combines the Chromium (Chrome) browser with Node.js. As I understand it, you don't need the extra APIs, but you don't need to use them, simply creating a really short json file and zipping up your project is enough, and you can even combine everything into a single executable. The project provides binaries, so no compiling needed.
https://github.com/rogerwang/node-webkit
I also tried Awesomium(it's c++ and 40mb+) PyWebKit(did work but my svg mousemove-listeners didn't) therefore ended up using cefpython and pyinstaller.
Here's what I just did to get a "one-click-windows-web-app-executable".exe.
downloaded cefpython , it comes with a compiled dll with chromium inside (20mb)
run "python cefsimple.py" to see if it's working (it should)
now download pyinstaller
unpack if to some folder
copy all the files of cefpython to you newly created pyinstaller-folder
copy from pyinstaller/utils MakeSpec.py and Build.py one folder down
run "MakeSpec.py cefsimple.py" to create a cefsimple.spec file for the built
If you try to run "Build.py cefsimple.spec" if will copy the files to a folder called dist
if you run the exe it won't work, because some dlls and an icon are missing
lets add the dlls by changing the spec-file (I put it later in the text)
is you build it again, it will copy the icon and everything else to the folder so that the exe will run (you'll see cefsimple.html in a real embedded chromium frame)
now you can play around either with the embedding or the pyhton-code to fix your http-links and you'll get a fine "one-click-windows-web-app-executable" :-) (see --onefile option in pyinstaller docs)
cefsimple.spec:
# -*- mode: python -*-
a = Analysis(['cefsimple.py'],
pathex=['c:\\pyinstaller-2.0'],
hiddenimports=[],
hookspath=None)
pyz = PYZ(a.pure)
exe = EXE(pyz,
a.scripts,
a.binaries,
[('icudt.dll', 'icudt.dll', 'BINARY')],
[('avcodec-54.dll', 'avcodec-54.dll', 'BINARY')],
[('libEGL.dll', 'libEGL.dll', 'BINARY')],
[('avformat-54.dll', 'avformat-54.dll', 'BINARY')],
[('avutil-51.dll', 'avutil-51.dll', 'BINARY')],
[('d3dcompiler_43.dll', 'd3dcompiler_43.dll', 'BINARY')],
[('d3dx9_43.dll', 'd3dx9_43.dll', 'BINARY')],
[('libGLESv2.dll', 'libGLESv2.dll', 'BINARY')],
[('locales\\en-US.pak', 'locales\\en-US.pak', 'DATA')],
[('icon.ico', 'icon.ico', 'BINARY')],
a.zipfiles,
a.datas,
name=os.path.join('dist', 'cefsimple.exe'),
debug=False,
strip=None,
upx=True,
console=False, icon='icon.ico' )
app = BUNDLE(exe,
name=os.path.join('dist', 'cefsimple.exe.app'))
If it should run on any windows 2000+, no python, no system libraries, no additional dlls nor icons needed.
If you build it on Windows7 64 bit, it won't work on 32 bit systems
If you build it on WindowsXP 32bit it works everywhere. Even in Wine. But somehow I couldn't get the icon out of the exe for the titlebar. had to load it from external(code in cefwindow.py).
Ask me for details while it's still fresh!
EDIT:
to activate local json requests:
# BrowserSettings, see: http://code.google.com/p/cefpython/wiki/BrowserSettings
browserSettings = dict()
browserSettings["universal_access_from_file_urls_allowed"] = True
browserSettings["file_access_from_file_urls_allowed"] = True
For a good overview, check out this review article by Clint Berry. He covers TideSDK, AppJS, Node-webkit, Sencha Desktop and Brackets Shell, and lists pros and cons of each solution.
EDIT: After having read the review, I chose Node-webkit for my own project, and it works great! It does not require you to build the app according to any specific paradigm. I just took my standard AngularJS web app as it was, added the required manifest file, and built it for Windows and OSX.
as somebody mentioned in comments, you can use xulrunner
according to this: https://developer.mozilla.org/en/Getting_started_with_XULRunner
you just download xulrunner, unzip it in a folder,configure it and make it start in autorun.inf or something like that. no compilation needed (i presume you need to present it on windows, but other platforms should not be a problem as well).
i made an application for HTML5 games developers , if you want to run your html5 games or apps on windows like native applications, no need for hosting or manually running a local server in order to access html5 features.
WinApps Jx Builder is an application that allow you to pack your HTML5, java script ,CSS into one Executable application for windows that run Native-Like on Windows OS.
From now on you will run HTML5 websites,applications,games on your Desktope with only double click, and WinApps JX will take care of the rest.
But you Need To install Google chrome frame on your machine :
google chrome frame
- WinApps Jx -
You can embed browser control in your C (WinAPI) program using IWebBrowser2.
http://github.com/dns/WinAPI-Embed-Browser/releases
I've created a project on github to make several html app pack into single EXE file.
To access html files from EXE/DLL resource use: res://programname.exe/test.html as path.
You also can hide the window border & just showing the content of your HTML app, or even running on fullscreen. This is very useful if you want to make interactive CD.
I'm an old Emacs user - I've used it for about 10years now. When I switched to Mac I started to use Aquamacs, which is great in many ways.
But now most my development work involves Node.js/Express.js (with JavaScript, Jade and Stylus). Unfortunately, emacs has many shortcomings in this regard. Especially when working remotely, with ExpanDrive and MacFUSE mounts.
And I really want real code folding.
Is there any editor which is really good for this? Even better is there any IDE for Mac (at all)?
Thanks
Sublime Text 2 is the choice of many. Add some packages to it with the package manager. Jade, stylus packages available.
A cheaper and more node-specific alternative to IntelliJ IDEA is Webstorm, also made by Jetbrains.
It has a lot of node goodies like the ability to attach to the node debugger and allow you to step through your JS code. It also has good code folding, which you can invoke with ⌘^- to fold and ⌘^+ to expand.
If you want a real IDE that works well on Mac OS X I would recommend IntelliJ IDEA. It has a JavaScript debugger and Node.js plugin.
If you are looking for something more lightweight than a full-blown IDE, take a look at Sublime Text 2.
You could try TextMate: http://macromates.com/
with the following bundles for
NodeJs: https://github.com/drnic/javascript-node.tmbundle
and for Jade: https://github.com/miksago/jade-tmbundle
For stylus you have to compile the bundle (haven't tried it yet): https://github.com/LearnBoost/stylus/blob/master/docs/textmate.md
There is also Cloud9 ide https://github.com/ajaxorg/cloud9, its actually a webapp, but its open source and can be installed locally (it still runs in the browser, but locally), I really like the debugging features
http://www.aptana.com/ is great, it has most of the eclipse features...
I thought PDT would do code assisting on JS files. Was I wrong, or is there a bug or something I am missing?
Is the Javascript development tools installed? I'm not sure, whether its installed together with the PHP Development Tools.
Select Help/Install new software, then select the Helios update site (http://download.eclipse.org/releases/helios), then install the Javascript Development Tools from the Web, XML and Java EE category.
Update: See the answer at your other question.
Got here because I had the same problem, first install "Eclipse web developer tools => javascript development tools"
Then instead of creating a javascript project create a "static web project". Right click the project in project explorer choose configure (in the bottom) make sure you add javascript support (if it's not there than it's probably already supported).
Under your project in project explorer there should be an item called javascript resources right click that and choose properties. If the browser libraries or ecma3 libraries are not there you can add them.