[코드스테이츠 PMB 18기]
갑자기. 분위기. 개발자 모드
지난 시간 데이터로 요리조리 요리해 봤다면?
오늘은 PM으로서의 개발자 모드로 돌입해 보겠습니다.
먼저 HTML, CSS, JavaScript 관점의 동작 및 구조를 이해하기 위해
브런치 보다 좀 더 간단한 구조의 '랜딩 페이지'를 살펴보겠습니다.
HTML: 개발자 모드로 살펴본 원티드의 이벤트 랜딩 페이지는 크게 위와 같이 script, head, body로 구성되어 있었습니다. 콘텐츠의 속성에 대해 자세히 보고 싶다면 body 안에서 확인할 수 있습니다. 예를 들어 아래 왼쪽과 같이, 네잎클로버가 움직이고 있어 gif콘텐츠인가? 확인하였더니 이미지 파일인 것을 알 수 있었습니다.
CSS: 웹 사이트에서 스타일을 담당하는 CSS는 아래와 같이 스타일 탭에서 확인이 가능합니다. 페이지의 디자인적 요소를 담당하여 컬러, 사이즈, px, 여백 등을 확인할 수 있습니다.
JavaScript: 웹 페이지의 상호작용을 담당하는 JS는 기능의 동작들을 보여주며 아래와 같이 if, else if 등의 코드로 동작이 되는 것을 확인할 수 있습니다.
위와 같이 웹 페이지의 구조에 대해 알아보았다면, 이번에는 브런치의 서비스 유형에 대해 알아보겠습니다.
브런치는 현재 아래와 같이, 네이티브 앱&PC 웹의 서비스를 제공하고 있습니다.
브런치는 처음 웹 서비스로 출발하여 이후, 모바일 앱 버전이 추가로 개발되었습니다. 그렇다면 브런치는 서비스 론칭 시 왜 앱 서비스가 아닌 웹 서비스에서 출발하였을까?
웹 서비스: 사용자인 창작자 특성, 기기 접근성, 빠른 서비스 구현
브런치는 서비스 초반 사용자들이 콘텐츠를 창작.제작하는 데에 주력했을 것입니다. 위 자료와 같이 창작자 즉, 작가의 창작 활동은 '집'에서 주로 이뤄지며, 브런치의 글쓰기 특성상 SNS처럼 짧은 글이 아니기 때문에 모바일의 작은 화면으로 글쓰기보다는 웹에서 글을 쓰는 것이 더욱 편이할 것으로 판단.웹 서비스를 먼저 개발한 것으로 추측됩니다. 덧붙여, 웹 서비스의 특성상 모든 기기에서의 접근성과 앱보다 비교적 빠른 서비스를 구현할 수 있기에 웹 서비스로 사용자들의 반응을 선 확인하여 앱 서비스까지 확대한 것으로 생각됩니다.
앱 서비스: 사용자인 독자 특성, 최적화된 사용자 인터페이스, 다양한 기능
추후, 모바일 앱 버전을 추가한 이유는 브런치 서비스의 사용자인 독자의 특성이 있습니다. 서비스 초반 콘텐츠를 창작.제작하는데 주력하여 작가의 창작 활동에 집중하였다면, 이후에는 콘텐츠를 이용하는 독자들이 언제, 어디서든지 글을 읽을 수 있도록 모바일 앱 서비스를 개발한 것으로 추측됩니다. 덧붙여, 최적화된 사용자 인터페이스와 기능을 제공하고, 푸시 알림과 같은 앱 서비스만의 기능을 제공하는 등.. 독자들의 편의성을 높이려 한 것으로 보입니다.
브런치는 카카오의 서비스 중 하나인 만큼 카카오 Open API가 다양하게 이용된 것으로 보입니다. 에디터 모드에서 장소 표시 시에는 카카오맵 API가, 회원가입.로그인 시에는 카카오계정 API가!
내용이 어렵지만..PM으로서의 개발자 모드로 최대한 과몰입하여 다양한 카카오 Open API 중 '카카오 로그인'의 기능을 선정하여 구조와 역할 등을 살펴보았습니다.
카카오 로그인의 기능을 요약하자면 카카오계정으로 다양한 서비스에 로그인할 수 있도록 하는 소셜 로그인 서비스입니다. 사용자는 카카오톡 또는 카카오계정으로 손쉽게 서비스에 로그인하고, 서비스는 서비스 ID 및 비밀번호를 입력.검증하는 과정을 직접 구현하지 않고도 사용자에 대한 인증을 간편하고 안전하게 처리할 수 있는 기능입니다.
참고 자료 및 자료 출처
#PM부트캠프 #코드스테이츠 #카카오 #kakao #브런치 #brunch #브런치스토리