지코딩

오늘 한 일: 세부정보 페이지 기능구현 완료 (태그: onKeyUp 사용)/ 유저정보 db및 리듀서 / 이미지 미리보기 / 로그인 관련 기능 내일 할 일: 상세페이지 유저정보 띄우기 / 마이페이지 유저 정보 수정 / 로그아웃 / 토큰 저장위치 변경 / 사진업로드 생각해볼 것: 1. 인풋에 들어갈 수 있는 내용, 길이 등 에러만들 수 있는 부분 생각하기 2. 토큰, 리프레시토큰 관련 내용 3. 리렌더링 어디에서 왜 이루어지는 확인할 수 있는 방법 찾기 4. 필수정보(아이디, 비밀번호) 변경 어떻게 할지 생각하기 5. axios instance관련 내용

폼데이터로 데이터를 서버와 주고 받는 방식이 어려울 것 같다. 우리는 필수정보를 받아 회원가입을 시킨 후 유저정보가 있는 상태에서 폼데이터에 추가정보를 작성하는 구조를 생각했는데, 폼데이터에서 post와 get방식의 요청만 가능하다는 문제가 있었다. 그래서 관련 내용을 찾아본 후 두가지 방법을 생각했다. 첫 번째 방법으로 post로 요청을 보내지만 method_field라는 것을 추가해 실제로는 put의 기능이 가능하도록 하는 방법을 찾았다. 하지만 이 방법은 restful api에 적합하지 않은 api를 사용해야 한다. 또한 json형식의 데이터와 파일을 한꺼번에 처리하는 방식은 서로 다른 리소르를 한번에 처리하기 때문에 적절한 설계가 아니라는 지적을 확인할 수 있었다. 필수정보를 받은 후 로그인이 아..

유저의 추가정보 받는 기능을 구현하고 있다. 예약 기능과 맞물려 계속 서버에 보낼 데이터 내용이 변경되면서 데이터를 받을 페이지도 몇 번 수정했다. 처음부터 구조를 제대로 잡는 것이 아주 중요한 부분임을 느끼고 있다. 평소대로라면 div안에 input이나 button등의 요소를 넣어 페이지를 구성했겠지만, 보내야 할 데이터 중 이미지파일이 포함되어 있어 폼데이터를 사용하기로 결정했다. 요소의 중요한 속성 중 하나인 enctype 때문인데, enctype='multipart/form-data'로 지정해 데이터를 전송할 경우 데이터는 여러 파트로 나뉘어 서버에 전송된다. 즉, 두 형태의 데이터 (이미지파일 / 유저가 작성한 내용) 를 한 번에 서버로 보낼 때 사용할 수 있는 방법이다. 폼데이터로 서버에 데이..

오늘 로그인, 회원가입 관련 유효성검사 코드를 만들면서 로그인과 관련된 기능은 거의 마무리를 지었다. 마음에 걸리는 부분은 토큰을 어디에 저장할지에 관한 문제이다. 지금은 로컬스토리지에 저장하고 있지만 보안 문제로 좋지 않은 선택이라는 글을 많이 봐 다시 한 번 토큰 저장 위치에 관한 내용을 찾아봐야 할 것 같다. 오늘도 서버와의 연결은 미뤄졌다. 서버와의 연결이 이뤄져야 마음놓고 다른 기능에 손을 댈 수 있을 것 같지만 이대로는 계속 일정이 늘어질 것 같아 일단 다른 기능을 먼저 구현하기로 했다. 내일부터 본격적으로 추가정보 받는 페이지를 만들어보려 한다. 사진 저장과 태그 저장이 추가정보 작성 페이지에서 가장 관건이 되는 부분일 것 같다. 내일은 그 두 부분에 관한 정보를 중점적으로 찾아봐야겠다.

이번 주는 항해99에 참여한지 절반이 넘어가는 주인 동시에 5월이 시작되는 주였다. 벌써 5월이라니 시간이 정말 빨리 지나간다. WIL을 쓸 때는 항상 첫 주가 떠오른다. 그 때와 비교했을 때 이제는 꽤 달라졌다고 말할 수 있다. 아무것도 모르고 리액트를 주특기로 선택했지만 이렇게 재밌게 8주를 보냈다는걸 생각하면 좋은 결정이었다. 실전 프로젝트로만 온전히 한 주를 보냈다. 우리 프로젝트는 선생님과 학생으로 구분된 유저가 화상채팅을 통해 한국어를 가르치고 배우도록 도와주는 웹사이트이다. 그렇다 보니 프로젝트의 메인 기능은 유저들의 1대1 화상채팅이다. 그 외에 화상채팅과 함께 쓰일 번역기능, 유저 목록과 관련된 기능, 유저 정보와 관련된 기능으로 나눌 수 있다. 물론 많은 변화가 있겠지만 우리팀이 생각하..

