Update react native app on playstore

Open the build.gradle in the android app folder of your react native app.

Change version code and version no 

versionCode 2

versionName "1.1"

}

Now ./gradlew bundleRelease and make a new release in the play console.

Build a React Native app and use WebView

In vscode you can download react native cli 

react-native run-android // make sure your android device is connected..via usb

emulator will be slow and i didnt like it.. on android studio .. it was crawling..

also you will need sdk >28 to make react-native work else it wasgiving licenses error..

finally i decided to use physical device.. 

enable the usb developer options 

To enable physical device make sure you can see it in 

$adb devices ... your phone should be visible there...

Now generate a react app with the starter and it will ask

for the perission to install the app on the phone .. just accept it. 

If you need icons for your app you can search for vector images which

will act as logo and generate app icons from below.

https://appicon.co/#app-icon

To push to playstore you need to put keystore and password in the build.gradle..

to release the apk you will do  ./gradle assemblerelease.. 

Refer below doc to make a release config in the build.gradle.

https://dev.to/zilurrane/generate-release-mode-apk-for-react-native-project-to-publish-on-playstore-5f78

make sure react-native start server is running while you try to assemble the release.. 

if allis well you will getthe final apk which you canpush to playstore..

I created a simple webview and included it in the app , i was loading my site from remote..

Final webview that i loaded in my starter app 

import { ActivityIndicator } from "react-native";

import { StatusBar } from "expo-status-bar";

import React, { Component } from "react";

import WebView from "react-native-webview";

import { StyleSheet, Text, View } from "react-native";

export default class App extends Component {

constructor(props) {

super(props);

this.state = { visible: true };

}

hideSpinner = () => {

this.setState({ visible: false });

};

showSpinner = () => {

this.setState({ visible: true });

};

render() {

return (

<View style={styles.container}>

<WebView

source={{ uri: "https://site.in" }}

onLoadStart={() => this.showSpinner()}

onLoad={() => this.hideSpinner()}

style={{ flex: 1 }}

/>

{this.state.visible && (

<ActivityIndicator

style={{

flex: 1,

left: 0,

right: 0,

top: 0,

bottom: 0,

position: "absolute",

alignItems: "center",

justifyContent: "center",

}}

size="large"

/>

)}

</View>

);

}

}

const styles = StyleSheet.create({

container: {

flex: 1,

},

});

Thread dump analysis case on weblogic..

First get the TDA or the visual vm plugin for TDA or that ibm thread analyzer...

Look for the worker threads .. for now leave daemon threads aside... 

Look for threads which are locking monitors and look for threads which are waiting for monitors...

If you find some concurrent util locks or synchronizers or abstract  queue syncronizers in the free monitors list.. 

i mean monitors are free but threads are waiting to acquire it... it means the jvm parameter is not enabled to print

ion -XX:+PrintConcurrentLock

Look here , there are no locks on monitors but still threads are waiting.. for monitors... that means the above parameter is not enabled...

Every object have monitors so that threads in queue can get lock on them and operate on them.. 

so ,here we need to enable parameters and find out which are these objects and who is acquiring the lock on them....

l

Debug React app on VSCode

Start server side with 

node --inspect server.js 

debugger will listen on 9229 ..

Create a launch.json for debug

==========

{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:8015",
"webRoot": "${workspaceFolder}"
},
{
"name": "Attach",
"port": 9229,
"request": "attach",
"skipFiles": [
"<node_internals>/**"
],
"type": "pwa-node"
}
]
}

======================

To do front end debug... install chrome ext on vscode.

start your front end via the npm start or check package.json for run scripts.

Use the above configuration 

It will launch a chrome on 8015. also make sure your front end is started on 8015

...time to debug... you should see breakpoints hitting.... 

you can also add debugger;  in your code , its same as a breakpoint..

var i = "helo";

debugger;                <============== Break point will be activated here...

console.log('value is ' +i)