# MonthSub Refactoring
[TIL] 0323
특정 지점에서 스크롤이 위로 튕기는 버그 수정→ onKeyUp에는 이벤트를 안걸어주었더니 해결됐다 (정확히 어떤 이유 때문인지는 모르겠다..)하지만 위 방법을 적용했더니 새로운 버그가 생겼다..textarea의 높이가 늘어날 때 'auto'로 잠시 바뀌면서 윗부분이 가
[TIL] 0322
textarea가 입력된 텍스트가 길어지면 세로 스크롤이 생기는데,화면 전체에도 스크롤이 2중으로 생겨서 사용성이 좋지 못했다.textarea의 텍스트가 길어지면 스크롤이 생기는 것이 아닌 heigth가 늘어나도록 수정했다→ 키 입력 이벤트가 발생할 때마다 textar
[TIL] 0313
배열 타입은 객체로 변환되어서 length가 먹히지 않는다 이렇게 감싸줘야한다 https://www.delftstack.com/ko/howto/javascript/javascript-length-of-object/ for 문을 돌려 동적으로 key를 접근하려면
[TIL] 0304
MonthSub Refacroting 가격 입력값 한글형식으로 포맷 구현 시도1 문제점 만단위가 넘어간 갔을 때 '만'이 안 붙는다 WaffleCard Refactoring 카드 리스트 처음으로, 맨끝으로 이동시켜주는 버튼 구현 디자인이 마음에 안들어서 가이드 슬
[TIL] 0303
MonthSub Refactoring seriesForm의 가격 입력 input의 값을 1000단위로 ','가 찍히도록 포맷팅되는 기능을 구현했다 1000단위로 ,를 찍으려면 뒤에서부터 숫자를 3개씩 세면서 ,를 찍어야한다 onChange가 될 때마다 input값을 가
[TIL] 0214
TypeScript Project 스터디에서 알게 된 점 이벤트 해제 안해주면 돔 사라져도 계속 남아있다 이벤트는 처음 한번만 걸어주는 게 좋음 xss: innerHtml을 쓸 시의 보안 문제 domparser 텍스트를 돔으로 만들어주는 api 기존에
[TIL] 0210
코드스피치 스터디 프로그래밍의 흐름 language code machine language WaffleCard Refactoring overflow를 감지해 정렬 바꾸기 scrollHeight, clientHeight(ref로 접근)를 사용해 자식의 높이나 너비가 부
[TIL] 0209
블로그 정리MonthSub Refactoringinput:checked 선택자 사용 시 형제 선택자에서 button은 선택이 안된다중복되는 css를 mixin파일에 저장해서 중복을 제거했는데, styledComponent로 해결해봐야겠음MonthSub 회의타입스크립트
[TIL] 0207
탭에 대한 정보를 상수로 저장해서 사용하도록 리팩토링했다탭포인터 이동을 해야하기때문에 인덱스가 꼭 필요했고상수를 객체들이 들어있는 배열의형태로 만들어서 구현했다프로퍼티에 대한 인덱스를 구할땐 findindex함수를 사용했다피드백인덱스 정보가 유의미한 정보는 아니기 때문
[TIL] 0203
Semantic Web기계에게 친화적인 웹데이터베이스화 시키기 좋은 웹검색 엔진이 유의미한 것을 추출해서 다양하고 유효한 검색결과를 만들어내게끔하기 위해 Semantic하게 html문서를 짜야한다시맨틱 웹에서 css를 어떻게 사용하면 좋은가?보통 selector사용 시
[TIL] 0201
Like컴포넌트에 api호출, contextApi로직이 포함되어있어서 storyBook에 작성할 때 오류가 났다 page컴포넌트에서 호출한 후 props으로 내려줘야했는데 depth가 너무 깊고, 2개의 page에서 사용중이었기 때문에 비효율적이라는 생각이 들었다
[TIL] 0130
useForm을 쓸 경우 storybook에 어떻게 작성할까 -> onsubmit과 initialvalue를 페이지 단에서 props으로 받는다 useForm의 handleChange를 input의 name과 value로만 받아야하다는 고정 관념 때문에 그렇게 받아질
[TIL] 0129
포스트는 api에서 불러온 데이터가 아닌 더미를 넣어준다 args는 props에 컨트롤을 달아줄 때 사용하고, 컨트롤이 필요 없는 경우에는 그냥 props처럼 넣어줘도 된다 버전이 2개 이상 필요할 땐 템플릿을 만들고 arg를 따로 지정한다 -> 다른 중복 코드 작
[TIL] 0125
스토리를 만들기 위해 함수를 내보내는데,그 함수의 args속성에 props값들을 할당해주면args를 인자로 받아 해당props가 포함된 컴포넌트를 반환한다.args === propsprops이 아닌 args로 받는 이유는 컨트롤러를 사용한 실시간 컴포넌트 업데이트 때문
[TIL] 0124
MonthSub 1. export 시 한객체로 묶어서 내보낼 때의 문제점 문제점 모듈 관리가 mixin이라는 객체를 통해 되고 있다. mixin 객체를 사용했기 때문에, mixin을 사용하는 모든 파일에서 mixin 객체를 import해서 프로퍼티로 접근하게되는데,
[TIL] 0121
코드스피츠 float 타스 토이프로젝트 환경 설정 타스환경설정 웹펙, 바벨 scss typescript 웹팩은 설치하고 최소한의 옵션을 설정해줘야 한다 require('path') node.js이 기본으로 제공하는 path모듈로 설치 없이 사용가능 파일/
[TIL] 0119
MonthSub 리팩토링 UseCheckBox 훅 생성(로직 구현) checked의 초기값도 상태로 설정해야함 부모에게 상태를 전달해줄 때 매번 변화하는 상태를 전달해야해서 useEffect에 의존성을 걸어줬다 페이지 컴포넌트에서 props으로 데이터를 전달
[TIL] 0118
오늘 학습한 것 > 1. 코드스피치 스터디 css rendering 강의 학습 js 프로토타입에 대해 이해안갔던 부분 학습 monthSub프로젝트 컴포넌트, 반응형 코드 리팩토링 1. 코드스피치 - css rendering graphic system - 점찍는(화면
[TIL] 0109
api로 데이터를 불러왔을 경우의 부모-자식 컴포넌트 간 렌더링 과정이 이해가 가지 않았는데다른 할일이 많아서 넘겼다가 주말인 김에 알아보았다.리액트 라이프사이클 개념을 서치해서 자료를 찾아보았지만 내가 궁금했던 점이 명쾌하게 해결되지 않아서 직접 콘솔을 찍어보았다.c
[TIL] 0107
axios함수를 추상화하는 작업을 진행했다. axios create함수를 사용해 모든 api에 필요한 공통 속성들을 정의한 커스텀 axios를 만들고, 후에 리프레시 토큰 로직을 추가할 것을 대비해 interceptor도 적용해주었다. 메소드 이름과 각 메소드에 필