오늘 작업한 내용 아래와 같다. 아직 로직 구현이 없고 CSS 디자인만 하는중이다. 디자인도 시간이 꽤 걸린다. 아쉬운점: 토이 문제를 제대로 풀고 싶은데, 프로젝트 일정을 지키느라 엄두가 나지 않는다... 매일 정신차리자 말하지만, 지키기가 쉽지 않다. 아무래도 주말에 복습을 해야겠다...!!!!!!!!!!

메인 페이지의 Nav Compnent 와 Manual page 를 개발했다. Nav Component 를 구현할 때는 props 를 사용해야 했는데, 관련 모듈을 설치하지 않아 오랜 시간 헤맸다. 가정통신문 같은 경우엔 박스 사이의 공백이 생겨서 메꾸느라 시간을 보냈다. 의아한 점이 있는데, 페이지를 축소하면 오른쪽 로그인 페이지는 크기가 변하지 않는데, 왼쪽 가통 페이지의 경우 크기가 축소되는 것을 확인했다. 물론 flex box 를 적용했기 때문인것 같은데... 로그인 페이지도 마찬가지라는게 함정... 차후 미디어 쿼리를 적용해야 하는데 관련하여 의견을 더 나누어 봐야겠다. . CSS 작업에 이렇게 시간이 많이 걸릴줄은 몰랐다; 꾸준히 작업해야겠다.

오늘 한일 App.tsx Route 분기(페이지 기준) pages tsx 형식으로 변경: ReactElement(return ) 를 사용하기 위함.(Typescript 검사를 통과한다.) signin page 개발 signin components 개발 느낀점 typescript 와 CSS 가 익숙하지 않아 속도가 붙지 않았다. CSS/Styled-component 를 연습하기위해 메인 페이지(로그인페이지)를 최대한 자세히 구현하려고 노력했다. 어느정도 감이 잡히는 것 같긴 한데, 더 분발해야겠다.

Node version: 12.19.0 Set up React/Redux/Typescript : https://www.youtube.com/watch?v=WpvIihorarA 2. Set up Prettier/Eslint flamingotiger.github.io/javascript/eslint-setup/#2-2-eslint-config-airbnb-base-%EB%A1%9C-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0 npm i -D eslint eslint-config-airbnb eslint-config-prettier eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-prettier eslint-plugin-react e..

Framework(프레임워크) 프레임워크는 뼈대나 기반구조를 뜻하고, 제어의 역전 개념이 적용된 대표적인 기술입니다. 소프트웨어에서의 프레임워크는 '소프트웨어의 특정 문제를 해결하기 위해서 상호 협력하는 클래스와 인터페이스의 집합' 이라 할 수 있으며, 완성된 어플리케이션이 아닌 프로그래머가 완성시키는 작업을 해야합니다. 객체 지향 개발을 하게 되면서 통합성, 일관성의 부족이 발생되는 문제를 해결할 방법중 하나라고 할 수 있습니다. 프레임워크의 특징 특정 개념들의 추상화를 제공하는 여러 클래스나 컴포넌트로 구성되어 있습니다. 추상적인 개념들이 문제를 해결하기 위해 같이 작업하는 방법을 정의합니다. 컴포넌트들은 재사용이 가능합니다. 높은 수준에서 패턴들을 조작화 할 수 있습니다. 프레임워크 예시: 자바스크..

오늘 한일 프로젝트 아이디어 선정 → 그림일기 팀장, 팀 이름, 프로젝트 이름 → 팀 이름: summer vacation 프로젝트 이름: RoyalDiary 프로젝트 기획 및 범위 설정 → 완료(wiki) 시스템 아키텍처 설계 → figma 완료 스키마 작성 -> 완료. 수정 및 보완 필요 API 작성 -> 완료. 수정 및 보완 필요 담당 파트 첫화면: 로그인 API, 로그아웃API, 회원가입이동, 소셜로그인 구현(모달창) => OAuth, 페이지 이동 시 CSS 효과 사이트 메뉴얼: 디자인 + GIF 일기쓰기1: 그림판 적용, 다그렸다버튼 누르면 multer API. 일기쓰기2: 깍두기 칸에 글쓰기 구현. 다썼다버튼 누르면 (이미지 url + 날짜 + 날씨 + 제목 + 기분 + 장소) 서버에 전송 AP..