Native code interop in a weex app - javascript

i'm new to Weex framework and i'm wondering if there's a way to inject native code directly in the app. Or perhaps some sort of interoperability between js and native code?
I'm trying to add some cookie-based auth logic and animated transitions between views and it seems there's no way to achieve this in Weex without native code.

First, There is NO way to inject native code via js-bundle.
Second, The feature of animated transitions, you can try with BindingX. Timing Event is suitable for you. Translate your transition into an expression.
The expression is the interoperability between native and js.

Related

Using the Ionic framework with plain JavaScript

Can one use the Ionic framework with plain Javascript (aka. without the recommended frameworks like react, angular or vue)?
If yes, how?
yes, you can build Ionic apps using VanillaJS or take advantage of Vue, React or Angular or Stencil
all components documentation available for JavaScript
it's recommended to use React or Vue,... for large scale application but if you want use plain JS it's available.
From Ionic framework documentation:
One of the main goals with moving Ionic to Web Components was to remove any hard requirement on a single framework to host the components. This made it possible for the core components to work standalone in a web page with just a script tag
In short: Yes, in the same as way you can use wordpress.
According to the official documentation:
One of the main goals with moving Ionic to Web Components was to remove any hard requirement on a single framework to host the components. This made it possible for the core components to work standalone in a web page with just a script tag. While working with frameworks can be great for larger teams and larger apps, it is now possible to use Ionic as a standalone library in a single page even in a context like WordPress.

What is the difference between lit-element & lit-html?

I have been learning Polymer and this came in - The future of web (lit-element & lit-html)
I understood that lit-html is for HTML templating with a couple of efficient techniques.
At the same time lit-element is a lightweight web component base class which has the lit-html inside it.
Question: If lit-element comes with lit-html, I would solely use the lit-element for all my purposes. What exactly does lit-html doing explicitly with its own separate context.
One should choose lit-element or lit-html while developing a standalone web application?
Any help on guiding through this would be of much help!
First, lets clarify the following points:
Web
Components
technologies are supported in modern browsers by default. You can build
a Web Component application using the browser's API.
HTML templates has been around since 2013 at least.
lit-element library is a "lightweight" version of Web Components. You'd use it if you want to build an application in Web Component and if you do so, you'd be using its built-in lit-html via html to create HTML templates
On the other hand, Just like you stated, lit-html is a library which has efficient mechanism to create and update HTML templates. You can use it for whenever you'd need an HTML template irrespective of the framework/library you are using for your website, if any.
For an example, you could build a website with jQuery or vanilla Web
Components and use lit-html to create the HTML templates.
lit-html is a library which deals with dom rendering like other libraries e.g. React
It uses the newest way of diffing the dom tree with help of native tagged templates.
var h1 = html`<h1>Header 1 <h1>`
like any other framework/library e.g. JSX it also provides you construct inside the tagged template and directives to help.
LitElement is a lightweight framework using lit-html as rendering engine. It provides you the observed properties, attributes and web components lifecycle callbacks
For a web application you should go with LitElement, if you do not want to reinvent the data binding, caching, callbacks etc. you would definitely require more like state tracking, routing etc. which you can employ from other libraries or develop your own.

How to migrate html, css and javascript application into react-native components?

I've created a web application using HTML, CSS and Javascript but is it possible to convert it to a react-native app with the help of any kind of wrapper for HTML, CSS and JS code which can be used within react-native. I would like to convert the web application component into react-native components though it would be a tedious process if I need to change anything in the web application which in turn lead me to change the react-native components.
You cannot use html,css,and javascript code for react native app. Beacause react native has its own tags so it wouldn't possible but still if you can follow the attached url hope it may give you ideas
https://medium.com/javascript-in-plain-english/how-to-convert-any-web-page-to-reactjs-9740f1ba15db
a method would be...
react-native-WebView? I haven't tried it out but from what it sounds like I think its like android web view where u can give it a link and it will load that webpage? that's the closest thing I can think of. of course this method has limitations obviously...
I don't think there are any good methods to turn react code to react-native code since both have different tags and even if you do somehow do it you will have to climb mountains of bugs and fixes if your app is kind of complex.
but if in the future u do take up a project that is for both web and native, and they both share a load of functionality I would recommend something like react-native-web where you can share a codebase between web and native. essentially by making a native app ur making a web app aswell. its a bit tricky when u start but if your having projects like this it will be helpful. hope this gives u some ideas

Using hidden WebView and calling out functions between Javascript and Java code

I'm trying to create an Android App but I'm not too familiar with Java. I was thinking to use a hidden WebView to store my core code (as Javascript) there and call out functions between WebView's Javascript and app's Java code. Is this a bad practice? I know that I can use frameworks like Cordova, PhoneGap but they are all bloated with code that I will never use.
3 Reasons to Prefer React Native,
1- You are good at JavaScript (you told that you are not too
familiar with Java)
React Native is Really Native
JSX and
React Component Props (eg. flex styles almost same with CSS) are
close to JavaScript Developers
WebView is not the best practice ;)
Good Luck

KISSmetrics - React Native iOS

I am using React native to create an iOS app; So my code is in javascript and some objective-c.
Now i wan't to implement KISSmetrics in my project, i have done the proper setup based on kissmetrics documentation, but when it comes to create events and user identifications etc… i have to use data from my javascript code.
Does anyone knows how to do that? for example:
the objective-c code to identify the user is this: [[KISSmetricsAPI sharedAPI] identify:#"name#email.com"]; but how can i get the code that gets the identity of the user and replace the name#email.com from my javascript code?
I would look here to find out how to build a native module bridge. The way it works is that you create an iOS native module with methods that you can actually call from JavaScript by which you can send your data from JS to Obj-C.
Here's an example project that does this:
https://github.com/idehub/react-native-google-analytics-bridge
You don't need to turn it into a full-fledged NPM library, you can just simply create the necessary native files and JS files on the fly in your project.
Also, if you don't know already, remember to rebuild the iOS project (hit the Play button) to see your changes because the native side doesn't have Live Reloading.

Categories