반응형 항해 중/7주차 클론 코딩7 [클론코딩] 6일차 마무리 아침에 회의 진행 했을 때 CSS는 더이상 만지지 않기로 했고, S3에 배포했다. (사이트 주소) http://team2instagram.s3-website.ap-northeast-2.amazonaws.com Instagram team2instagram.s3-website.ap-northeast-2.amazonaws.com (유튜브 실행영상) https://www.youtube.com/watch?v=DxQZ4e5tRxw 한 주 동안 고생했다!!!!!!!!!!! 2021. 12. 18. [클론코딩] 5일차 진행상황 오늘 한 일 1) api 수정된 부분 설명 듣고 블로그에 정리 2) 게시물 상세 페이지, 게시물 작성 페이지 서버와 연결 시도 -> 게시물 상세 페이지에서 댓글 작성이 안되고 있음. TypeError: Cannot read property 'split' of undefined at module.exports (/home/ubuntu/temp/middlewares/auth-middleware.js:6:51) at Layer.handle [as handle_request] (/home/ubuntu/temp/node_modules/express/lib/router/layer.js:95:5) at next (/home/ubuntu/temp/node_modules/express/lib/router/route.js.. 2021. 12. 17. api, instance(instanceMulti), token 사용해서 서버와 통신하기 instance : axios를 미리 정의 해놓는 곳 intercepter : request, response를 미리 설정해서 return 해주는 곳 : instance를 도와주는 역할 instance 안에 있는 intercepter 폴더 구조 api 폴더 더보기 // src/shared/api/comment.js import instance from '../instance'; // 댓글 조회 export function getComment(postId) { return instance({ method: 'GET', url: `/api/comments/${postId}`, }); } // 댓글 작성 export function writeComment(postId, content) { return inst.. 2021. 12. 17. [클론코딩] 4일차 진행상황 오늘 한 일 1) 백엔드분들이 서버 열어주셔서 api.js에 서버 주소 연결함 2) CORS 오류가 발생해서 proxy 설정함. : package.json에 아래 코드 삽입 해주고 서버 주소 넣어주면 됨 (공식문서 참고) "proxy": "http://13.125.45.147/" -> 팀원분이 빼는 게 좋을 것 같다고 해서 뺌 (나중을 위해 블로그에 남겨 놓음) 3) PostWrtie.js CSS 대폭 수정!! 4) 게시물 상세 페이지에서 사용자가 입력한 댓글에만 댓글 삭제 버튼이 나오도록 코드 수정 5) 게시물 상세 페이지에서 사용자가 작성한 게시물에만 게시물 삭제 버튼이 나오도록 코드 수정 : 4번과 동일한 과정으로 코드를 구현 하였다. 6) Reducer에서 action.payload.xxx은 넘어.. 2021. 12. 16. [클론코딩] 3일차 진행상황 오늘 한 일 1) 아침에 PostWrite 반응형으로 만드려다가 실패 -> 추후 팀원들과 같이 논의 해볼 예정 2) PostDetail.jsx 영역 나누기 (float:left를 줬음) 3) 각 영역에 필요한 기능 구상 및 구현 4) 전체적인 View 완성 5) 메인 페이지 / 마이페이지 구현 해주신 팀원분과 Git에 merge 하던 중에 겹치고, 사라지는 문제가 발생해서 어느정도 형식 맞춰서 merge 함 (post modules에 겹치는 부분이 많아서 오류가 발생한 듯 하다.) 6) 좋아요 기능 구현 중 팀원들과 상의할 부분이 생겨수 19시 회의에서 말씀 드릴 예정! - 좋아요 / 취소 API에서 좋아요를 눌렀을 경우, 좋아요를 취소 할 경우 구분이 안되어 있음. -> 이 부분은 백엔드 분들이 Sch.. 2021. 12. 15. [클론코딩] 2일차 진행상황 오늘 한 일 1) 게시물 작성 페이지 View 잡음 2) 게시물 작성 페이지 CSS 잡음 3) 게시물 작성 시 이미지 미리보기 구현 + 글 작성하는 부분 구현 4) 이미지와 글 작성 안했을 경우 버튼 비활성화 시킴 (disabled 설정) 5) 이미지 업로드 버튼 시 [게시물 이미지 업로드] API 요청 6) elements 폴더에 컴포넌트들 -> styled 부분은 각 요소를 사용 할 때 설정 할 수 있도록 props로 바꿨다. const ElTextarea = styled.textarea` border: ${props => props.border}; width: ${props => props.width}; font-size: ${props => props.size}; padding: ${props =.. 2021. 12. 14. [클론코딩] 1일차 진행상황 오늘 한 일 1) 어떤 사이트를 클론코딩 할 지 정함 2) API / 와이어프레임 구상 및 설정 3) 프로젝트 패키지 설치 및 세팅, View 세팅 4) Git repository 생성 5) Header 구현 (gap 새로 알게 됨) : gap을 사용하면 간격을 얼마나 둘건 지 설정 할 수 있음 6) 게시물 작성 페이지, 게시물 상세 페이지 모달창 구현 구현 해야 하는 페이지 및 기능 : 상세 페이지(모달), 게시물 작성 페이지(모달)을 맡아서 진행하게 되었다. 공통적인 부분 : 모달창 구현하기 상세 페이지 : 이미지 / 사용자 아이디 / 게시물 내용 / 좋아요 버튼 / 좋아요 갯수 / 댓글 목록 / 댓글 작성창 및 작성 버튼 작성 페이지 : 이미지 미리보기 + 업로드 / 게시물 내용 / 작성하기 버튼 .. 2021. 12. 13. 이전 1 다음 반응형
