├── .watchmanconfig ├── .gitignore ├── app.json ├── .babelrc ├── App.test.js ├── reducer.js ├── Text.js ├── App.js ├── InitialRoute.js ├── Container.js ├── Navigation.js ├── MainScreen.js ├── Button.js ├── LoginScreen.js ├── package.json ├── .flowconfig └── README.md /.watchmanconfig: -------------------------------------------------------------------------------- 1 | {} 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .expo/ 3 | npm-debug.* 4 | -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "expo": { 3 | "sdkVersion": "21.0.0" 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["babel-preset-expo"], 3 | "env": { 4 | "development": { 5 | "plugins": ["transform-react-jsx-source"] 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import App from './App'; 3 | 4 | import renderer from 'react-test-renderer'; 5 | 6 | it('renders without crashing', () => { 7 | const rendered = renderer.create().toJSON(); 8 | expect(rendered).toBeTruthy(); 9 | }); 10 | -------------------------------------------------------------------------------- /reducer.js: -------------------------------------------------------------------------------- 1 | const reducer = (state = { loggedIn: false }, action) => { 2 | switch (action.type) { 3 | case 'TOGGLE_LOGIN': 4 | return Object.assign({}, { loggedIn: action.loggedIn }); 5 | default: 6 | return state; 7 | } 8 | }; 9 | 10 | export default reducer; 11 | -------------------------------------------------------------------------------- /Text.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Text, StyleSheet } from 'react-native'; 3 | 4 | const styles = StyleSheet.create({ 5 | text: { 6 | fontSize: 20, 7 | textAlign: 'center', 8 | }, 9 | }); 10 | 11 | const CustomText = ({ children }) => ( 12 | 13 | {children} 14 | 15 | ); 16 | 17 | export default CustomText; 18 | -------------------------------------------------------------------------------- /App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Provider } from 'react-redux'; 3 | import { createStore } from 'redux'; 4 | import reducer from './reducer'; 5 | import Navigation from './Navigation'; 6 | 7 | const store = createStore(reducer); 8 | 9 | const App = () => ( 10 | 11 | 12 | 13 | ); 14 | 15 | export default App; 16 | -------------------------------------------------------------------------------- /InitialRoute.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { connect } from 'react-redux'; 3 | import MainScreen from './MainScreen'; 4 | import LoginScreen from './LoginScreen'; 5 | 6 | const InitialRoute = ({ loggedIn }) => ( 7 | loggedIn ? : 8 | ); 9 | 10 | const InitialRouteWithRedux = connect( 11 | ({ loggedIn }) => ({ loggedIn }), 12 | )(InitialRoute); 13 | 14 | export default InitialRouteWithRedux; 15 | -------------------------------------------------------------------------------- /Container.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { View, StyleSheet } from 'react-native'; 3 | 4 | const styles = StyleSheet.create({ 5 | container: { 6 | flex: 1, 7 | justifyContent: 'space-between', 8 | padding: 30, 9 | alignItems: 'center', 10 | backgroundColor: 'lightblue', 11 | }, 12 | }); 13 | 14 | const Container = ({ children }) => ( 15 | 16 | {children} 17 | 18 | ); 19 | 20 | export default Container; 21 | -------------------------------------------------------------------------------- /Navigation.js: -------------------------------------------------------------------------------- 1 | import { StackNavigator } from 'react-navigation'; 2 | import InitialRoute from './InitialRoute'; 3 | import LoginScreen from './LoginScreen'; 4 | import MainScreen from './MainScreen'; 5 | 6 | const routeConfigs = { 7 | InitialRoute: { screen: InitialRoute }, 8 | login: { screen: LoginScreen }, 9 | main: { screen: MainScreen }, 10 | }; 11 | 12 | const StackNavigationConfig = { 13 | initialRouteName: 'InitialRoute', 14 | headerMode: 'none', 15 | }; 16 | 17 | export default StackNavigator(routeConfigs, StackNavigationConfig); 18 | -------------------------------------------------------------------------------- /MainScreen.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { connect } from 'react-redux'; 3 | import Container from './Container'; 4 | import CustomText from './Text'; 5 | import Button from './Button'; 6 | 7 | const MainScreen = ({ logout }) => ( 8 | 9 | Main 10 |