회원가입 form을 통일하는 작업을 진행하였다. 회원가입 form은 2가지가 있었고 이것을 통일시키는 작업이였다. 경로또한 통일 시켜야했다. 전환을 하면서 JS파일을 TS로 바꾸고 class 컴포넌트를 function component로 바꾸면서 hook을 적용하였다. form을 통일 시키고 컴포넌트화 하는 작업은 완료했다. 다음주 부턴 적용한 함수들이 잘 돌아가는지 살피고 css를 적용해야한다. 주말 동안 sass 에 대한 공부와 회원가입을 하는 로직을 살펴 보아야 할것 같다.

next.js 의 pushRoute 에 대해서 알아 보았다. route, params, option을 매개변수로 받을 수 있다. 이 매개변수들의 설명은 아래와 같다. API: Router.pushRoute(route) Router.pushRoute(route, params) Router.pushRoute(route, params, options) Arguments: route - Route name or URL to match (일치하는 경로 이름 또는 URL) params - Optional parameters for named routes (명명 된 경로에 대한 선택적 매개 변수) options - Passed to Next.js (Next.js에 전달) Double Exclamation Marks ..

optional chaining typescript 3.7 버전 부터 제공 하는 문법이다. @babel/plugin-proposal-optional-chaining 바벨 문법을 통해서 사용이 가능하다. if , 삼항연산자 또는 && 을 사용해야할 때 optional chaining을 사용하면 코드의 길이가 줄어든다. lodash 다양한 메소드를 지원 한다. 복잡한 연산도 간단하게 해결할 수 있게 해준다. https://lodash.com/ react static react static method 로 static 키워드는 클래스의 정적 메소드를 정의합니다. 정적 메소드는 클래스의 인스턴스에서 호출되지 않습니다. 대신, 그들은 수업 자체에 부름을 받았습니다. 이들은 종종 객체를 생성하거나 복제하는 기능과 ..

function tpye을 설정해 줄때는 Function을 사용하는 것 보다는 () => void 이런 식으로 사용하는것이 좋다. const function add(){ cosnoel.log("함수") } add:Function add: () => void // 이 방법이 더 좋다. Formik (example) form 라이브러리 이다. 보통 Yup 이라는 라이브러리와 같이 쓰인다. Yup은 input 의 값을 지정해주는 역할을 한다. firstName: Yup.string() .min(2, 'Too Short!') .max(50, 'Too Long!') .required('Required') lastName: Yup.string() .min(2, 'Too Short!') .max(50, 'Too Lo..

버튼 ts 전환을 끝마쳤다. 디자인이 나오면 세세하게 변경 사항이 있을것 같다. 회원가입 컴포넌트의 전환을 시작했다. 회원가입 form의 통일 컴포넌트 수정등의 작업을 진행해야 한다. 진행하기 전에 구조를 파악하고 redux, redux-saga, 소셜로그인에 대한 공부가 필요하다. redux 간단 정리 1. action 폴더 애플리케이션에서 사용하는 명령어(action type) 또는 API 통신과 같은 작업을 하는 액션 메서드(action creator)를 모아둔 폴더 2. resucer 폴더 리듀서는 액션 메서드에서 변경한 상태를 받아 기존의 상태를 새로운 상태로 변경하는 일을 한다. 3. store 폴더 index.js 파일 하나만 있으면 미들웨어를 설정한다. 4. connect() 메서드 컴포넌..

Circle 버튼의 TS 전환을 이어서 진행 하였다. 두가지 아이콘을 CircleButton에서 받기 때문에 분기 처리를 해주어야 했다. className을 내려주는 문제를 해결해야 되는 상황이였다. 이런 식으로 되어 있는 구조에서 Image 컴포넌트를 CircleButton 컴포넌트로 포함시켜서 다른 Image 컴포넌트와 분기를 시켜줘야 하는 작업 이였다. 그중 className을 props로 받는 Image 컴포넌트에 대한 문제가 있었다. Image 컴포넌트를 합치기 전에는 ...rest 를 통하여 className을 BaseButton 컴포넌트로 내려주어서 처리 했지만 그렇게 내려버리면 Image 컴포넌트에는 className을 내려줄 수가 없었다. 내려 주더라도 Image 컴포넌트의 classNa..