I have an application which is built on a ReactJS and uses FabricJS extensively. We plan to reuse a lot of code and build mobile apps using React-Native but I am not sure how we can integrate the FabricJS component into it.
The app is something like https://www.my-wallsticker.de/wandtattoo-selber-gestalten/
I have found and used https://www.npmjs.com/package/react-fabricjs but nothing available for React-Native.
What could be the solution?
You would have to use a WebView with canvas (or something like this library: https://github.com/iddan/react-native-canvas) in order to be able to render anything with FabricJS.
Related
I want to make an android app using Kotlin for the back end and Android Studio. For the front end, I understand that React Native would be a powerful choice, however I cannot figure out how to add ReactN to my Kotlin project.
I also tried creating a project in ReactN and then adding Kotlin: installed nodejs, npm and create-react-native-app, made the project. Then I tried opening it in Android Studio, but I wasn't getting any options to actually compile and run the project. So another question would be: can you work on ReactN projects in Android Studio or not?
If you could give me some resources on how exactly to do this, or if you can walk me through it step by step, it would be very helpful. I want to mention that I've never developed for Android or Web before (I'm mentioning about Web because I cannot rely on any Reactjs knowledge from Web dev).
React Native is whole framework, for front and back end, and have nothing to do with Kotlin (well, some Kotlin snippets may be integrated into RN app, thats all). RN projects are in fact multiplatform web/js based apps and Kotlin is used for writing pure Android apps, so this isn't a front/back end separation in here, these are just different approaches to development. Mixing both, while possible, makes no sense in most cases
I have an application developed with ReactNative but now my client wants to get rid of it and go native in Android and iOS, I got the native code that RN generates for both but it is strongly tided to RN libraries, is it a good idea to continue like this and try to re-use the code or it's better to start over from zero with native code?
You could re-use some of your code, but I would advice against this. It'll be easier to rewrite the whole app (2 times) than to try to decouple your code from react native's library.
Although, couldn't you convince your client to stay with RN? The problem that RN fix is the need to write your app twice, if you go on this path you'll take twice the time to achieve the same result, and you'll encounter some problems hard to debug if you are not comfortable working with Android and iOS' custom frameworks.
I'm trying to build a modal that looks somewhat like this using React Native for iOS and Android. Are there any libraries that do blurred/vibrancy overlays? I had a look at the react-native-blur, however unfortunately this is only for iOS. React-native-overlay also has some options for such views, however it also appears to be iOS only.
Is there a library that supports both platforms, or is there a way to use a JS library such as vibrancy.js that can be used with React?
Currently react-native-blur supports blur for Android as well. However a little bit of setup is required. Check out the docs here:
https://github.com/react-native-community/react-native-blur.
The library also offers the ability to create vibrancy views. Although, at the present (v 3.2.2), vibrancy will only work fo iOS.
I'm contemplating on using React Native for a new web app. Is it possible to ship both iOS and Android apps using it?
I know that it's on the roadmap, but it's unclear to me whether it's going to be a separate open-source project (e.g., React Android vs React Native), or just one (e.g., React Native).
TLDR: Most likely you can. But it depends on your use cases.
You can aim for about 80~99+% code reuse (depending on how much Android/iOS native views/modules you use eg. Do you have custom graphics code or low-level TCP networking code; Those can only be done in native code; And expose as API to your JS code. The amount of the platform-specific JS code is actually minimal. Plus you can also use platform check like if (Platform.OS === 'android'){} to solve that) of code reuse, which is pretty nice. Dropbox and other companies have done similar projects: using c++ to build a 'shared' component between iOS and Android project, while implementing most of the UI code in native iOS(Objective-c or swift) and Android(java). But now you are doing C++ with Java and Objective-C or Swift, more language to master, more complexity and more brain juice went down the drain. And it probably took some super tough gymnastic move to make different native code work in both iOS and Android, plus debugging...
React Native just makes it a lot easier to write almost everything in JavaScript. But there is a catch, only about 80% of the JS code could be shared. In the foreseeable future, you still need to write 'platform-specific' JS code for Android and iOS versions.
That's why FB said they aim for 'Learn once, code anywhere' instead of 'run' everywhere.
But it's still very nice other than code reuse(80+% code reuse is still a big improvement comparing to maintaining 2 entirely different versions: Android and iOS ya?)
Cmd +R to refresh the app is a GREAT boost for development speed. Waiting for a big project to compile just makes you felt you were dying inside.
Declarative UI you get for free, because of using React. This is another great plus! As you don't need to 'dig' into your specific UI code that often anymore. Data changed? Just 'flush' it and UI just update accordingly. No brain juice wasted.
I just ported my not so complicated Android React Native App to iOS. And it took me 3 days. The request for and iOS version for the App came as a rather abrupt and unplanned move. So could definitely be even faster had I built the Android with a plan for iOS too. Huge win:)
Another great benefit is able to do hot code push without going through the hellish 1 week app store review process. So no more, "YAY, our app is approved. Let's release. Oh Shiiit. Critical bug and our app keeps crashing(that's gonna keep happening for at least a week before your fix is live). And you have to beg Apple to speed up the process". This is possible because the major part of the code base would be written in JS and with tools like AppHub or CodePush, you could almost instantly deploy code to your users. This is conditionally allowed by Apple.
3.3.2 An Application may not download or install executable code. Interpreted code may only be used in an Application if all scripts, code, and interpreters are packaged in the Application and not downloaded. The only exception to the foregoing is scripts and code downloaded and run by Apple's built-in WebKit framework, provided that such scripts and code do not change the primary purpose of the Application by providing features or functionality that are inconsistent with the intended and advertised purpose of the Application as submitted to the App Store.
Lastly, as an open-source project, project longevity tends to be a concern. Not an issue for React Native. Internally used by(FB Ads Manager) and backed by FB(a dozen FB Engineers?) by Facebook, with close to 500 contributors and 25k Stars, React Native is full of life. Seeing is believing :) (https://github.com/facebook/react-native)
EDIT 1
I realized that I am apparently a bit biased and only talked about the good stuff about React Native. So do checkout https://productpains.com/product/react-native/ and Github issues to have a full picture. It's definitely not silver bullet. That being said, it satisfies most of my use case and I couldn't see me use native iOS or Android anytime soon.
EDIT 2
The Facebook F8 conference app released by Facebook (duh..) is 100% open source and they have a really nice tutorial to show you how you could have both iOS and Android native experience(90% as good as native ?), and at the same time, achieved 85% code re-use. check it out --> https://makeitopen.com
EDIT 3
You may also want to checkout Flutter and its pros & cons :)
It doesn't make sense to have a single codebase if you want a truly native experience. At the moment we have things like NavigatorIOS in React Native which provides an iOS-style UI for navigating between app screens, but if we were to just start using that on Android it wouldn't feel like a true Android app.
Therefore I'd expect to see a NavigatorAndroid component or similar when the time comes, and the same for various other components that behave differently between the platforms.
One benefit that you would get is that any application logic - maybe a store, or your backend interactions - could be written in a JavaScript file and then included by both iOS and Android.
So while you won't get that write-once run-everywhere developer experience from React Native I would expect to see a solution that gives first-class UI on both platforms while encouraging as much reuse as possible. I personally also hope to see strong build tools to help develop and ship on multiple platforms.
React Native for Android has just been released, Android folder will be creating along side with iOS folder upon creating a new project.
Just another tip as NavigatorIOS was mentioned. Facebook are not really maintaining the code for NavigatorIOS. Instead they are focusing on Navigator.
Yes. We're running it in production with about 5m registered users.
Some things are a little behind iOS but catching up quickly. It's a good wagon to be on.
React Native is designed so that you can deploy to both iOS and Android. There is a caveat, of course.
React Native has supported iOS for much longer, coming to Android only recently. So, there are some differences in terms of what is supported on each platform.
For example, if you place borders on Text, they will show up on iOS, but not on Android. In order to overcome this, you need to place a View around the Text, and apply a border to that. Luckily, React Native makes it easy to integrate separate stylesheets for each platform (or even platform-specific styling on a single stylesheet).
Support for Android is continuously evolving, so it will only be a matter of time before React Native for Android is on par with iOS. Nevertheless, this shouldn't deter you. In my experience, it's a great way to quickly develop for both platforms, and it does save some headaches.
you don't need to maintenance separate code base for android & ios. Actually you can use same code base for build android & ios. I recommend to read the react-native documentation(according to react-native version you are using) before using any inbuilt component in your code.
Eg:- TextInput component onKeyPress function supports for ios only.
if ur are using external lib check these lib support for both ios and android.
Anyway you have to configure external lib separately(install) both android and ios.
hope this will helpful.
I have a question about Android Studio: Does AS supports AngularJS code while designing XML files, e.g. for small animations or effects?
SUMMARY : NO
There is no way you can write Angular JS code while developing Android Native app. You can use Angular in a WebView (using js/html so), that's all.
AngularJS is a completely different technology than what is used in native Android apps. Native Android apps use Java and/or C for their code, which is compiled when you build the app. AngularJS is a framework for web development, running specifically on Javascript (a completely different technology than Java).
You can build apps without using native Java or C code, but there are tradeoffs. As noted in other answers, you can display webpage views as apps (using technologies like Cordova]), or use frameworks like React Native to write code in Javascript that then gets compiled to a native app. You could use AngluarJS in the webview instance, since it just displays a webpage, however not in something like React Native. I highly encourage you to check both of these (and other options) out, but keep in mind that they have their own limitations and tradeoffs – no one way is the "right" way to build an app.
In summary: No, AngularJS is a web technology, not a native app technology.
new answer = Yes... Sort of, you can do it with:
https://www.nativescript.org/
It translates javascript, angular and typescript code into native components!
Apparantly it's possible to use nativescript in Android Studio with:
https://docs.nativescript.org/runtimes/android/getting-started/hello-world
Android Does not support AngularJs. but still if you want to use you can use it in webview.