Ionic + IBM MobileFirst - ionic-framework

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>

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.

Can a gwt app be converted/packaged as windows universal app?

I have a gwt developed website that already runs 100% client-side (by which I mean no server-side javascript is used)
As one of the options for windows universal app development is javascript, is it possible to somehow turn a online gwt app into a offline uwp one?
I am aware there are solutions to package websites together with browser+installer, but if windows can run js 'natively' now (I assume via Edge) it seems a better route.
You can use UWP Javascript project from Visual Studio. This project allows you to add any HTML/CS/JS requires files. You can also use the Hosted model, where your files are downloaded from a URL (but then the app will require connectivity).
I've not tried the scenario, but I don't see any impediments, it should work.

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

How to preview my site in AEM 6.0?

I just started to get my head around AEM 6.0 . Installed an app with 'mvn clean install -Pauto-dev-deploy'. I can see the app in CRXDE and the packages are visible in the packagemanager. It does not however show up in the touchUI. Is it possible to run a preview of this site and how to do it?
In Adobe Experience Manager your application (app) and your content are to different things. Your application contains templates and components with which you build your content.
Deploying your app therefore means that you don't necessarily will have content. Without having a look at your source it is hard to see how and where you can create content. Usually your apps templates and components only work in certain content paths. This is usually defined in /etc/designs/<your-project-name>
If you are running AEM 6.2 I suggest that you have a look at the new We Retail demo application and demo content. The source of which can be found on Github: https://github.com/Adobe-Marketing-Cloud/aem-sample-we-retail

Create GAE eclipse project

I have installed Eclipse Java EE Luna Release (4.4.0) and App Engine SDK 1.9.10
I have created a new Google - Web Application Project and selected the Generate Project Sample Code option. I changed nothing about the project.
The generated project successfully deploys and runs locally. However when I deploy this to AppSpot I get an error message "Remote Procedure Call - Failure" when clicking on the "Send" button on the sample form.
Are there other steps I need to perform in order for the generated project to be successfully deployed to AppSpot?
My goal is to have a starting application that deploys so I can start learning to use Objectify and GWT to build applications. If there is a better way to go about this please suggest it.
Kind regards
Sean
I think seem to remember that sample code for the GWT builds a RPC-based HelloWorld or greeting example. In the auto-generated sample interface you type a name, a RPC call is made to server side and you get "Hello"+yourName or similar as a callback.
Check this link:
http://www.gwtproject.org/doc/latest/tutorial/appengine.html
This is a more advanced app, StockWatcher, from the GWT tutorials which is also RPC based and adapted for the GAE. You could start here: http://www.gwtproject.org/doc/latest/tutorial/gettingstarted.html to build this app (is really easy) and follow to the link above to deploy StockWatcher on the GAE, or check directly the steps on the first link and try to deploy the GWT "Greetings" example.
If you have already tried this or you do and there's still a problem, please provide the full stack trace, or the code you think might be causing the problem, so we have a better insight of the problem.