MVC 패턴

기존의 웹 프레임워크는 정보를 담당하는 Model, 화면을 담당하는 View, 구동을 담당하는 Controller로 나눈 MVC 패턴으로 분리하여 관리했다.모델은 모델의 상태에 변화가 있을 때 컨트롤러와 뷰에 이를 통보한다. 이와 같은 통보를 통해서 뷰는 최신의 결과를

2020년 3월 21일
·
0개의 댓글

React 적응기 - 5

이전에 작성한 포스트와 책의 내용을 바탕으로 정리 및 추가를 하는 포스트이다.JSX 를 설명할 때 자바스크립트를 확장한 문법으로, React element 를 생성하고, 컴포넌트를 생성해 UI를 객체화할 수 있다고 작성했었는데,이번에 JSX 가 Javascript XM

2020년 3월 20일
·
0개의 댓글

React 적응기 - 3

익명함수가 일반 함수와 무엇이 다른지화살표 함수는 익명 함수를 선언하여 변수에 대입하는 방법과 유사사용 방법객체배열htmljquerycommonJs - requireES6 importforEachmapreducecallbackpromiseasync await디바운스 개

2020년 3월 18일
·
0개의 댓글
post-thumbnail

React 적응기 - 2

예전에 ES6에 대한 포스트를 작성한 적이 있지만, 책에 나온 김에 다시 한번 리뷰하면 좋을 것 같다는 생각이 들었다.문자열 안에 변수나 연산을 혼합할 수 있는 문법이다.문자열로 표시하려는 부분은 따옴표 대신 \`\`(backtick)으로 감싸주고, 그 안의 변수나 연

2020년 3월 17일
·
0개의 댓글

React 적응기 - 1

페이스북에서 개발한 프론트엔드 프레임워크이다. 리액트는 페이스북을 개발할 때도 사용되었다.원하는 화면을 컴포넌트 단위로 빠르고 효율적으로 구성할 수 있다. 이 때, Virtual DOM(가상 화면)을 이용하여 화면 출력 속도를 높이고 코드 복잡도를 줄였다.Virtual

2020년 3월 16일
·
0개의 댓글

React 적응기

React 를 사용할 때

2020년 3월 12일
·
0개의 댓글
post-thumbnail

[프로젝트-DediCats] Devlog-Final

DediCatBack-end Develop, 팀장길고양이를 돌보는 유저를 위한 지도 기반 커뮤니티 앱 Stack: React Native(Expo), React Navigation, MobX, Google Maps API목업 디자인 기획 및 컴포넌트 구조 설계React

2020년 2월 26일
·
0개의 댓글

[프로젝트-DediCats] Devlog-13

프로젝트 개발 초기에는 빌드한 앱을 구글 플레이스토어와 앱스토어 둘 다 배포할 계획이었지만, 검색해보니 앱스토어의 검수과정과 기간이 1달 동안의 결과물로는 맞추기 어렵다는 쪽으로 의견이 모아져 플레이스토어 출시에 목표를 집중하기로 했다. 안드로이드에 맞추려면 어떤 부분

2020년 2월 20일
·
0개의 댓글

[프로젝트-DediCats] Devlog-12

오늘은 앱의 포스트 기능에서 자주 볼 수 있는 Infinite Scroll 과 Pull down Refresh 기능을 구현했다. 백엔드 팀원분들에게 이 기능을 위해 pagination 기능을 추가하고 싶다고 전달하였고, 다행히 어렵지 않은 부분이라 계속 진행할 수 있었

2020년 2월 19일
·
0개의 댓글

[프로젝트-DediCats] Devlog-11

이번 프로젝트에서 react-native-snap-carousel 을 이용해서 지도의 마커들의 정보를 렌더하고 있었다. 링크를 확인해보면 아이템들의 정보를 하나의 카드안에 렌더하고 그 카드를 옆으로 스와이프하면 다음 인덱스의 아이템을 렌더하는 방식이다. 기본적으로 re

2020년 2월 17일
·
0개의 댓글

[프로젝트-DediCats] Devlog-10

몇일 전, 포스트에서 mobx store 리팩토링 작업에 관한 포스트를 작성했었다. 2개의 스토어에서 총 6개의 스토어로 확장하였고 기능에 맞게 각 스토어로 이동시켰다.이 중 스토어 분할을 통해 리팩토링을 할 수 있었던 몇 가지 helper function 에 대해 적

2020년 2월 16일
·
0개의 댓글
post-thumbnail

[프로젝트-DediCats] Devlog-9

어제 발생했던 mariadb 문제를 여러 번의 삭제와 재설치 끝에 겨우 해결할 수 있었다. 중간에 디렉토리를 잘못 삭제해 ERROR 1006 (HY000): Can't create database 'cats' (errno: 2 "No such file or direct

2020년 2월 15일
·
0개의 댓글

[프로젝트-DediCats] Devlog-8

스토어를 리팩토링하는 과정이 예상한 것처럼 대작업이 되었다. 스토어로 들어갈 observable 과 action들을 구분하는 것부터 하나하나 새로 바뀐 루트로 변수를 재지정하는 일, 그리고 컴포넌트에 새로 inject 하는 것까지 상당히 수고스러운 작업이다. 그래도 내

2020년 2월 15일
·
0개의 댓글

[프로젝트-DediCats] Devlog-7

앱개발을 하면서 상대적으로 작업이 더 많은 프론트를 백엔드 분들이 지원을 해주시기 시작했다. 그리고 상태관리 라이브러리를 써보신 분의 조언에 의하면 현재 우리가 사용하고 있는 UserStore 와 CatStore 가 너무 포괄적이어서 Store 를 좀 더 나눌 필요가

2020년 2월 13일
·
0개의 댓글
post-thumbnail

[프로젝트-DediCats] Devlog-6

FlatList 는 어플에서 뉴스피드 기능을 만들 때 유용한데, Infinite Scroll(무한 스크롤 로딩) 과 Pull Down Refresh(끌어서 새로고침) 기능을 구현할 수 있기 때문이다. 먼저 이 기능들의 구현은 해당 블로그 에서 참고하여 작성하였다.또한

2020년 2월 12일
·
0개의 댓글
post-thumbnail

[프로젝트-DediCats] Devlog-5

어제 포스트에선 위치를 받아와 state에 저장하고 렌더하는 과정에서 발생하는 버그에 대해 적었었다. 오늘은 함수들을 목적에 따라 좀 더 정리하고 리팩토링을 하였다.먼저 현재 화면의 범위를 나타내는 좌표들의 집합인 currentBoundingBox 를 할당해주는 act

2020년 2월 11일
·
0개의 댓글

[프로젝트-DediCats] Devlog-4

어제 지도맵을 관련해서 글을 작성했는데, 몇가지 버그가 있었다.일단 현재 mobX를 이용해 현재 position, region, boundBox 와 이와 관련된 함수들을 저장하고 있는 상태이다.componentDidMount에서 위치 권한을 허용하면서 navigator

2020년 2월 10일
·
0개의 댓글
post-thumbnail

[프로젝트-DediCats] Devlog-3

이번 포스트는 현재까지 프로젝트를 진행하며 가장 많은 시간을 들이게 한 를 활용하여 만든 페이지에 관한 내용이다.

2020년 2월 7일
·
0개의 댓글

[프로젝트-DediCats] Devlog-2

이번 포스트에서는 어제 얘기했었던 디렉토리와 컴포넌트 아키텍쳐를 관한 내용이다. 저번 포스트에 추가한 목업 페이지와 컴포넌트구조 링크를 바탕으로 만든 디렉토리이다. 이 중 목업 페이지와 를 바탕으로 구조를 짰다. 먼저 전체적인 코드로는 이런 구조를 띄고 있다. 구조가 아래서부터 위로 추가를 해서 나무 뿌리에서 가지가 뻗어나가는(?) 것과 같은데 아래서부...

2020년 2월 5일
·
0개의 댓글

[프로젝트-DediCats] Devlog-1

이전에 올렸던 가 운좋게 채택이 되어서 팀원분들과 함께 서비스를 구현해보기로 했다. 내 아이디어라 프로젝트 팀장으로 자연스럽게(?) 임명이 되었지만 이런 역할을 맡아본 적이 많지 않아서 아직은 부담스러운 마음이 크다. 시간이 지나면서 차차 나아지길 바란다. 이번 프로젝트를 간단히 설명하자면 '길고양이들을 돌보는 사람들의 네트워크 서비스' 라고 할 수 있...

2020년 2월 4일
·
0개의 댓글