오늘의 학습 내용 알고리즘 스터디 프론트앤드 개념 정리 스터디 새로운 배움 자바스크립트 문자열 메서드, replace의 함정? 자바스크립트에서 호이스팅이란 문제 상황과 시도, 해결 알고리즘 문제를 풀면서 주어진 문자열에서 특정 문자열을 반복해서 바꾸어야 하는 경우가 생겼다. 당연히 replace를 생각했고, replace를 반복해서 처리하면서 문제를 해결했다. 다른분들의 풀이와 비교해보니 똑같이 replace를 사용했지만 반복하지 않고 한번에 처리하신 분이 계셨다. 알고보니 replace는 비교문자열을 정규표현식으로 작성할 경우 발견한 첫번재 동일문자만 대체 하는 것이아니라 문자열 내의 모든 동일한 문자열을 변경해준다고 하였다. 느낀점 자주 사용하는 메서드지만 상세한 사용방법을 잊지 않도록 꾸준히 메서드..

오늘의 학습 내용 리액트 숙련 강의 수강 리액트 숙련 주차 과제 제출 ( 내가 만든 TODO 서비스 리팩토링 하기,vercel로 배포하기) 새로운 배움 리액트 Redux 사용하기 리액트 개발 패턴 Ducks 패턴 리액트 라우터 돔 ( 페이지 이동 처리) vercel로 배포하기 문제 상황과 시도, 해결 리액트 리덕스에 대해 처음 공부했다. 전역으로 여러 데이터를 프롭스로 내려 주는 과정을 반복하는 것에 대한 문제 (props 드릴)를 해결하기 위한 방법중에 하나인 리덕스를 이용한 전역 스토어를 사용하는 방법을 배웠다. 간단한 카운터를 리덕스로 만들때는 편하다고 생각했는데 막상 내가 만들었던 투두프로젝트를 리덕스로 고쳐보려고 하니 어려웠다. 특히.. 투두 하나하나의 값과 또 그 값들을 모두 가지고 있는 투두..

오늘의 학습 내용 리액트 숙련 강의 수강 새로운 배움 리액트 useState 비동기 진행 (함수형) 리액트 자주 사용하는 훅에 대한 정리 (useState, useEffect, useRef ) 리액트 전역 관리 방법 1 (contextApi) 리액트 최적화 방법 1 (React.memo, useCallback, useMemo) 리액트 라이프 사이클 문제 상황과 시도, 해결 함수형 컴포넌트에서 useState를 통해서 여러 state를 관리하고 있었다. 하나의 state가 업데이트 되고 난 다음 다음 순차적으로 다른 동작을 구현했어야 했다. 자꾸 값이 일정하게 반영되지 않아서 확인해보니 리액트의 훅들은 배치로 처리 된다고 하였다. (비동기처리) 처음에는 이 문제를 해결하기 위해서 리액트 useEffect를..

Today I Learned 오늘의 학습 내용 리액트 숙련 강의 수강 리액트 TODO 프로젝트 리팩토링 1 새로운 배움 Css in JS 리액트를 리액트답게 사용하기 실제돔 접근 vs 가상돔 접근 문제 상황과 시도, 해결 리액트 숙련 주차 첫시간에 CSS in JS에 대해 배웠다. CSS를 javascript 코드로 작성하는 것을 도와주는 라이브러리들로 대표적인 styledComponent의 기본적인 사용법도 익혔다. 기술매니저님 코드 리뷰를 통해 리액트 프로젝트 코드를 리뷰 받았다. 말씀해주신 수정사항들을 코드에 반영하였다. 처음 작성했을때 보다 코드가 깔끔해졌다. 처음엔 state를 많이 관리하고 있었는데 중복되는 state들을 줄여보는게 좋을것 같다고 말씀해주셔서 시도하고있었다. 객체를 담은 배열자..

오늘의 학습 내용 리액트 입문 강의 수강 리액트 관련 개념 공부 간단한 로그인 페이지 실습 리액트로 간단한 TODO 서비스 구현 새로운 배움 리액트 개념 (jsx, props, state) JSX 문법 hook은 비동기로 동작한다! 협업을 위한 확장자 .jsx 문제 상황과 시도, 해결 실제로 배운 개념과 내용들을 바탕으로 우선 로그인 페이지를 실습하였다. Input 태그를 두개 만들고 하나는 타입을 text, 하나는 password로 두었다. 또 label 태그를 두어서 input 태그의 아이디와 for 속성으로 연결하였다.이렇게 코드를 작성하니 총 두개의 오류가 발생했다. 코드는 정상적으로 실행되는데 브라우저 콘솔에 에러가 발생했다. 에러의 내용이 찝찝해서 검색하니 하나는 password로 인풋 태그의..

오늘의 학습 내용 리액트 입문 강의 수강 리액트 관련 개념 공부 새로운 배움 리액트 기초 개념 (CRA, JSX, 컴포넌트) JSX 문법 문제 상황과 시도, 해결 리액트 입문 강의에서 간단한 실습을 하는데 리액트를 하나도 몰라서 조금 해맸다. 입문 강의에서는 리액트에 대한 개념도 다루지만 실습을 하고 난 다음에 다루기 때문에 실습 과정에서 우여곡절을 겪었다. 기초적인 부분들이라 다루는 강의도 없어서 리액트 책을 정독하면서 찾았다. 멀티라인 return 리턴을 할때 어떤 예제 케이스는 소괄호가 없고 어떤 경우는 소괄호 안에서 리턴을 하고 있었다. 알고보니 멀티라인의 경우 소괄호가 필수였다. JSX 문서 부모태그 필수 간단한 실습과제를 혼자 하면서 처음으로 JSX문서를 다루었다. 일단 HTML이랑 비슷해서 ..