Using WebStorm with Parse.com - webserver

I'm completely new to web development including WebStorm, but I do know game development, and through that I've used Parse.com a number of times with iOS games. I know Parse has a JS SDK, but how would I use that with WebStorm? The whole web server is a bit unclear to me, does the web server with WebStorm automatically kick in for anything you publish? Or can you turn it off? Do I have to turn it off to work online with the Parse SDK?

If you're on a mac, below steps should work:
WebStorm → Preferences → JavaScript → Libraries → Add
Press on the + button and add the Parse JavaScript SDK.
You should now see the Parse SDK listed in the libraries.
Now to run the application locally:
Run npm install parse to install Node's Parse module.
Include var Parse = require('parse').Parse; in your main.js
Run → Edit Configurations and make sure that Node interpreter is set to /usr/local/bin/node.
Now use Run → Run 'main.js' to run your application.

you need to download the javascript SDK (parse-1.2.17.js) and configure it as a javascript library in WebStorm (Settings/javaScript/Libraries, Add...)
You don't have to use the built-in server if you don't need it. Just configure your own web server is settings/deployment, like it's shown in http://wiki.jetbrains.net/intellij/Remote_JavaScript_debugging_with_WebStorm_and_PHPStorm#Configuring_access_to_the_Web_server

Related

App Engine localhost publication from eclipse-photon

I had been working on Google app engine for some time with great success. However, recently I was forced to upgrade to Eclipse-Photon from Eclipse-Mars.
I can run a debugging version of the server on localhost:8080 just fine except when I change any of the TypeScript files. Formerly when I would run the TypeScript compiler to generate new JavaScript the server would automatically update the server. Now when I generate a new JavaScript file, the server continues to serve the old version. I have my expirations set to 0 and I have automatic publication turned on.
For a while I could make it work by telling the server to Publish. Now that has stopped working as well. If I save any file from inside of Eclipse I see a little message flash by indicating publication and then that file serves properly. If I load the generated JavaScript file and then modify it slightly then it will publish and serve correctly.
Obviously Photon is no longer tracking file changes that way that Mars did. I could easily copy the generated file to the correct place if I knew where that place was.
Are you running your TypeScript compilation from outside of Eclipse? If so, try doing a Refresh of your project. That should sync up Eclipse's notion of the filesystem state with what is on disk.
Cloud Tools for Eclipse relies on the Web Tools and Resources frameworks to determine whether a resource has changed and needs publishing. Eclipse is normally set up to detect resource changes automatically as configured by two options on the Preferences > General > Workspace preference page: Refresh on access and Refresh using native hooks or polling.

Aurelia + JSPM + Typescript browser-side debugging

I has been experimenting with Aurelia build options vis-a-vis development/build workflow. We have concluded that we prefer that developers test the web site while it is bundled, versus serving up all the individual files to the browser. Additionally, we are using TypeScript. And we want have the browser-side debugging experience provided by source maps. I am working with what will be a large application with many Aurelia components, so the few seconds for the page to refresh during the active development change/refresh or watch cycle seems like it will add up. And it seems that if developers are working in the bundles that bundling issues will be discovered immediately.
Using the Aurelia-cli (v23), and creating a new project using TypeScript, then building creates RequireJS bundles and source maps work for browser debugging. That is, after running au run.
Using the skeleton-typescript-webpack starter project (downloaded two weeks ago), then running npm start also provides browser side debugging of typescript of webpacked bundles.
Using skeleton-typescript which uses jspm and systemjs, running gulp serve-bundle does not provide client side typescript debugging. However, gulp serve does provides client side debugging, but the site is not bundled. The only difference between those gulp tasks is that the site is bundled, versus unbundled.
So it seems that typescript source map client side debugging of bundled sites will work with Aurelia-cli and webpack, but not with jspm.
Our project was started based on the skeleton-typescript. Before we refactor the build workflow, I have attempted to figure out how to get jspm to support typescript debugging on the browser.
I've hunted the web, but did not find any clear direction, and did much experimentation with configuration settings with a trial and error approach, but cannot seem to get a bundled jspm site to allow the client side typescript debugging experience.
Is this a limitation of jspm or systemJS or the Aurelia-Bundler? Or is there some configuration setting, in config.js or bundles.js, I need to add to the skeleton-typescript starter project to get this to work?
Maybe your are not getting access to source maps. I'm not sure, I remenber something about the way how source map are generated, (inline, file in a specific folder) and add mapping path in the server to make them acessible.
https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-typescript-aspnetcore/src/skeleton/Startup.cs#L69-L74

Ionic + IBM MobileFirst

