Best way to navigate screens?

I tried to combine them but I couldn't, here is my code on React Native. I removed the token part for now because I don't know how to do it.

``` import * as React from 'react'; import { Button, Text, TextInput, View } from 'react-native'; import { NavigationContainer } from '@react-navigation/native'; import { createStackNavigator } from '@react-navigation/stack'; const AuthContext = React.createContext();

function HomeScreen() { const setIsSignIn = React.useContext(AuthContext);

return ( <View> <Text>Signed in!</Text> <Button title="Sign out" onPress={() => setIsSignIn(false)} /> </View> ); }

function Loader() { return ( <View> <Text>Loading</Text> </View> ); }

function SignInScreen() { const [username, setUsername] = React.useState(''); const [password, setPassword] = React.useState('');

const setIsSignIn = React.useContext(AuthContext);

async function signIn() { //do any call to your server //and may be save token, info from server etc

try {

  fetch('https://reactnativegiris.000webhostapp.com/User_Login.php', {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({

      username: username,
      password: password
    })
  }).then((response) => response.json())
  .then((responseJson) => {

    // If server response message same as Data Matched
   if(responseJson === 'Data Matched')
    {
      setIsSignIn(true);
    }
    else{

      Alert.alert(responseJson);
    }

  });
} catch (error) {
  console.log(error);
}

}

return ( <View> <TextInput placeholder="Username" value={username} onChangeText={setUsername} /> <TextInput placeholder="Password" value={password} onChangeText={setPassword} secureTextEntry /> <Button title="Sign in" onPress={signIn} /> </View> ); }

const Stack = createStackNavigator();

export default function App() { const [isSignIn, setIsSignIn] = React.useState(false); //token here

return ( <AuthContext.Provider value={setIsSignIn}> <NavigationContainer> <Stack.Navigator> {isSignIn ? ( <Stack.Screen name="Home" component={HomeScreen} /> ) : ( <Stack.Screen name="SignIn" component={SignInScreen} options={{ title: 'Sign in', }} /> )} </Stack.Navigator> </NavigationContainer> </AuthContext.Provider> ); } ```

And here whats inside my php code:

``` <?php

//Define your host here. $HostName = "localhost";

//Define your database name here. $DatabaseName = "id13409422_users";

//Define your database username here. $HostUser = "id13409422_reactnative";

//Define your database password here. $HostPass = "4qt-vnGAV+AGbfiG";

// Creating connection. $con = mysqli_connect($HostName,$HostUser,$HostPass,$DatabaseName);

// Getting the received JSON into $json variable. $json = file_get_contents('php://input');

// decoding the received JSON and store into $obj variable. $obj = json_decode($json,true);

// Populate User email from JSON $obj array and store into $email. $username = $obj['username'];

// Populate Password from JSON $obj array and store into $password. $password = $obj['password'];

//Applying User Login query with email and password match. $Sql_Query = "select * from users where username = '$username' and password = '$password' ";

// Executing SQL Query. $check = mysqli_fetch_array(mysqli_query($con,$Sql_Query));

if(isset($check)){

$SuccessLoginMsg = 'Data Matched';

// Converting the message into JSON format. $SuccessLoginJson = json_encode($SuccessLoginMsg);

// Echo the message. echo $SuccessLoginJson ;

}

else{

// If the record inserted successfully then show the message. $InvalidMSG = 'Invalid Username or Password Please Try Again' ;

// Converting the message into JSON format. $InvalidMSGJSon = json_encode($InvalidMSG);

// Echo the message. echo $InvalidMSGJSon ;

}

mysqli_close($con); ?> ```

I'm getting this error: Possible Unhandled Promise Rejection (id:0): SyntaxError: JSON Parse error: Unrecognized token '<'

/r/reactnative Thread Parent