Hybrid android app code reuse for mobile web - java

I'm searching a way into world of hybrid mobile applications. I understand that hybrid android app uses some Webview which just shows HTML/javascript based webpage.
My background is maven, java, so for my application backend will be for sure in java, thats clear. But I'm not sure which way to go in case of the front-end and I have couple of questions emerging.
Can I somehow reuse the code between the android packaged hybrid app and the page served by the java backend for regular browsers(of
course without the android system function usage)?
Is it possible to manage it only via maven plugins or will I need to dig into npm, bower, grunt and such stuff(although I now lot of
them are already mavenized)?
Which js? framework to use? There are some already bound with cordova/phonegap(Ionic) and some that are standing aside(I like
Aurelia) which will probably be fine for web application, but for
android reusage it will not be easy to bound them with Cordova's
lifecycle. It is more about which kind not exactly about particular
.js framework selection. I.e. Can I just write some AngularJs
application for web and then extend it with Ionic?
I can imagine some structure like this in maven, note the communication to backend will be via WS
app-java-backend (is able to serve app-single-page-app)
app-single-page-app (this must support mobile and classical browsers)
app-hybrid-mobile (uses somehow the .js code from app-single-page-app)
UPDATE
Basically the question is about how to have common javascript base for hybrid app and same looking mobile page
UPDATE2
I can create mobile web app and then I will somehow bind with cordova. But how to do it properly using maven

You need to use cordova-cli to generate the project. Pay special attention to the create method and the --link-to option. that will allow you to use inside the cordova project the same folder that you use for the mobile site.
You do not need to do anything with maven by yourself as cordova can handle also other platforms than Android.

Hybrid Apps are based on HTML,CSS and Javascript. if you want to use your backend with the hybrid app you need web services/webAPI
so over all you need
Any UI Frame work like bootstrap/Ionic
Javascript Frame work like Jquery/AngularJs
and Web services to access backend

If you want to share code(front end HTML CSS ) between your web app and mobile app, you sure can do that. For example design a button and add some CSS to it. You can always reuse the same button CSS served from server to any front end client you want.
Try with just writing code for your project, later you will get hold of things , where and what component you can reuse. To keep this simple what you have asked is possible.

Related

Java/JSP : Making a executable Java working as webapp

I have a standard java project working local made by another person i know.
It's about data retrieving.
I need to develop a web app supposed to do the same thing but accessible by anyone via browser.
I CAN'T edit the code for that purpose, at least some implementation details. A kind of black box.
Can you suggest me the best approach to make a webapp based on a local executable app through JSP & servlet ecc?
Maybe you can try something like webswing.
What is Webswing ? Webswing is a web server that allows to run any swing application inside your web browser using only pure HTML5.
The best days of swing framework are gone. Desktop applications lost
popularity and everything is forced to be online and mobile. But what
about existing application? Using applet technology proved to be
insecure, rewriting the application to web technology is too
expensive. This is where Webswing can help you. With Webswing, your
application is securely running on server and user's browser only
displays the application window. All this without changing single line
of source code.

How can I use HTML & CSS to create the user interface for my java app?

