Youngble_개발스토리

다음과 같이 useEffect를 사용하여 jQuery메서드 on 으로 해당 요소를 이벤트 등록을 해주었다. 그런데 해당 태그를 눌러 이벤트가 발생하면 2번이 실행돼서 왜이러지? 찾아보니깐 useEffect부분에서 두번 실행돼서 등록이 2번 되니 한번 클릭해도 두번의 이벤트가 발생하는 것이였다. 처음엔 랜더링이후 state값이 변하는게 있기때문에 한번더 했다라고 생각했는데, 해당 컴포넌트에서는 상태값을 쓰지도 않기때문에 이에 해당해서는 안되었다. 그래서 useEffect이 한번만 실행해야하는데 2번이 되는 이유를 찾아보니 index.js에서 strictMode가 존재하면 두번 랜더링된다고하는데 이 strictMode는 검사 도구라고 생각하면되고 개발 모드에서는 오류를 잘잡기위해 두번씩 렌더링을 한다고 한..

화요일부터 첫 출근하는날 회사 현재 시스템이 원래 풀재택이란 엄청난 혜택이 있었는데(이미 다른사람들은 다 풀재택이였다)입사 적응을 위해 일단은 당분간 3일 출근, 2일 재택 하기로 했었는데 첫날 회의에서 다른팀원들 또한 대면업무 vs 재택에 대한 회의가 좀 길어졌다. (제발 출근해도 2틀만 했으면.. 나도 그렇고 다들 거리가 멀어서..) 입사 자기소개를 하고 이사님이 현재 서비스 로직, 어떤 시스템으로 교체/관리 하는지에 대한 설명을 듣고 어떤식으로 업무를 분담할지 정하였다. 내 업무는 기존 레거시 시스템 서비스를 리액트로 변경 고도화작업(포팅, porting)을 진행하기를 원했고 이에 맞는 WBS 작성, 회사 목표에 따른 개인 OKR 작성 미션을 받았다. 적응 기간이긴한데 아직 OJT 확립은 만들어가는..

한것 기존 리액트 프로젝트 js 파일에서 tsx 타입스크립트로 교체 적용 타입스크립트 적용하면서 Generic 이라는 개념이 중요할거 같아서 나중에 더 공부할것. 그외에 type, interface 로 재활용, 코드수 감소 , 가독성 증가 활용 import export 로 컴포넌트내에서 코드 사용 최소화 및 image 파일 declare 처리하여 이용 할것 storybook 사용 방법 알아볼것 프로젝트 참고 책 조사할것 (DOM을 깨우치다, HTTP: the definitive guide(웹은 어떻게 동작하는가), 디자인패턴 관련책 ) 자동배포관련 알아볼것 current 값 에러 고치기 1. if 조건으로 null 일때 return 해버리게하면 아래 Id.current.value 부분 에러사라짐 2. o..

리액트를 사용하면 JSX 문법을 자연스럽게 접하게 된다. 막상 쓰는법은 알지만 이것이 정확히 무슨뜻이고 무슨 원리이고 어떤 배경이 있는지는 자세히 알지못했다. 풀어쓰면 Javascript XML 인데 이때 XML은 html과 비슷하지만 다른 확장성 마크업 언어이다. 따라서 무엇이 JSX이고 그안에 있는 XML 은 무엇인지 정리해보기로 했다. XML eXtensible Markup Language 약자이며 확장성 마크업 언어 이다. 보통 XML 형태는 html 태그와 비슷하지만 분명한 차이점이 많이 존재한다. XML은 data를 전달하는 데에 포커스를 맞춘 언어이고 HTML은 data를 표현하는 데에 포커스를 맞춘언어이다. XML은 HTML과 달리 tag가 미리 정의 되어 있지 않다. 장점으로는 문서 자체..