개발자 성장기 개발자 성장기

expo install expo-location // 1. expo location import import * as Location from "expo-location"; export default function MainPage({navigation,route}) { useEffect(()=>{ navigation.setOptions({ title:'나만의 꿀팁' }) setTimeout(()=>{ // 2. location 을 실행하는 함수 호출 getLocation() setState(data.tip) setCateState(data.tip) setReady(false) },1000) },[]) // 3. 실행되면 기기에서 허용하겠냐고 알림뜸 const getLocation = async () =..

expo install expo-linking // 1. import import * as Linking from 'expo-linking'; export default function DetailPage({navigation,route}) { // 2. 연결할 link 정의 const link = () => { Linking.openURL("https://spartacodingclub.kr") } return ( {tip.title} {tip.desc} popup()}>팁 찜하기 share()}>팁 공유하기 // 3. event 랑 link 함수 연결 link()}>외부 링크 ) }

import { Share } from 'react-native'; export default function DetailPage({navigation,route}) { const share = () => { Share.share({ message:`${tip.title} \n\n ${tip.desc} \n\n ${tip.image}`, }); } return ( // ScrollView에서의 flex 숫자는 의미가 없습니다. 정확히 보여지는 화면을 몇등분 하지 않고 // 화면에 넣은 컨텐츠를 모두 보여주려 스크롤 기능이 존재하기 때문입니다. // 여기선 내부의 컨텐츠들 영역을 결정짓기 위해서 height 값과 margin,padding 값을 적절히 잘 이용해야 합니다. {tip.title} {tip.d..

// install 할 내용들 yarn add @react-navigation/native expo install react-native-screens react-native-safe-area-context react-native-gesture-handler yarn add @react-navigation/stack // App.js import React from 'react'; // 1. NavigationContainer import 해주고 import { NavigationContainer } from '@react-navigation/native'; import { StatusBar } from 'expo-status-bar'; // 2. Navigator로 화면 그려준 view를 import ..

useEffect란 생명주기와 연관이 있다 view가 Load 되었을때 호출될거나, State의 값이 변경 되었을때 호출 되거나, view가 Disappear할때 호출되기도 한다 일단 코드를 한번 읽어 보자 const [state, setState] = useState([]) 이런식으로 사용할 state값을 init 한다 하지만 안에 값이 전혀 안들어 있다 값을 넣을때면 setState를 호출 하면 된다 [변수, 함수] 뒤에껀 callback이다 setState(data.tip) 이 함수 호출을 통해 data에 값을 넣어주고있다 그리고 TouchableOpactiy를 통해 click 된 경우 category라는 선언형 함수를 실행한다 cate를 매개변수로 받고 있으면 cate: String을 setCat..