react-native 실습

React Native는 Facebook에서 개발한 오픈 소스 모바일 애플리케이션 프레임워크이다JavaScript와 React를 사용하여 iOS 및 Android 애플리케이션을 개발할 수 있게 한다.React Native 코드를 작성하게 되면 각 운영체제에(IOS,An

핸드폰의 앱스토어를 통해서 expo 앱을 설치하기expo 웹사이트 접속하여 가입하기create-expo-app 으로 expo 프로젝트 설치npx create-expo-app 폴더와프로젝트이름 --template blankexpo 에 로그인 (expo에 미리 가입해 놓

View html의 div에 해당하는 컴포넌트 react native는 플랫폼간 호환성을 위해 react native의 표준 컨테이너인 View 컴포넌트를 사용한다. > ### 알아둘점! react native의 모든 텍스트는 Text 컴포넌트 안에 들어가 있어야

초기버전 react native는 android와 IOS를 위해 다양한 api와 컴포넌트를 제공해 왔다하지만 react native 개발팀은 react native 개발과 다양한 api/컴포넌트를 동시에 제공하는것은 어렵다고 판단했다.개발팀은 핵심 요소만 남기고 커뮤

브라우저와는 달리 react native 에서는 요소들이 화면을 넘겨도 자동으로 스크롤이 되지 않는다.스크롤을 위해 ScrollView 컴포넌트에 넣어줄 필요가 있다.horizontal: 세로스크롤을 설정한다.pagingEnabled: 스크롤할때 페이지 단위로 스크롤

장치에서 지리적 위치 정보를 읽거나, 현재 위치를 폴링하거나, 위치 업데이트 이벤트를 구독할 수 있는 액세스를 제공하는 라이브러리8번 라인에서 사용자의 위치정보 사용을 허가 받는다.14번 라인에서 Location.getCurrentPositionAsync 함수를 사용해

날씨 API 사용 openweatherapi 사이트에 가입하고 api 키를 받은뒤 5 days 3 hour forecast data를 가져온다. > https://api.openweathermap.org/data/2.5/forecast?lat=${latitude}&l

Todo 앱 실습 >https://dribbble.com/shots/6019952-Do-More-List-View/attachments/11196915?mode=media 목표 : 위의 디자인을 바탕으로 간단한 Todo App 제작 프로젝트 설정 > 터미널에서 입

const \[working, setWorking] = useState(true); 를 이용해서 work 와 travel을 클릭할 때 색이 바뀌도록 한다.TextInput을 이용해서 사용자의 입력을 받는다.Date.now()를 키로 하는 오브젝트를 생성한다.toDos를

toDo 가 여행인지 할일인지에 따라 구별하여 랜더링하기AsyncStorage를 이용해서 재실행 되더라도 기록 유지하기Object.keys()로 오브젝트의 키 배열을 만들어 map으로 순환toDos\[key].working 값이 true/false 인지따라서 랜더링을

저장된 아이템 삭제 / 삭제 확인창 띄우기toDo 컴포넌트 안에 삭제를 위한 버튼 추가React native의 Alert api를 이용해서 다이얼로그를 띄움ok버튼에 삭제를 위한 onPress 이벤트를 작성toDos 값을 복사넘겨받은 key값으로 프로퍼티 삭제Async