
구현 목표 웹 크롤링을 통해 공연장 목록 가져오기 cheerio 사용하기 1. cheerio 설치 npm install cheerio //사용 시 import 방법 cosnt cheerio = require('cheerio'); 2. 웹 크롤링 cheerio 사용법 const html = await getHTML(); const $ = cheerio.load(html.data); 3. 최종 코드 공연장 목록을 오브젝트 배열로 담은 후 const getTheaterList = async () => { const html = await getHTML(); const dataArr = []; const $ = cheerio.load(html.data); const $child = $(".theater-righ..

정처기 끝났으니까 다시 시작.... 카카오랑 조금 다르기도 하고 버전 올라가면서 조금 수정된 부분이 있어서 겨우겨우 성공.. 리액트는 많아도 리액트네이티브+스프링부트+네이버 로그인 참고 소스는 지인짜 찾기 힘들어서 겨우겨우 했다ㅠㅠ 1. ⭐️Frontend 1. 네이버 개발자센터 등록 설명 생략 2. 리액트네이티브 네이버 로그인 라이브러리 설치 npm install @react-native-seoul/naver-login --save // RN version >= 0.6.0부터 Auto Linking 적용, // ios 경우 추가적으로 Cocoapods 설치 필요 cd ios && pod install https://github.com/crossplatformkorea/react-native-naver-..

백엔드 작업이 미뤄지고 있어서 프론트를 맡은 나는 화면 먼저 만드는 중~~ 🎨화면 설계도 구현 목표 광고 배너 이미지 슬라이더 만들기 React-native-image-slider-box 라이브러리 사용 1. 라이브러리 설치 npm install react-native-image-slider-box 2. 아직 DB에 이미지 데이터가 없어서 샘플 이미지를 assets/ 경로에 저장 후 불러왔다. const images = [ require('../../assets/banner/banner_sample1.png'), require('../../assets/banner/banner_sample2.png'), require('../../assets/banner/banner_sample3.png'), ]; 3. ..

리액트 네이티브(React-Native) 앱 만들기 프로젝트 🛠️개발 환경 프론트는 RN , 백은 Spring으로 구현 예정 FrontEnd BackEnd Tool 📁프로젝트 구조 잡기 일단은 구조만... 개발하면서 수정 예정 src ├── App.js ├── Theme.js // 프로젝트에서 사용할 색상 정의 ├── components // 컴포넌트 파일 관리 │ ├── Input.js │ ├── Button.js │ ├── CommentForm.js // 댓글 입력 form │ ├── CommentList.js // 댓글 리스트 │ ├── CommentItem.js // 댓글 한개 │ ├── CustomFont.js //폰트 설정 │ ├── Detail.js // 스터디 세부 정보 │ ├── Stud..