I have just read this article: http://docs.oracle.com/javafx/2/webview/jfxpub-webview.htm It shows how to build a java app using the javafx library and also how to use some classes such as WebEngine and WebView to display a web page in the app, basically turning it into a browser.
Here is some relevant info from the article:
The embedded browser component is based on WebKit, an open source web
browser engine. It supports Cascading Style Sheets (CSS), JavaScript,
Document Object Model (DOM), and HTML5.
The embedded browser enables you to perform the following tasks in
your JavaFX applications:
Render HTML content from local and remote URLs
Obtain Web history
Execute JavaScript commands
Perform upcalls from JavaScript to JavaFX
Manage web pop-up windows
Apply effects to the embedded browser
I would basically like to entirely dispense with Java or JavaFX GUI tools, except for those required to display HTML and CSS, as described in the article, and build the entire user interface for my app in HTML and CSS. I would like various HTML buttons to cause events to transpire in my java code.
Does this seem like a good idea? And since it does seem like a good idea to me, I'm also wondering why would anyone ever use any other method to build a GUI in java.
I'm creating an entire desktop application with a single WebView, it is available at github. Basically it's UI is a single HTML file which links a dozen of JS files. To call Java from JS I wrap my requests into json and call a Java facade bean. It is also possible to call JS from Java in same fashion. Though it is possible to call Java directly by invoking a method on a Java bean with parameters of any type, I did have a few application crashes after which I decided to make it completely safe and stay with json. This app uses AngularJS and Twitter Bootstrap to render pages.
I had created a ticket in Oracle's JIRA for better Java integration (JSR-223) inside a WebView and their answer was it could be scheduled for Java 9.
The development is pretty fast, when the process is set up - it's hard to debug the app in the beginning because there is no debugger. Some top-level JS exceptions are not being caught as well. At the moment I'm having no issues with WebView in JavaFX 8. JavaFX 7 is unusable for me because of the problem with fonts.
Answering your last question - I have no idea, but the situation is completely the opposite. For some reason Oracle puts resources for JavaFX native components development, but not for better WebView integration.
You can use a MVC framework such as Struts2 or Spring MVC together with AJAX and build a user interface (the view component) completely with HTML/CSS. Sometimes, using a template engine such as FreeMarker3 also helps replacing default java rendering with pure HTML/CSS solutions.
Vaadin
Vaadin is a sophisticated servlet-based framework that creates server-side based apps that run your pure Java code while automatically rendering the user interface on the client side in HTML, CSS, and JavaScript.
You don't need to know about or do in programming in those web client technologies, Vaadin does all the web-related work for you. No web templates, no pages, none of that. Your Java code simply creates label, field, buttons, and layouts. Vaadin transforms those on-the-fly to be rendered in the browser. Pure Java on the server, no Java at all on the client/browser side.
Xojo
Vaadin is not "yet another web app framework". It really has no direct competitors in terms of architecture except the non-Java Xojo Web Edition which uses its own proprietary OOP language.
It looks a very good idea.
An alternative can be to use Jetty or a similar open source server but you have much more work to do for adapt it to your application.
An other alternative is to build a Java EE application but it is not so much agile for a simple web view of your app, Java EE gives you the possibility to build dynamic web pages using the Java Server Pages and manage the user requests using the Servlets but you have to submit to his structure and this is not useful for your easy application.

Android application development: java vs. jquery mobile

I'd like to build an android application for a school project but I'm a bit confused, I saw that i can build an application using Java or using Jquery mobile.
Do they have the same capabilities?
If i build an application using Jquery , can i pack it and have it installed like a java application (as apk) or is it only used for building websites?
If so, what tool do i use to pack it?
jQuery Mobile needs an intermediary framework that communicates between JavaScript and Java. PhoneGap is a popular one of these frameworks.
PhoneGap is also actively maintained and they roll out new versions almost every month.
The main reason to use PhoneGap/jQuery Mobile is that it makes development easy if you already know HTML/JS/CSS. Another great reason to use PhoneGap is that you can use your existing website as the base for native applications, yeah, plural, not just Android but also iOS, Blackberry, etc. It also gives you a pre-built UI with some widgets so you don't have to roll your own.
The jQuery Mobile documentation talks about some of the caveats to creating a native application with PhoneGap and jQuery Mobile.
I don't know what you have already tried or what your skill set is (based on your stackoverflow history you may know more about java than I do), but you would be best off just using the Android SDK. I was able to design and complete a custom business project and learn java while doing it. I can't comment much on jQuery since I've never used it. jQuery seems like it might be a nice for the reasons Jasper listed but might add layers of complexity you don't need to deal with if you don't need to run your app on other platforms.
Jquery Mobile Framework provides the way how you web application looks on different hand held devices simply but this can not use the native device capabilities like picking up an contact from the contact book/application. while native application has the capabilities to handle all the system generated events or broadcasts.

