일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 코딩
- 스프링
- 자바
- 백엔드
- React Native
- 오블완
- 태그
- node.js
- 파이어베이스
- javascript
- 리액트
- project
- React
- 프로젝트
- firebase
- 리액트네이티브
- expo
- Spring
- 코딩테스트
- 자바스크립트
- controller
- 티스토리챌린지
- 프로그래머스
- java
- 2025 프로그래머스 코드챌린지 2차 예선
- PCCE
- 코테
- ReactNative
- 리액트 네이티브
- map
- Today
- Total
목록React Native (17)
양갱의 개발 블로그

프로젝트로 애완동물과 산책하는 거리를 보여주는 프로젝트이다 그래서 사용자가 산책을 시작하면 서버에 데이터를 보낸다 사용자 + 산책시간 + 현재위치 (위도, 경도) 를 서버로 보낸다. 이렇게 만들것인데 일단 이 기능의 시나리오는 사용자가 산책하기 버튼을 클릭 사용자 + 날짜 + 산책시간(현재시간) + 현재위치(위도, 경도)를 보냄 (서버) 산책하기 테이블에 저장 [ 번호 + 사용자 + 시작시간 + 종료시간(null) ] 을 저장 모달창으로 주의 사항 및 안내할 내용을 보여준다 확인버튼을 누르면 모달창은 사라짐 산책하는 동안 onUserLocationChange로 변화하면 연결해주는 선그어주기? (GPS)기능 필요 산책 종료 버튼 클릭 사진찍을 수 있는 모달창 띄우기 확인을 누르면 ..

종합프로젝트에서 엑스포를 사용하고 firebase와 react native 연동하는 부분이 있었다 적어놔야 할 거 같아서 입력 일단 파이어베이스와 연동하려면 install 해야하는 부분이 있다 npm install --save @react-native-firebase/app npm install @react-native-firebase/database npm install @react-native-firebase/firestore 이렇게 3가지를 install해야한다 yarn을 사용하면 yarn add @react-native-firebase/app yarn add @react-native-firebase/database yarn add @react-native-firebase/..

일단은 firebase와 연동 했던 부분의 코드를 가져와야겠죠? firebaseConfig.js에 내 데이터베이스와 연동 되어 있을 것이다 import { db } from './firebaseConfig'; 그리고 해당 데이터 베이스에 있는 값을 읽어 와야할 것이다 //firestor 연동 const [users, setUsers] = useState(); const readfromDB = async () => { try { const data = await getDocs(collection(db, "Station")) setUsers(data.docs.map(doc => ({ ...doc.data(), id: doc.id }))) users?.map((row, idx) => { console...
최종 프로젝트는 아니지만 4학년 졸업 요건으로 종합프로젝트를 진행하고 있다! 여기에서도 아쉽게 또 프론트,, 사용자 어플리케이션을 만든다 상세한 내용은 노션에 정리했움! 그래서 바로 진행할거임!~! 헤더 만들기 원래는 그냥 컴포넌트를 가져와서 넣는게 대부분인데 나는 statck navigation을 사용하기 때문에 stack navigation을 커스텀 하기로 했다!!! 참고: https://devbksheen.tistory.com/entry/React-Navigtion%EC%9D%98-Header-%EC%BB%A4%EC%8A%A4%ED%85%80%ED%95%98%EA%B8%B0#%ED%--%A-%EB%-D%--%EC%-D%--%--%EC%A-%-C%EC%B-%A-%-C%..
핸드폰 마다 길이 값이 다르게 생겼기 때문에 width나 height를 각 픽셀 값으로 주면 실행했을때 조금 깨지거나 이상한 부분에 들어갈 수 있다 그래서 %로 많이 사용하는데 나는 Dimension을 사용한다 css에서 사용하는 부분은 container: { flex: 1, backgroundColor: '#fff', width:Dimensions.get('window').width, height:Dimensions.get('window').height, }, 이렇게 많이 사용한다 Dimensions . get 에는 window와 screen이 있다ㅏ window : 현재 앱에서 사용할 수 있는 영역의 크기를 가져온다. screen : 전체 화면의 크기를 가져온다. ..
firebase의 storage에 이미지를 업로드 하고 이미지의 링크로 데이터 베이스에 저장하려고 한다.. 그 부분은 교수님께서 이미 하셨다 그래서 바로 바꿨는데 지금 직접 어플에서 찍은 것은 file://~~~~~.jpg로 되어 있다ㅏ 이 파일 데이터 타입은 로컬에서 밖에 안되니까 storage에 올려 데이터를 가져올 것이다 그래서 실행했지만 storage에서는 읽을 수 없는 파일이라고 나왔다 이런 점을 보완하기 위해 교수님꼐서 보여주셨던 앨범에서 이미지를 업로드 하는 식을 찾아보려고 한다! 근데 업로드를 안해뒀길래ㅋㅎㅋㅎ 참고 https://joylee-developer.tistory.com/172 [React Native] ImagePicker 사용해 사진 업로드하기..