Next step after Ionic, NativeScript or ReactNative? - angularjs

I created many Ionic apps, using all it's versions, from 1.x to the latest 3.x
All along with cordova, and AngularJS, it's a great framework, with big community, it's getting better and better over time.
But it's still an hybrid working over a WebView ..
With my knowledge to AngularJS, should i move easily to NativeScript, or start over with ReactNative ? from what i've seen ReactNative has better community, and many big apps are in it's showcase.
So, for cross-platform apps, should i keep working on Ionic, go with NativeScript, or move to ReactNative ?

Its good to know you are interesting in joining to the cause of creating native apps using JavaScript. You are in the right direction, both Nativescript and React Native will guide you to your goal: Build professional applications for iOS/Android using Javascript, however there are some differences you should know at the time you decide which framework to use.
React Native:
Its a framework developed by Facebook, using React it renders true native views. It uses Flexbox to decorate the apps so if you never used it that will be a new challenge for you, it is not hard to learn. My problem with this is that there is no direct support from the developer team, and only the community is from where you get the help, and sometimes it is not quite accurate. To create iOS apps you need a Mac computer, otherwise you can only create apps for Android. As far as I know, some basic information you might need in your app, such like platform, OS version, portrait/landscape it is developed by plugins from the community, and this information is not coming from the framework itself.
NativeScript:
Its created by Telerik, a very strong programming company who has high quality developers and strong support for its products. It uses Angular as a option to create your apps and its very well documented. If you are a good CSS developer you will be fine because they uses CSS to decorate your app. Nativescript community has developed tons of plugins. Nativescript core team is creating a lots of tools to help you through the process. Recently they launched a tool called Sidekick, which allows you to build/livesync your app from the cloud, which means you do not need a Mac computer for create iOS apps (isn't that cool?). With Nativescript you can choose Javascript, Typescript or Angular+Typescript, all of them will end up creating native apps. For support, you can contact the core team directly, and they will give you the best answer you can have, this is one of their goals.
I hope I have answered your question.
Thanks!

I don't know about React Native, but we have a great community with NativeScript. Hop on our Slack channel and meet the fam!

Related

Make a cross platform application starting from a website

I made a website (not yet online), it uses HTML, CSS, Javascript, only. No React or Angular, and I have the following problem :
I'd like to make a cross-platform application based on it (for iOS, Android, Windows, Linux and MacOS).
What's the best way to do that ?
My searches :
I did few searches, not really satisfactory, because it seems I'll need to re-make my client-website entirely !
I found 2 ways : React Native and NativeScript, like described here.
Have you some other option ?
If you don't, is it really impossible to keep the code in React ? Like I can see there
I'm a bit confused, and I don't know what I should do to perform what I want.
Thank you for all answers you could give me !
For Desktop Development you can try Electron. It's a js library which helps you build cross platform applications by using Node, Chromium and js.
You can also go one step ahead and add react to it.
Applications like VSCode, Skype, Microsoft Teams, Spotify and I think even Slack are made using it.
For Mobile Development, you can go with React Native. In this way you'd make a cross platform mobile dev app too.
The pros are that using these tech stack you can build modern cross platform apps. For a web dev, this is the way to go.
The cons of Electron:
It's little heavy on memory, but nothing that would be a bottleneck.
The cons of React Native:
Is not suited for apps that require heavy computation and it's bundle size is significantly larger than the native apps
I want to add to this :There is an other option nw.js for desktop app it's like electron using chromium ,node and js.
and for the front-end you can use angular, react, vue it is really as you want .This is a link https://nwjs.io/ (It is cross-platform too ).
For mobile development I think I will recommend you : NativeScript (https://play.nativescript.org/?_ga=2.144049845.1620166462.1585302566-1314322155.1583139217) . It is a good option also cause you can easily add your website(html,css,javascript files ) in your NativeScript webview as your interface and I think this option won't take you time as making an other one with react-native (even if I know that react-native have his webview too).
So go and have a look to this ::How to load a local html file into a NativeScript webview .
Then all your work will be the database in sqlite but even for this you have :https://www.npmjs.com/package/nativescript-sqlite and other things to go quickly
:https://market.nativescript.org/

Is it possible to use simple react-native-renderer+angular to create hybrid mobile applications?

For my company, I'm attempting to determine which of many mobile hybrid technologies we want to use going forward. If it matters, typically between 1 and 4 developers work on each project. We currently have about 10 mobile applications, and we plan to expand on many more.
Currently, we use Sencha/Ext for our "front end". We package with Cordova/PhoneGap to iPhone and android phones, with a MobileFirst back end to handle sessions, and auto-updates.
We'd like to replace at least the cordova and sencha part of our technology stack.
My question: Is it possible or even wise to use simple angular with react-native-renderer to create hybrid mobile applications?
Or, is it better to use a framework either separate from angular (e.g.: React Native) or in addition/built on to angular (e.g.: Ionic)?
My feeling is that using react-native-renderer with simple angular code will not provide us with many helpful features that the other platforms use. But I'd like to get insight from the stackoverflow community on this.
Thanks.
The answer to your question is yes - it is completely possible using the renderer you mentioned to utilize both features of both React Native and Angular to ship a hybrid technology. You are basically getting a React Native application in which an Angular 2 application runs in the JS thread with a custom renderer that uses the JS APIs to create a native UI.
But is it wise or a stable long term solution? The answer to that question is definitely no! This is essentially gluing two different technologies together which are both in developmental stages and will present plenty of bugs and difficulty in completing and publishing your apps unless you and your developers are very fluent in both angular and react native. Almost always it is better to stick to another framework entirely and in the future possibly integrate angular again.
Side note - run from Cordova/PhoneGap - it is not the smartest choice for any stability or consistency in development. User experience is also a downfall plus there is also serious doubt in how much longer it will be updated and maintained

Front end material design stack with angular.js

I am trying to get better at coding and am trying to figure out exactly what front end stack I need. I have red a lot and about a lot of tools but it is too much and I don't know which ones work good together or not.
Currently my idea is to do a web app with the design principles of Material Design from google and use angular for the logic of the front end.
I have red about and used these tools: Angular.js, Material Design Lite, Angular-material, polymer, ionic, bootstrap, Materialize and other various material design frameworks.
I am playing with this demo that I wanted to try out Material Design Lite but went too further and ended up needing Polymer for some input drop-down components. Playing further more with MDL I found out that it is not sufficient as bootstrap as I am used to work and would like to have this in it, but don't get me wrong I like MDL.
ionic has some good features for the local server and easy set up of template app as well other nice things like export to ios,android app, push notifications, but I ended up deleting ionic.css cause it was interfering with MDL and Polymer
I am asking some more experienced web app developers to help me out with this stack dilemma. I would like to get this out of my mind so I can be free and develop more.
Also tools like GRUNT, BOWER and so on? which one is the best in my case?
note: if u got interested the back end would be cakePhP and Mysql and the data type is going to be JSON (angular will send json to php into DB).
It can be overwhelming trying to learn all the tools and using them at the same time. My advice is to just use the tools when you need to.
If your web app is simple you may not even need a framework like angular. If you want to play with material design, you can do that with the css classes that MD lite offers no matter if you use angular / polymer / or plain javascript. ( If you want to use Polymer you already have some material design styles included. )
Some people prefer starting with the most simple solution and keep adding more sophisticated tools gradually. Others prefer starting with a more complex solution that has integrated the best practices, and in that case using a "Starter kit" may be useful.
Regarding Grunt/gulp... etc. You could worry about that later when you need to have a "build system" to do tasks like compressing files, optimising images and other things that are important for publishing.
After years doing frontend development i realised that is not possible to master all the tools available ( and having a life outside code ). You eventually settle for some tools (everybody have different preferences) and the important experience comes with solving real problems.
i would recommend you to use angular-material for your project if :
you have good knowledge of angularjs or if you find it interesting to learn
you have gone through google design and you want to implement it in angularjs way
try implementing missing features or take online help
Angular-material team is working on adding more and more features as already build in directives and services. Check releases on github page & demo guide
( Drop downs are already there in latest version as menu)
Few points
Google has an awesome open source guide for design.
Angular-material is a framework that helps you implement and follow that design language and principles using angularjs.
Bootstrap is just a framework which gives implementation of css, js related to front end work. Look and feel will be entirely different from google design.
Ionic is again a completely different framework which provides implementation and guide for mobile app development.
You can read about diff in angular-material/bootstrap/ionic in my post here
Bower/Grunt
bower ( package manager) and grunt ( task runner) are tools which work in node environment.
if your development environment is nodejs you should use them to get work done quickly and efficiently.
Check there sites for more information.
cakePhp/mySql
If your backend runs on these and you have angularjs in frontend.
Angularjs can make restfull calls in JSON to your api and it would all work good.

OnsenUI vs Ionic Framework

I want to start developing a mobile hybrid app using angularjs, css3 and html5. Was searching for a framework and found these two. Both are looking very nice however I was not able to get a good comparison between both of them. Can anyone please list down pros and cons for both.
A comparison between them in terms of scalable, out of the box components, speed and compatibility with Angular and devices targeted will be very helpful
One year has passed since both frameworks were released. Onsen UI is currently in stable 1.2 version while Ionic is in the last release candidate state.
I have worked with both of them so let me give you a short overview, I also wrote a much larger blog article, you'll find it at the end of this answer.
I won't go into much details about the core framework; if you have a previous AngularJS knowledge you will easily transition to Ionic or Onsen UI.
Both frameworks are built around AngularJS and they heavily depend on directives, you can also easily build your custom directives. Onsen UI also features a jQuery support (unnecessary if you ask me).
Both frameworks support Android 4+, iOS 6+ (some features are available on Android 2.3), Onsen UI also officially supports Firefox OS and desktop browsers. Ionic don't have an official desktop support, but it will still work (it will not be pretty, imagine ).
Ionic currently don't support Windows Mobile platform (it will have it in the future); Onsen UI support is currently in development (since November 2014).
Both frameworks support some kind of splitview feature so they can be used for table development.
Both frameworks have a distinctive beautiful looking flat UI. I prefer Ionic over Onsen UI look and feel, but this is a matter of personal taste. Both default themes look iOS 7 like.
Onsen UI supports native looking themes for Android and iOS. Ionic framework uses the same theme for all platforms, but some features will depend on the platform (for example tab look and feel)
Both frameworks have a working theme builder.
Ionic supports SASS while Onsen UI is built around Topcoat CSS library.
Both frameworks have a large widget support (directives)
Onsen UI has a better documentation. It is separated at two different locations. First one is “Components” where you can see different directives and each one has a working example you can use and replicate. Second part is a “Guide” where you are guided through the application creation process.
Ionic has a disorganized documentation (heavily fragmented). It lacks a real “getting started” tutorial, even if you have previous AngularJS experience. It shows you pieces, but not how to connect them correctly.
On the other hand Ionic has much larger community so you will easily find problem solutions.
Ionic framework has a great official forum + large StackOverflow community. At the same time, Onsen UI uses only StackOverflow as a help center (I would call this a fail).
Onsen UI has an HTML5 IDE called MONACA IDE (great tool), Ionic IDE is currently in production; you can participate in beta test.
Ionic has a growing 3rd party plugin community (for example date picker); I couldn't find any 3rd party Onsen UI plugin
I wrote a much larger article covering Ionic / Onsen UI changes, find it here.
Since both frameworks are pretty new and not very popular (yet!), I don't think anybody has taken the time to do an extensive comparison between the two. I don't even think the final set of out of the box components is determined by the developers themselves yet, active development is still going on.
As for compatibility, hybrid apps run in the native browsers of the devices where they are installed on. Both frameworks need CSS3, so old phones will never be supported by either of the frameworks.
The OnsenUI-tag here on StackOverflow is the only support OnsenUI offers (currently), and at the moment of writing there are 0 questions/answers. Ionic has a very active forum on their website + some questions/answers here on SO.
I think having an active community backing up a framework will eventually lead to a better framework. Therefore I'd go for Ionic. Personally, I find Ionic's standard-design more appealing as well, but you should judge that for yourself.
Ionic
more lean to Angular style like routes,controllers and template and it's structure is kind of complicated in first hand.
command like "ionic start myApp tabs" still don't available in onsenUI
Material Design like "Cardboard" are available
OnsenUI
simpler structure, easy to start
couple with Monaca IDE, some of features are only available only if you use Monaca. otherwise you have to create things by yourself.
supported ios8 design recently
Ionic has a more mature feature and CSS component set and out of the box. Injectable delegate services, representing the UI elements (directives) gives you more control over UI/UX interactions. The development community is (currently) very active and it's gaining traction.
I cannot properly speak to speed/performance between the two but know both are optimized for mobile.
As I develop more, I will report back with comparisons. Good luck.
Just started using ionic after some time native development. Must seriously say it has some great cli features! For example you can start your project from a gist in my opinion this is nice to have for poc's
Havent been able to test everything but what i've seen really impresses me!
It's well documented in there own way, active community and it keeps getting better.
Just wanted to share my thoughts for what it's worth
Im working in Ionic Framework during 1 year with a real project, i have created a game with Ionic, its very special because hybrid app is not best choice if you want create game. When you develop a game you need performance !
However if you develop simple game with few animation, its good.
Here is my game in playstore, its a memory game "Memory Party" :
https://play.google.com/store/apps/details?id=fr.jhaccoun
Why Ionic is a good choice :
very very very good documentation (tutorial, forum, article,...)
stable (ionic 1), you can find many apps in store
Easy to develop (ionic come with many tools to help the developer, you can develop and test in live in your phone without deploy thanks live reload
Many cordova modules are available
you don't need mobile skills, just angularjs, html, css...
Ionic provide beautiful components and you can custom the components if you like
I found Ionic the best for some reasons, like their community support and the documentation. I am still evaluating the onsen from a long time but still havent found the one unique thing that will drift me towards it compared to Ionic

Rhodes v/s Titanium

Which is the best framework to develop cross platform application. Especially for android and iphone. I have been through the reviews present over the internet, but those seem to be pretty old. I believe both Titanium and Rhodes have developed much over the past couple of years.
One of the basic differences is the nativeness of the two frameworks. Both Rhodes Framework and Titanium claim to be native. Rhodes however is not really native i.e. it uses an embedded Web Browser to display the HTML-coded website. Titanium, however, takes your JavaScript code, and create real native widgets on the respective platforms.
So what's so important about native? Well, it makes the user experience a whole lot better.
Rhodes Framework is best described as a competitor to PhoneGap.
From my knowledge, Rhodes is best for enterprisey apps. I would generally recommended Titanium for most app developers.
Though I have not used Rhodes, I feel Titanium is better based on what I read about Rhodes. The JS syntax in Titaniums is also easy to ramp up on. But, from what I have seen, understanding the working of the native code is useful to understand and explain some of the behavior. There is one more comparison of the frameworks that I found recently here.

Resources