├── .expo-shared └── assets.json ├── .gitignore ├── App.js ├── app.json ├── assets ├── icon.png └── splash.png ├── babel.config.js ├── package-lock.json ├── package.json └── src ├── context └── BlogContext.js ├── reducer └── reducer.js └── screens ├── CreateScreen.js ├── Showscreen.js └── indexScreen.js /.expo-shared/assets.json: -------------------------------------------------------------------------------- 1 | { 2 | "f9155ac790fd02fadcdeca367b02581c04a353aa6d5aa84409a59f6804c87acd": true, 3 | "89ed26367cdb9b771858e026f2eb95bfdb90e5ae943e716575327ec325f39c44": true 4 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/**/* 2 | .expo/* 3 | npm-debug.* 4 | *.jks 5 | *.p8 6 | *.p12 7 | *.key 8 | *.mobileprovision 9 | *.orig.* 10 | web-build/ 11 | web-report/ 12 | 13 | # macOS 14 | .DS_Store 15 | -------------------------------------------------------------------------------- /App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { StyleSheet, Text, View} from 'react-native'; 3 | import {NavigationContainer,useNavigation} from '@react-navigation/native' 4 | import {createStackNavigator} from '@react-navigation/stack' 5 | import IndexScreen from './src/screens/indexScreen' 6 | import {BlogProvider} from './src/context/BlogContext' 7 | import ShowScreen from './src/screens/Showscreen' 8 | import CreateScreen from './src/screens/CreateScreen' 9 | import {Feather} from '@expo/vector-icons' 10 | const Stack = createStackNavigator() 11 | function App() { 12 | return ( 13 | 14 | 15 | { 22 | return 27 | } 28 | }} /> 29 | 30 | 31 | 32 | 33 | 34 | ); 35 | } 36 | 37 | export default ()=>{ 38 | return 39 | 40 | 41 | } -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "expo": { 3 | "name": "Blank Template", 4 | "slug": "animation", 5 | "privacy": "public", 6 | "sdkVersion": "36.0.0", 7 | "platforms": [ 8 | "ios", 9 | "android", 10 | "web" 11 | ], 12 | "version": "1.0.0", 13 | "orientation": "portrait", 14 | "icon": "./assets/icon.png", 15 | "splash": { 16 | "image": "./assets/splash.png", 17 | "resizeMode": "contain", 18 | "backgroundColor": "#ffffff" 19 | }, 20 | "updates": { 21 | "fallbackToCacheTimeout": 0 22 | }, 23 | "assetBundlePatterns": [ 24 | "**/*" 25 | ], 26 | "ios": { 27 | "supportsTablet": true 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mukeshphulwani66/Notes-App-React-Native/cf5a3229ef734ec72e3714417487d012aba4c446/assets/icon.png -------------------------------------------------------------------------------- /assets/splash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mukeshphulwani66/Notes-App-React-Native/cf5a3229ef734ec72e3714417487d012aba4c446/assets/splash.png -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = function(api) { 2 | api.cache(true); 3 | return { 4 | presets: ['babel-preset-expo'], 5 | }; 6 | }; 7 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "main": "node_modules/expo/AppEntry.js", 3 | "scripts": { 4 | "start": "expo start", 5 | "android": "expo start --android", 6 | "ios": "expo start --ios", 7 | "web": "expo start --web", 8 | "eject": "expo eject" 9 | }, 10 | "dependencies": { 11 | "@react-native-community/masked-view": "0.1.5", 12 | "@react-navigation/native": "^5.1.1", 13 | "@react-navigation/stack": "^5.2.3", 14 | "expo": "~36.0.0", 15 | "react": "~16.9.0", 16 | "react-dom": "~16.9.0", 17 | "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz", 18 | "react-native-gesture-handler": "~1.5.0", 19 | "react-native-reanimated": "~1.4.0", 20 | "react-native-safe-area-context": "0.6.0", 21 | "react-native-screens": "2.0.0-alpha.12", 22 | "react-native-web": "~0.11.7" 23 | }, 24 | "devDependencies": { 25 | "babel-preset-expo": "~8.0.0", 26 | "@babel/core": "^7.0.0" 27 | }, 28 | "private": true 29 | } 30 | -------------------------------------------------------------------------------- /src/context/BlogContext.js: -------------------------------------------------------------------------------- 1 | import React,{useReducer} from 'react' 2 | import {reducer,initalState} from '../reducer/reducer' 3 | 4 | export const BlogContext = React.createContext() 5 | 6 | export const BlogProvider = ({children})=>{ 7 | const [state,dispatch] = useReducer(reducer,initalState) 8 | return( 9 | 10 | {children} 11 | 12 | ) 13 | } -------------------------------------------------------------------------------- /src/reducer/reducer.js: -------------------------------------------------------------------------------- 1 | export const initalState = [ 2 | ] 3 | 4 | export const reducer = (state,action)=>{ 5 | switch(action.type){ 6 | case "ADD": 7 | return [...state,{id:Math.random(),title:`blog title${state.length+1}`,content:"test"}] 8 | case "ADD_POST": 9 | return [...state,{id:Math.random(),title:action.payload.title,content:action.payload.content}] 10 | case "REMOVE": 11 | return state.filter((post)=> action.payload !== post.id) 12 | default: 13 | return state 14 | } 15 | 16 | } -------------------------------------------------------------------------------- /src/screens/CreateScreen.js: -------------------------------------------------------------------------------- 1 | import React,{useContext,useState} from 'react' 2 | import {View,Text,StyleSheet,FlatList,Button,TextInput} from 'react-native' 3 | import {BlogContext} from '../context/BlogContext' 4 | 5 | 6 | 7 | const CreateScreen = ({route,navigation})=>{ 8 | const[title,setTitle] = useState("") 9 | const[content,setContent] = useState("") 10 | const {state,dispatch} = useContext(BlogContext) 11 | return( 12 | 13 | Enter Title 14 | setTitle(text)}/> 15 | Enter Context 16 | setContent(text)}/> 17 |