Multiple Frontends - Java Backend

I just started working on a project which will about making a big website.
With big i mean:
Webshop
Forum
Normal Website (Information pages etc..)
At first i just wanted to pick a decent open-source webshop and just built my site around it.
But then i started thinking about how to expand etc.
I started to think how i would like this website to be acces from a mobile phone. Not just with a browser but with an App. (I have decent experience in making apps for Android & Iphone). So the real question is:
Would it be smart to make the "Core" of my whole website in Java and use services to acces it and thus allowing different frontends to use the same "Core". Like:
- PHP for browser frontend
- Java (android) for the android App
- Objective C for the IPhone App.
And let them all just communication to the "Core" through REST (Json).
What will be the advantages / disadvantages with this approach and will there be a significant delay in rendering eg. a webpage (http request to php, then php making calls to java server (different physical server) then accessing the database and then returning it all, so php can format it to HTML).
Hope hearing some answers or suggestions!
I would skip the Java layer and make the "core" PHP. There is a wealth of tools and frameworks (like Zend FW) for building thoses components in PHP. Design your application around a REST interface and allow your mobile apps to use REST.
Better yet, use Rails. It's so easy to design and set up a REST interface.
I think your solution is “smart”. The only changes I suggest are:
Use the same platform to build both the "core" and the "browser frontend." This way you will have more productivity.
Keep the "core" and "browser" frontend on the same server, if possible in the same process. Unless you have a reason do it differently. This will reduce problems with performance, latency and so on.
If you're already familiar with Java I would suggest you look at something like GWT (or GWT + third-party libraries like Ext GWT or Smart GWT) for your front-end. I don't see the point in picking another language for the front-end unless you really want to learn something else (e.g. PHP as you suggest in your question).
I think the rest of your approach is sound (i.e. Java on the backend, providing RESTful services, etc.)

Can i create Web App to be used on smart-phones without internet ? How?

I want to make cross - platform app which could be used for different smart-phones, and been advised to make 'Web App'.
Can 'web app' work without internet?
How to do it, which programing language to use?
thanks
Oh sure. Bundle all your HTML, JS anc CSS with your app, and have a thin Java/Android app over these assets. If you are not making any calls to fetch or show external HTML/pages, you don't need internet.
Most likely no.
While it is possible to run "web apps" without access to the internet (you can simply execute Javascript locally from some browsers), it would be
(Subjectively) not particularly useful.
Not supported by many devices, whom (like the iPhone) do not allow the storage and execution of arbitrary, non-native code on the device.
However, some frameworks do exist that hold the idea of "web apps" can be a distribution model. For example, PhoneGap allows you to code in HTML5/Javascript, and distribute your app to multiple platforms.
Yes, it can work offline once downloaded from web. Use just any regular programming language for web application development. If you are good at programming, I recommend ruby-on-rails or ASP.NET MVC with Jquery mobile.
You might want to look into frameworks like:
PhoneGap: http://www.phonegap.com/
jQuery Mobile: http://jquerymobile.com/
GWT Mobile: http://code.google.com/p/gwt-mobile-webkit/
Your question is very broad so it's hard to give a useful answer. Essentially when making a web app you'll normally be working with javascript, css, and html... though there are frameworks which will let you write your app in Java/Python/Ruby and then have those languages create your app for you. Keep in mind this is mostly all front facing stuff though. The actual web app will still need to have a backend written in a programming language that you understand (hopefully).
Good luck :).
Check out the jQuery Mobile API - I started using it recently and it has proved to be a viable option. Check this out.
https://developer.mozilla.org/en/Using_Application_Cache with an application cache your Web App can be used offline. It will cache the resources you specify to disk.
So you can write a Javascript + HTML webpage/app and use it both on and off line.
You can cache/store:
HTML
CSS
Javascript
Images
GET Requests

Categories