오늘로 실전프로젝트가 시작된지 일주일이 지났다. TIL만 봐도 알 수 있듯이 일주일동안 진행된 기획회의는 엄청나게 많지만 구체적인 내용은 아직 부족해 보인다. 그래도 우리팀이 아직 의욕이 많다는 점과 핵심 기능은 바뀌지 않고 계속 기능을 구현하고 있다는 점은 다행이다. 오늘 예약 기능과 관련된 api나 디테일한 설정을 정하면서 드디어 전체적인 기획안이 확정된 듯 하다. (물론 내일 디자이너 분들과 이야기를 나누면 또 변하는 부분이 생길 수 있다.) 개인적으로는 오늘 카카오 소셜로그인 기능을 구현해 봤다. 관련 공식문서를 읽어보면서 REST api라는 개념이 계속 등장해 찾아보니 api의 형태를 정하는 일종의 규칙이나 약속이었다. 변수명을 정할 때 작성자의 의도를 파악하기 쉽도록 정하는 것 처럼 api를 ..

기획이 계속 바뀌고 있긴 하지만, 일단 로그인과 회원가입 페이지를 만들고 있다. 회원가입을 할 때 추가정보를 함께 받기로 결정해 어떻게 페이지를 구성할지 고민했다. 처음에는 회원가입 페이지안에 필수정보, 추가정보 컴포넌트를 따로 만들고 필수정보로 입력한 데이터에 추가정보 컴포넌트까지 한 번에 모아 서버와 통신하려 했다. 하지만 생각해보니 필수정보는 무조건 받아야 하는 데이터이고, 유효성 검사까지 거쳐야하기 때문에 먼저 DB에 저장하는 편이 좋을 것 같아 아예 페이지를 나누는 것으로 구조를 바꿨다. 추가정보 페이지에서는 사진업로드, 태그로 키워드를 저장하기, select요소 등을 활용해 유저정보를 받을 계획이다. 우선 필수정보를 받아 서버와 연결할 준비를 마치고, mockapi.io라는 사이트에서 테스트를..

[출처: alskt0419님 벨로그 ] https://velog.io/@alskt0419/%EC%A7%81%EC%A0%91-%EA%B2%BD%ED%97%98%ED%95%98%EB%A9%B0-%EC%A7%88%EB%AC%B8-%EB%B0%9B%EC%9D%80-%EA%B8%B0%EC%88%A0%EB%A9%B4%EC%A0%91-%EC%A7%88%EB%AC%B8-%EB%AA%A8%EC%9D%8C 직접 경험하며 질문 받은 기술면접 질문 모음 해당 질문들은 제 이력서/포트폴리오를 기준으로 받은 기술면접 질문들입니다. 저는 풀스택 개발자로 프로젝트를 진행한 이력이 많았기에 백엔드 관련 질문들도 간간히 받았으니 백엔드 관련 velog.io [출처: alskt0419님 벨로그 ]

오늘 우리 프로젝트 주제에 대한 피드백이 있었다. 예상보다 훨씬 긍정적인 평가를 받아 기분이 좋았지만 그래도 고칠 부분이 많이 생겼다. 팀 내에서 상의해 와이어프레임을 짜다보니 개연성이 부족하거나 이상하게 빠진 부분이 있었는데 기획멘토링을 거치면서 그런 부분을 알 수 있었다. 또 이후 새로 들어온 디자이너님이 또 한 번 그런 부분을 언급하셨다. (역시 현업이다 ..! ) 여러 피드백을 수용해 선생님과 학생으로 구분했던 유저를 통합하고 유저들이 언어, 문화 등 관심사를 교류하는 웹사이트를 만들기로 했다. 결제시스템이나 첨삭, 선생님 프로필 등 여러 기능이 빠졌지만 오히려 화상채팅이라는 핵심 기능에 여러 부가기능을 추가할 수 있을 것 같다. 며칠에 걸친 회의와 주제 변경으로 조금 지치긴해도 와이어프레임은 훨..

문제: https://www.acmicpc.net/problem/1929 소수: 1과 자기 자신만을 약수로 가지는 수 1. for 문을 반복한 풀이는 시간초과에 걸린다. 2. 약수의 성질과 제곱근을 이용하기 - 2 이상의 모든 자연수N의 약수는 N의 제곱근을 기준으로 대칭 구조를 이룬다. (16의 약수 : 1 , 2 , 4 , 8 , 16 / 가운데 4를 기준으로 2 X 8 = 8 X 2 ) - 따라서 N의 제곱근까지만 확인해도 약수를 알 수 있다. (약수가 없으면 N제곱근 이후에도 없음) 3. [에라토스테네스의 체] 공식을 이용하기 - 2 , 3 , 4 , ... , N 까지의 수를 나열한 배열에서 소수를 찾는 공식 - 배열의 가장 작은 수 i 는 소수에 포함하고, i의 배수는 모두 제거한다. - 위의..