I've found a few post on this topic but have not been able to find the best solution.
Attempted to integrate Ionic into IBM MobileFirst (Worklight).
At the moment - I have built a normal Ionic project and moved the WWW folder in the 'common' folder. Also added in the initOptions, main.js and messages.js.
MobileFirst has an awful build process - I hate having to deploy to a mobilefirst development server + preview app for any code changes. I am hoping to get some type of auto reload working within mobileFirst, or at least develop with ionic normally and hav ea job to bring my changes into my worklight project... something that is better than me current situation.
Does anyone have a sample project that actually auto-builds or picks up code changes automatically?
Any and all help is greatly appreciated.
Not sure what do you mean by "auto-reloading"; if you make any changes to the web resources to your project inside the Studio plug-in (in Eclipse) and reload the preview in the browser, it will show the changes.
You are not required to Run As > Run on MobileFirst Development Server for each change. As long as you work on the resources in your workspace, the "auto-reloading" as you call it, should work (make sure you are using the latest available MobileFirst Studio version from the Eclipse Marketplace).
There is also a rudimentary Starter Application that is based on Ionic.
You can download it from here.
There are also several results on the subject matter when searching in Google.
The need to rebuild in order to see changes in your Web components (CSS, JavaScript, HTML) did used to be an annoyance in early versions of what was then Worklight and is now MobileFirst. I forget when the need for a rebuild was removed but certainly in Worklight 6.2 and beyond you now simply need to refresh in your browser.
UPDATE: If using MobileFirst 6.3 you need to ensure that you are on a
suitable patch level. I find that simple refresh does not work in
6.3.0.00-20150106-1717, but if I update (Help->Check for Updates) to 6.3.0.00-20150214-1702 then edit/save/refresh works as
expected.
My personal practice is always to have Mobile Web environment in my project and then choose that from the Console. This loads the application in the browser-based Mobile Simulator that you can tailor to fit your target form-factor. This has a "Go/Refresh" button that immediately reflects your edits.
Alternatively, some folks these days do not use Studio, instead they use the Command Line Interfacer. Possibly this may be more to your taste. You can download it here.
there is a solution with using staff like ionic-cli serve command + symbolic links that will replace common folder.
check here an example https://www.dropbox.com/s/4pvaulo6yo47kb9/lab_7.2.mp4?dl=0
(you just can disable sound, cause i've recorded it in russian) 7-15 minutes of this video
Other option is to organize live-preview yourself using IDE features and/or nodejs
This will work as long as you are working on front-end (mostly non-worklight api) part.
You need to include this lines in the index.html
<!-- ionic bundle & css -->
<link href="www/ionic/css/ionic.css" rel="stylesheet">
<script src="www/ionic/js/ionic.bundle.js"></script>

Features and Configuration of the Typescript Eclipse Plugin

I'm interested in developing with typescript on linux. So I found the above mentioned plugin. I installed eclipse and also the eclipse-typescript plugin as described here. Now I can edit typescript files and see the highlighting. But it is not possible to debug a script. When I try to debug it, there is no debug configuration available.
Is the plugin able to debug a typescript?
I also read in this wiki, but this single page doesn't help me. I googled around and did not found any howto or help...
Thanks
Is the plugin able to debug a typescript?
It isn't supported. Based on my empirical (but certain) observation of : https://github.com/palantir/eclipse-typescript/tree/master/Bridge/src
You could debug the generated JavaScript though (and I highly recommend you do that anyways). And in fact learn to use google chrome debug tools (you'll thank me someday) since they have a live edit and continue, repl, profiler etc.
Alternatively you can try WebStorm which fully supports debugging TypeScript on linux.
At the same time, TypEcs (another TypeScript plugin for Eclipse) features debugging - http://typecsdev.com/. The plugin supports two modes of TypeScript debug:
Standalone: this mode is suitable for debugging server-side NodeJS applications written on TypeScript,
Web Remote: this mode is connected to Google Chrome web browser and allows you to debug TypeScript web application.
So you can try this one.

How can I run the example project of Google App Engine + GWT in Eclipse?

Ive installed the Google Plugin for Eclipse and created a demo project using App Engine and GWT. Now I want to launch and see it. But after compile nothing else happens. Shouldn't there be an integrated browser that shows the app?
You need to right click on the project name and hit run > web application. Compiling it is for deployment, and most likely not what your looking for from running. The key differences here are hosted mode handles the cross-compilation for you, while compiling is meant for deployment of the javascript to your web server.
As far as I know, you just point your browser (any browser) to http://localhost:8080. Is that not working for you?
I get it running externally on the command line with
dev_appserver .
or to upload to the google site
appcfg update .
for python they're .py files and for java their .cmd calls
wish I could mix and match my languages/GAE environments
You can right click your project and goto Run as > Web Application.
You can see that a local Jetty Server.
You can manually type the address http://localhost:8888 or you can access through cmd