리액트 공식문서를 읽는중, ... 스프레드연산자는 얕은복사이다!Note that the ... spread syntax is “shallow”—it only copies things one level deep. This makes it fast, but it also

모달 작업중, background를 클릭하면 closeModal 이 작동하여 모달을 닫아주는 동작이 되도록 하였다.하지만, 원래 생각과는 다르게, 모달내의 클릭이 되어도 모달이 닫혀버리는 현상이 발생하였다.코드를 먼저 보자면?이련 형태인데, 여기서 하위 modal-co

체크 버튼을 클릭시, 모달이 나온다.먼저 모달컴포넌트는 type Variant = "code" | "certification"에 따라 2가지 다른 모달을 보여준다.현재 하고 있는 형태는 인증과 관련된 certification Modal 부분을 구현할 것이다.newDon

이프로젝트는, 일단 todolist의 확장판이라 할 수 있다. 기본적으로 기능을 붙여야한다 생각하였을때, todolist의 crud 가 선행되어야하고, 이후 다른 데이터바인딩이 필요하며, 그 이후 세부적인 다른 멤버를 클릭시 다른 멤버의 데이터가 보여야한다던지, 스케쥴

Constructs a type with all properties of Type set to optional. This utility will return a type that represents all subsets of a given type.여기서 수정사항이 생

api axios instance 생성 index.ts 파일 생성 axios 인스턴스 생성 백엔드 접속정보로 create instance intercept if(error){ retrun response.data } throw error export get해오는 f

전체적인 UI 자체가 구획으로 나뉘어져 있다는 생각이 들어, grid layout이 제일 먼저 떠올랐다. 처음 적용해보는 것이라 어려웠지만.... 일단 해보고 수정해야지!처음엔 이렇게 시작했다.이제 각각을 컴포넌트로 수정해주고크게는 container, grid로 감싸주

재사용 가능한 UI component를 만들어보자!처음 UI대로 생각을 해보자면, outlined, fill, text 이렇게 3가지의 유형이 필요할 것 같았다.각각의 size와 color는 optional로!💡 return 문이 많은것은 전형적인 안티패턴이다……그렇

왜 이프로젝트에서 SCSS를 사용하나?그전까지 프로젝트를 진행하면서는 styled-components를 많이 사용하였다. 많이 사용했던 이유 또한 제일 처음 배울 때에 styled-components로 작업을 많이해서 익숙했었다. 하지만 익숙함에서 벗어나 이번 프로젝

UI퍼블리싱 버튼 컴포넌트 2시간텍스트 컴포넌트 2시간 //월home 페이지 레이아웃 2시간 입력 폼 4시간 - 입장코드입력폼, todo 입력폼, todo인증 입력폼 // 화studyroom 페이지 레이아웃 - 8시간 PC + mobile //수스터디 멤버 컴포넌

먼저 프로젝트를 하게된 계기라기보단, 내가 개발자가 되려한 계기를 생각해보면나는 개발자라는 직업은 내 머릿속으로 생각해 낸것을 결과물로 만들어낼 수 있는 사람이라 되고싶었다.하지만, 정작 내가 되고싶은 개발자와는 거리가 멀게 공부를 하고 있었다는 생각이 들었다.그래서,

npm과 yarn이 무엇이고 어떤게 더 좋은지 판단의 근거가 필요하여 찾아보았다!

onToggle() 로 열었다 닫았다, onOptionClicked()로 value 값 저장!이 부분을 나타내는 박스!드롭다운을 해주는 부분을 scroll을 준다!isOpen 일 때에만 보이는 컴포넌트!

탭 클릭시, 다른 컴포넌트 렌더링 해주는 형태!먼저, 탭이 그려지는 제일 위 컴포넌트에서 tab의 상태를 관리해준다.두개의 탭 밖에 없기에, 탭의 타입을 먼저 지정해주고, clickTab 이라는 함수로 클릭시, tab의 상태를 변경해준다.여기서 localstorage로

나가기 버튼을 클릭시 모달창 열려야함, 그렇다면 저 화면에서 모달창을 열리고 닫히게 해주면 되겠지!먼저, 모달을 구성하는 모달 컴포넌트!크게 보자면,<ModalWrap/> ,<ModalBackGround/>, <ModalContainer/>, 로 구성되

시작하기 버튼 클릭!내 애플리케이션에서 + 애플리케이션 추가하기 클릭!앱이름과 사업자명을 입력해주고, 저장!그 후 생성된 것을 클릭해보면!위와 같이 앱키가 생성된다!이후, 왼쪽 NavBar에 카카오 로그인을 클릭!활성화 상태 ON 클릭!OpenID Connect 활성화

클릭한 시점에서의 Date를 구해야한다.props로 받은 year 와 month를 기반으로 new Date()생성Date()객체 내 setMonth 함수를 이용하여 currentDate의 Month를 set 해주기 -> 여기서 -1을 해주는 이유는 이전 버튼이니 이전

query 이용 오늘 날짜 보여주기 \- jsonserver api 활용database : doneDateTime 상태 업데이트 \- changeDoneTodoItem, handleClickCheckBtn 함수 구현 \- changeDoneTodoItem 이용시,

- AxiosTodoService 에서 api 구현 - delete, isDone 기능 구현 - API 호출과 렌더링 작업 분리 - dayjs 활용 header 기능 구현 - `<Text/>` `<IconBtn>` 컴포넌트 재사용 가능하도록 분리

220717 기본적인 마크업 완료 emotion style 적용 시작 VAC pattern 적용 `` 컴포넌트 내 mouseon 상태 관리 `` 컴포넌트 내 visibleTodoCreate 상태 관리 다음주에 해볼 것 : 메모리 내 데이터 관리 -> api 연결 ->