{"id":19260990,"url":"https://github.com/lavkushwaha/react-native-app-structure-and-authentication-flow","last_synced_at":"2026-05-01T03:37:48.513Z","repository":{"id":128080174,"uuid":"140157910","full_name":"Lavkushwaha/React-Native-App-Structure-And-Authentication-Flow","owner":"Lavkushwaha","description":"Authentication FLow Set Up Very Basic","archived":false,"fork":false,"pushed_at":"2018-07-09T12:09:38.000Z","size":921,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-01-05T10:07:46.255Z","etag":null,"topics":["appstucture","authentication-flow","login","react-native","react-native-app","react-navigation","signup-reactnative"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Lavkushwaha.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-07-08T10:26:38.000Z","updated_at":"2018-07-09T12:09:40.000Z","dependencies_parsed_at":"2023-07-09T16:02:01.606Z","dependency_job_id":null,"html_url":"https://github.com/Lavkushwaha/React-Native-App-Structure-And-Authentication-Flow","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Lavkushwaha%2FReact-Native-App-Structure-And-Authentication-Flow","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Lavkushwaha%2FReact-Native-App-Structure-And-Authentication-Flow/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Lavkushwaha%2FReact-Native-App-Structure-And-Authentication-Flow/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Lavkushwaha%2FReact-Native-App-Structure-And-Authentication-Flow/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Lavkushwaha","download_url":"https://codeload.github.com/Lavkushwaha/React-Native-App-Structure-And-Authentication-Flow/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240358079,"owners_count":19788830,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["appstucture","authentication-flow","login","react-native","react-native-app","react-navigation","signup-reactnative"],"created_at":"2024-11-09T19:23:59.249Z","updated_at":"2026-05-01T03:37:43.461Z","avatar_url":"https://github.com/Lavkushwaha.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Native App Structure And Authentication FLow :+1:\n\nReact TabNavigation and StackNavigation of react-navigation is used here to make a solid Basic App Structure\n\nIn this Project We have\n\n4 screens:- \n\u003e LoginScreen, SignUpScreen, WelcomeScreen,AppTabNavigatorScreen\n\n\n# App.js\n```\nimport React, { Component } from 'react';\nimport {\n \n  StyleSheet,\n  Text,\n  View\n} from 'react-native';\nimport { createStackNavigator} from 'react-navigation';\nimport WelcomeScreen from './screens/WelcomeScreen';\nimport LoginScreen from './screens/LoginScreen';\nimport SignupScreen from './screens/SignupScreen';\nimport AppTabNavigator from './screens/AppTabNavigator';\n\n\nexport default class App extends Component{\n  render(){\n    return(\n      \u003cAppStackNavigator /\u003e\n    );\n  }\n}\n\nconst AppStackNavigator = new createStackNavigator({\n  WelcomeScreen:{screen:WelcomeScreen,},\n  LoginScreen:{screen:LoginScreen},\n  SignupScreen:{screen:SignupScreen},\n  AppTabNavigator:{screen:AppTabNavigator},\n  \n\n});\n\n\n```\n\n# AppTabNavigator.js\n```\nimport {createBottomTabNavigator } from 'react-navigation';\nimport Home from './tabs/Home';\nimport Profile from './tabs/Profile';\n\nconst TabNavigator = new createBottomTabNavigator({\n    Home:{\n        screen:Home\n    },\n    Profile:{\n        screen:Profile\n    }\n});\n\nexport default class AppTabNavigator extends Component {\n\n    static navigationOptions={\n        header:null\n      }\n\n  render() {\n    return (\n      \u003cTabNavigator screenProps={{navigation:this.props.navigation}}/\u003e\n    );\n  }\n}\n\n```\n\n## Another important Topic is to transfer navigation from child route to parent route\n\n### We pass the screen Props when rendering the TabNavigator like\n```\n.\n.\nexport default class AppTabNavigator extends Component {\n\n    static navigationOptions={\n        header:null\n      }\n\n  render() {\n    return (\n      \u003cTabNavigator screenProps={{navigation:this.props.navigation}}/\u003e //here we passed it\n    );\n  }\n}\n```\n\n### and catch inside screen to call those route as\n\n## inside profile.js for logout button\n```\n.\n.\nexport default class Profile extends Component {\n  render() {\n    return (\n      \u003cView style={styles.container}\u003e\n        \u003cButton style={{marginBottom:20}} rounded title=\"Logout\" onPress={() =\u003e this.props.screenProps.navigation.navigate('WelcomeScreen')}/\u003e\n       \n        \n      \u003c/View\u003e\n    );\n  }\n}\n.\n.\n```\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flavkushwaha%2Freact-native-app-structure-and-authentication-flow","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flavkushwaha%2Freact-native-app-structure-and-authentication-flow","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flavkushwaha%2Freact-native-app-structure-and-authentication-flow/lists"}