qcoding

1) 사용되는 구성 npm - 여기서 해당 페이지는 react-native-maps / react-native-maps-clustering / styled-component/ expo-location 가 주로 사용되었다. "dependencies": { "@react-navigation/bottom-tabs": "^6.0.9", "@react-navigation/drawer": "^6.1.8", "@react-navigation/native": "^6.0.6", "@react-navigation/native-stack": "^6.2.5", "@types/styled-components": "^5.1.19", "@types/styled-components-react-native": "^5.1.3", "ex..

티스토리를 통해 글로 정리하는 것이 은근히 시간이 많이 걸리는 일이라, 개발을 다 마치고 차례대로 글을 작성하려고 한다. 현재 아래 화면은 최종 완성된 DrawerNavigator 사용화면이다. 코드를 하나하나 찾아 보면서 어떻게 구성되어 있는지 확인하고자 한다. 이전 글을 보면 TabNavigator를 사용하였는데, DrawerNavigator을 한번도 사용한 적이 없어서 이번기회에 사용법을 알기 위해서 적용해 보았다. 1) 전체적인 Navigator 구성 -> 내가 구성한 Navigator는 크게 Root Nav(Native Stack) 아래에 1) DrawerNav 2) Stack 으로 구성되어 있다. 다시 Drawer에는 3개의 tab이 있으며 Stack아래에는 Detail 페이지가 존재한다. 1..

https://reactnavigation.org/docs/drawer-navigator/#installation https://reactnavigation.org/docs/drawer-navigator/#installation reactnavigation.org 프로젝트 진행 중 Drawer Navigator을 처음 사용하였는 데, 설치 과정 중 많은 오류가 발생하여 해결하기 위해 결과를 정리하였다. // 설치코드 npm install @react-navigation/drawer // 종속 라이브러리 설치 expo install react-native-gesture-handler react-native-reanimated 이후 실행 시 아래와 같은 에러가 발생하였고 구글링 결과 SDK44로 올라오면서 ..

* 현재 열심히 찾아보면서 만들고 있으며 각 페이지에 대한 기능과 세부 내용등은 차례로 글로 정리할 예정입니다. App 구성 - 맨 처음 프로젝트를 계획했을 때 3가지 Tap으로 구성을 하려 했으며 각각은 1) 지도를 통하여 전국에 있는 국밥집을 표현하는 것 2) 내가 가보거나 좋아하는 국밥집을 추가하는 것 3) 미정 ?! 간단한 내기를 위한 게임? 으로 구성을 하려고 했다. 현재 대략적인 기능과 디자인을 해서 만들어 가고 있으며 이번글에서 간단히 만들어진 페이지의 기능 등을 살펴보려고 한다. 1), 3) 페이지 정도가 진행되고 있으며 2번의 경우는 Realm을 사용해서 할 예정으로 아직까지는 어떤 라이브러리와 형태로 할지 정하지 못하여 만들지 못하였다. 역시 디자인이 제일 중요하지만 현재는 기능과 공부..

- 목적 -> 지난 글에서 python webscraping을 통해 만든 excel 파일를 DB형태로 사용하려면 또는 의 형태로 변경해야한다. 앞선 글에서 FireBase를 당장은 사용하지 않지만 후에 사용할 수도 있어서 FireStore를 사용해보았다. - 방법 -> 1) Python을 통한 excel to Json 변경 , 아래의 라이브러리 사용 import json from collections import OrderedDict from openpyxl import load_workbook 우선 파일 변경을 하기전 내가 원하는 json형태를 선정한다. 내가 생각한 data의 형태는 아래와 같이 key로 각 지역별 정보를 가져올 수 있고, value에는 Array [ ] ( = list ) 형태로 되..

1) 필요한 기능 2022.01.10 - [[사이드 프로젝트]App개발 - 전국 국밥 찾기] - 2) Python + Selenium + Beautiful Soup 통한 음식점 정보 웹크롤링 2) Python + Selenium + Beautiful Soup 통한 음식점 정보 웹크롤링 - 크롤링 사이트 확인 -> 음식점 정보를 얻기 위해서 여러 웹사이트를 통해서 크롤링이 가능하지만 평소 사용하는 DiningCode를 통해 음식점 정보를 얻기로 결정하였다. 검색어를 통해 지역별로 검 qcoding.tistory.com -> 앞에서 구한 프로젝트에서 크롤링을 하고 나면 아래와 같은 형식의 엑셀파일이 생성된다. 이 때 음식점의 주소를 얻게 되는 데, 지도상에 표시를 하려면 위도 / 경도의 지리적인 정보가 필요..

- 크롤링 사이트 확인 -> 음식점 정보를 얻기 위해서 여러 웹사이트를 통해서 크롤링이 가능하지만 평소 사용하는 DiningCode를 통해 음식점 정보를 얻기로 결정하였다. 검색어를 통해 지역별로 검색을 통해서 크롤링을 하여 정보를 가져오려고 한다. https://www.diningcode.com/list.php?query=%EC%84%9C%EC%9A%B8%20%EA%B5%AD%EB%B0%A5 '서울 국밥' 빅데이터 맛집 순위 Top100 - 다이닝코드 '서울 국밥' 맛집 애성회관 한우곰탕(곰탕, ★4.4), 중앙해장(해장국, ★4.3), 소문난 성수 감자탕(감자탕, ★4.1) 등 4,618곳의 전체 순위,식당정보,방문자리뷰,사 www.diningcode.com 우선 사이트에 들어가보면 왼쪽에 보이는 것..

1) 목적 -> 각 종 온라인 강의와 유튜브를 통해 많은 것을 배웠음에도 아직 무언가를 스스로 만드는 것 자체에 부담감이 많이 있는 와중에 ReactNative를 공부한 후 App제작에 대한 흥미가 생겨 Android로 출시하기 위해 사이드 프로젝트를 진행하고자 한다. 주제를 어떤 것을 정할까 하다가 다양한 기능 중에서 지도기반의 위치를 보여주는 기능을 해본적이 없다는 것을 생각하여 내가 좋아하는 국밥을 지도상에서 표시하고 정보를 전달하는 App을 만들기로 결정하였다. 2) 개발계획 - 개발환경 1) React Native Cli -> expo cli 사용과 고민하였지만, 추후에 기능을 추가로 넣을 수 있고 ReactNative Cli에만 지원되는 라이브러리 등이 있어서 결정하였다. https://rea..