항상 개발 완료가 진짜 시작이더라...​

바라봄 홈페이지를 오픈한지 약 2달, 단순히 바라봄을 설명하는 홈페이지로 남겨 놓기엔 너무 아까웠다.

그래서 홈페이지를 어떻게 활용할지 많이 고민했다.

SEO를 통해서 상위 노출을 시키고 싶었지만 검색 순위 상승을 위해선 백링크가 중요하다고 한다.

백링크란? - 위키

필요성​

바라봄은 앱 프로덕트이고, 홈페이지의 필요성을 느끼지 못했었다.

그리고 지금도 갈등이 있다. 홈페이지 개발 할 시간에 바라봄을 업데이트를 하는게 좋지 않을까...?

앱 프로덕트의 단점​

앱의 가장 큰 단점은... '설치'가 필요하다는 것 이다.

Toast notification 이란?​

토스트 알림은 짧은 메시지를 표시하기위한 비모달(non-modal)적이고 눈에 거슬리지 않는 요소이며 이벤트가 발생할 때 화면에 나타나는 알림.

모달(modal)이란?​

사용자 인터페이스 디자인 개념에서 자식 윈도에서 부모 윈도로 돌아가기 전에 사용자의 상호동작을 요구하는 창.

생각하지 못한 유저 경험​

(징징글 주의!)

바라봄의 유료화를 기획하며 많은 고민에 빠져 있다.

• 유저들이 이 결정을 과연 이해해줄까?

• 얼마 없는 유저들 마저 나가버리면 어쩌지?

• 이대로 바라봄이 망해버리는건 아닐까?

DAU 100 첫 돌파! 바라봄 개발 후기​

과거를 회상하며...​

처음으로 DAU 100을 넘어서니 많은 생각이 든다.

2020년 6월 바라봄을 오픈하고 무려 1년 하고도 9개월이 지나서야 DAU 100 이 넘었다.

서체를 변경하자!​

최근에 인상깊은 글을 하나 봤다.

토스 피드 - 서체

정말 똑똑한(?) 사람들은 다르구나, 많이 배웠고 공부를 더 해야겠다고 느꼈다.

바라봄은 이전까지 나눔 스퀘어 서체를 사용하고 있었다.

들어가기에 앞서...​

바라봄 4.x.x 이전의 버전은 단순히 디자인이 망가진다는 이유로 시스템 폰트 크기는 무시한 체 폰트 크기를 고정했었다.

바라봄을 완성하고 엄마에게 보여줬을 때, 시력이 나쁜 울 엄마는 내 앱을 제대로 사용할 수도 없었다.

반려동물을 키우는 인구는 젊은층 부터 노년층까지 다양하고 반려동물을 사랑하는 마음은 모두 같을 것이다.

그리고 가족 공유기능을 기획하고 있었던 시기였기에 폰트 접근성 개선을 먼저 하기로 마음먹었다.

HOC 이란?​

Higher-Order Component

HOC 패턴은 기존 컴포넌트를 감싸서 새로운 기능을 추가하는 방식.

HOC는 고차 컴포넌트를 반환하며, 이를 이용해 상태 관리, 인증, 라우팅 등 다양한 기능을 추가함.

예제​

Atomic 디자인 패턴 이란?​

• Atoms: UI의 가장 작은 부분을 나타내는 컴포넌트. 예: 버튼, 아이콘, 텍스트, 이미지

• Molecules: 두 개 이상의 Atom 컴포넌트를 조합하여 만든 작은 컴포넌트. 예: 로그인 폼, 메시지 박스

• Organisms: Molecule 컴포넌트와 Atom 컴포넌트를 조합하여 만든 큰 컴포넌트. 예: 헤더, 푸터, 사이드바

문제점?​

출처-휴몬랩 기술블로그

기존 MVC 패턴의 문제점​

기존의 MVC 패턴 state 변경 흐름

MVC 패턴에서 양방향 데이터 흐름이 발생하면 데이터 변환 작업과 유효성 검사를 위해 추가적인 코드 작업이 필요하며, 뷰와 컨트롤러 간의 데이터 전달 과정에서도 문제가 발생할 수 있습니다.