작업일지에 들어가며 이전 프로젝트의 경우 멤버 테이블을 하나만 운영해서 프론트에서 데이터를 받아오고 DB에 저장하는데 크게 어려움이 없었다. 이번에는 멤버 테이블은 회원의 중요 정보를 담는 Main과 세부 정보를 담는 Detail로 나눠서 일대일 관계 설정이 되어있고, 또 Main 테이블은 회원 주소에 따라 위치 정보를 담는 location_roads 테이블과 다시 일대일 관계로 설정되어있다. 시작도 전에 난항이 생길 것 같은 기분이다. 아무튼 최선을 다해보자!회원가입 로직 구현 과정1. 테이블 구조 확인members_mainmembers_detaillocation_roads members_main을 기준으로 detail과 roads가 일대일 관계로 설정 되어있는 모습이다. 2. Entity데이터베..
작업일지에 들어가며이전 중간 프로젝트에서 JSP를 사용하여 카카오에서 제공하는 주소 찾기 API를 구현하였다. 이번 프로젝트는 리액트를 사용하기 때문에 처음에는 적용하기 어렵지 않으려나 생각했었는데 이미 여러 사람들이 리액트로도 API를 잘 구현하여 개인 블로그에 잘 정리하여 포스팅해주어서 잘 모르는 부분이나 에러가 나는 부분들은 쉽게 해결할 수 있었다. 내가 구현했던 과정을 하기에 좀 더 상세하게 기록을 남겨보겠다.리액트 다음 주소 API🙏 다음 우편번호 서비스카카오에서 제공하는 다음 우편번호 서비스 공식 설명 페이지이다.API의 특징과 기본 사용법이 아주 상세하게 설명되어있으니 처음 사용하는 사람들도 손쉽게 사용 가능하다. 하지만 본인은 공식 페이지의 설명만으로는 리액트에서 적용하기 쉽지 않아 쉽게..
작업일지에 들어가며 이전에 ERD를 어느정도는 구성했지만 테이블간 관계를 더 고려해봐야해서 데이터베이스가 없다. 그래서 DB와 프론트쪽으로 우선 업무를 간단히 분담하여 프로젝트를 진행하기로하였다. 나는 프론트 업무를 담당하게되어 이번 글에서는 리액트로 화면을 구성해보도록 하겠다. 우리는 이미 구현이 되어있는 템플릿 사용과 아니면 차크라UI를 사용하여 필요한 것들을 직접 만들어 사용할 지 논의했고, 템플릿을 사용하면 기존 코드를 해석하는 시간도 오래 걸리고 우리가 원하는 방향으로 수정하기 까다롭다고 판단하여 차크라 UI를 사용하여 화면을 만들기로 하였다.Chakra UI 사용 방법하기 차크라 UI 홈페이지에 들어가서 기본 세팅을 해주면 된다.1. 라이브러리 설치npm i @chakra-ui/react @e..
작업일지에 들어가며프로젝트에 돌입한지 3일차가 되었다. 우리는 구현할 기능에 맞는 DB 테이블 설계나누고 취합하여 더 좋은 방향을 논의하기로 하였다. 나는 메인 페이지와 필터에 필요한 DB 테이블 설계를 맡게 되었다. ERD 작성은 그래도 이전 프로젝트에서 한번은 경험은 해보았지만 테이블 구조가 단순하여 그래도 쉽게 작성했다고 생각했는데, 이번에는 상대적으로 복잡한 테이블 구조를 가질 것 같아서 잘 해낼 수 있을 지 걱정이다. 걱정을 제쳐두고 이번 프로젝트의 테이블 설계와 ERD 작성 과정을 기록해보겠다. 테이블 설계우선 나는 메인과 필터 테이블 설계를 맡게되엇다. 메인페이지 화면을 나누어 보게 된다면 위치, 필터, 카테고리, 배너 부분과 주변 맛집 추천(음식점) 부분으로 나누고 설계를 진행하였다.1...
작업일지에 들어가며프로젝트 2일차에 들어가서 우리 팀은 우리가 구현할 서비스에 필요한 기능들과 화면단에 대해 진득하게 회의를 진행하였다. 우선 필수로 개발해야할 화면단 구성은 이전글에 포스팅하였다. 이제 남은 것은 기능 정의서 작성과 DB 설계, Flow Chart 작성, WBS 작성 등이 남아있다. 이전 일지에서도 계속 말했듯이 개발 시작 전 문서화 작업은 매우 중요한 일이라는 것을 알게되었고, 이전 프로젝트에는 내가 따로 문서화 작업을 진행하지 않아 어쩌면 이번 기회에 조금이라도 진정한 현업 실무에 기반한 프로젝트를 할 수 있어서 꽤나 다행이라고 생각한다. 이번 일지에서는 기능 정의서를 작성하는 과정을 기록해보도록 하겠다.기능 정의서 작성💡 기능 정의서란?고객의 요구사항을 보며, 각각의 기능에 대해..
작업일지에 들어가며어제 주제를 선정하고 금일 화면단을 구성하기 위한 회의에 돌입했다. 우리 팀은 먼저 화면단을 구상하여 해당 화면에 필요할 것 같은 기능들에 대한 아이디어를 취합하는 식으로 회의를 진행하였다. 레퍼런스로 비슷한 서비스를 제공하는 다른 플랫폼들을 살펴보고 참고할 사항들은 참고하고, 다른 플랫폼들에는 없는 우리만의 기능을 추가하기로 방향을 잡았다.화면 정의서 작성우선 메인, 필터, 음식점 상세, 음식점 상세 내 별점리뷰, 자유댓글창, 마이페이지, 로그인, 회원가입 등 필수적인 화면단을 구상하였고, 개발 진행 사항에 맞게 앞서 말했듯이 유저 리뷰, 지도 API를 이용한 내 근처 맛집 추천 추가로 있으면 좋을 것 같은 페이지들과 다른 플랫폼에는 없는 맛집 추천 오픈 채팅방, 메뉴 추천 게임 등 ..
작업일지에 들어가며밑에서도 기록하겠지만 우선 우리 팀의 주제는 음식 추천 서비스이다. 맛있는 음식을 찾아서 먹는 나의 취미에도 알맞는 주제 선정이었다. 전문 분야라고 하긴 뭐하지만 맛집을 찾아다니고 맛있는 음식을 찾아서 먹는 취미를 가졌기 때문에 아무래도 다른 주제들보다 좀 더 관심있게, 재미있게 진행할 수 있을 것 같다는 생각이다. 팀에 피해를 최대한 끼치지말고 열심히 노력해보자!주제 선정 과정 본격적으로 주제를 정하기에 앞서 큰 틀은 서비스 관련 웹 페이지 제작에 뜻을 모았다. 엔드유저(사용자)가 특정 조건을 가지지 않는 일반인을 대상으로한 서비스 관련 웹 페이지를 개발할 것이고, 국비 지원 교육의 특성 상 리뷰 기반 커뮤니티, 크롤링 등 정부에서 프로젝트로 제안했던 주제에 대해서는 꼭 한 주제만 진..
작업일지에 들어가며이전 프로젝트를 진행하기 전 특강, 멘토링을 들으며 문서화에 대한 중요성을 크게 깨달았다. 프로젝트 시작 전 프로젝트 관련 사항들을 문서화하는 것이 굉장히 중요하다고 한다. 이전 프로젝트에서는 이 부분이 미흡하다고 생각하였기에 이번 프로젝트는 시작 전 문서화를 꼼꼼히 진행해보려한다. 문서화를 꼼꼼히 해두어 프로젝트 진행간의 팀원들과의 마찰을 최대한 줄이고 효율적인 소통을 진행하여 커뮤니케이션 코스트를 줄이고자 한다. 우리는 문서화 작업 중 첫 번째로 소스 컨벤션을 정하였다.소스 컨벤션💡 소스 컨벤션이란?보통 코드 컨벤션(Code Convention)이나 코딩 컨벤션 (Coding Convention)으로 부르는 모양이다.내가 작성한 코드를 다른 팀원들도 쉽게 이해할 수 있게 가독성 있..