본문 바로가기

전체 글160

React-native 네이버 지도 마커 부분 속도 개선 내용 현재 피유엠피(‘씽씽’ 킥보드 공유 업체)에서 작업자 앱( 명칭: 마스터 앱 )을 react-native 기반으로 개발하고 있습니다. 마스터 앱은 스쿠터의 수거, 재배치, 수리, 배터리 교체등의 작업을 도와주는 기능들을 갖고 있는 앱입니다. 마스터 앱에서 가장 중요한 부분은 수거, 긴급, 분실 등 8가지 상태로 나눠져 있는 작업 상태의 마크들을 지도에 표시하는 기능입니다. 하지만 새로운 스쿠터가 들어오고 지역이 확장되면서 마크의 종류들과 양이 많아지면서 속도 이슈가 생겼습니다. 그리고 작업자분들 중에는 성능이 좋지 않은 휴대폰으로 작업하시는 분들도 있어서 지도와 마크의 성능이 잘 나오지 않는 문제를 맞닥뜨렸습니다. 지도는 처음에 react-native-maps (구글 지도) 라이브러리를 사용했지만 .. 2022. 3. 29.
Next js (1) 기초지식 서론 SSR을 사용하기 위해서 왜 사용해야 하고 그럼 현재 우리 서비스는 어떻게 구성되어 있는지 알아가는게 중요하다고 생각해서 정리 시작 본론 개념 정리 csr ssr 웹서버 CloudFront CDN CSR client side rendering 프론트 서버에서 한번에 번들되어 있는 js 파일을 다운받아서 진행된다. 해당 js는 브라우저에서 돌아가서 화면에 보여준다. 다운로드 때문에 SSR에 비해 초기 진입속도가 느리다 ⇒ code splitting 으로 해결 가능 SSR server side rendering 서버에서 데이터까지 모두 포함하여 페이지를 구성한 후 브라우저에 전달 SSR의 단점 : 불필요한 부분까지 렌더링이 된다. CSR의 단점 : 초기 진입 속도가 느리다. SEO에 취약하다. 브라우저.. 2021. 12. 10.
react 웹앱 서비스 개발 1. 서론 웹앱 기반인 서비스를 하나 만들 생각이다. react-native 기반의 앱과 안에서 웹으로 돌아가는 형식으로 개발할 생각이다. 둘다 react 기반으로 작동하다 보니, state 관리 및 라이브러를 어떤걸 쓸지 왜 쓸지 고민하게 되면서 적게 되었다. 2. 본론 앱은 간단하게 navigation tab 으로만 이동할 생각이라 간단한 state 관리가 필요할것 같아서 요즘 코드 및 관리 포인트가 적은 react-query, swr 사용해 볼까 고민중이다. 웹은 테스트 및 미들웨어 장점을 많이 사용하기 위해서 redux, saga 등 또는 graphql를 사용해서 좀 더 관리에 용의한 웹 사이트를 개발해 볼 생각이다. 3. 개념 정리 react-query vs SWR redux vs Graphql 2021. 12. 8.
[Javascript] 백준 입출력 1) 한 줄로 입력을 받을 때 //한 줄 입력 let fs = require('fs'); let input = fs.readFileSync('/dev/stdin').toString().split(' '); let num = Number(input); for (let i = 1; i 이 파일 안에 예제를 넣어두면 됩니다. ( 쉽게 이름 변경해서 해도 가능 ) readline으로 사용하는 방법 1) 한 개의 입력만 받을 때 //한 개의 입력(띄어쓰기x) function solution(input){ console.log(input); } const readline = require("readline"); const rl = readline.createInterface({ input: process.stdin.. 2021. 12. 1.
[React-native] 자동 배포 1. 서론 회사에서 빌드를 많이 뽑아야 하는 이유가 있어서 자동배포에 대한 공부를 해야할 필요가 있었다. 그런데 찾아보니까 jenkins Xcode 를 지원해 주는 플러그 인도 있었지만 Xcode 9 정도까지만 지원해 주는것 같아서, 포기하고 Fastlane을 이용하게 되었다. AWS, Circle CI, Travis CI, 등 CI,CD 가격대비 많은 양을 뽑는것 같지 않아서 원격으로 하는 부분은 포기하고 로컬에서 배포를 뽑도록 했다. 맥미니가 없는 관계로 1. Xcode 2. Fastlane 3. AWS S3 4. Jenkins 5. Github 2. 이해 CI/CD Fastlane : 자동화 툴로써, ios, android 에 유용한 기능들을 제공한다. - 스크린 샷 제공: 직접 원하는 화면들의 스.. 2021. 11. 17.
타입스트립트 프로그래밍 해당 책을 읽으면서 궁금한점을 정리 했습니다. 컴파일타임 vs 런타임 vs 빌드 타임 컴파일 타임: 소스코드를 작성하고 컴파일이라는 과정을 통해 기계어코드로 변환 되어 실행 가능한 프로그램이 되며, 이러한 편집과정을 컴파일 타임이라고 ( Compiletime) 이라고 부른다. 런타임: 컴파일과정을 마친 프로그램은 사용자에 의해 실행되어 지며, 이러한 응용프로그램이 동작되어지는 때를 런타임(Runtime) 이라고 한다. 컴파일타임 오류의 유형 신택스 오류 타입체크 오류 런타임 오류의 유형 0나누기 오류 널(Null)참조 오류 메모리 부족 오류 2021. 11. 16.