react8 [React] Side Effect / useEffect / Clean up Effect 부러질지언정 휘어질 수 없다. Side Effect 란? 이건 설명을 듣는 순간부터 헷갈렸다. 위에 말이 뭘 뜻하는가? 블로깅을 무조건 해야 한다는 말이다. 마음이 시키는 블로깅 됐고, 본론으로 들어간다. side effect란 함수가 실행되면서 함수 외부에 존재하는 값이나 상태를 변경시키는 등의 행위를 말한다. 이렇게만 말해서 알아듣는 사람은 코딩 천재가 아닐까 싶다. 물론 난 천재는 아닌듯하여 예제까지 같이 적을 예정,,,, 예를 들어 함수에서 전역변수의 값을 변경하거나 혹은 함수 외부에 존재하는 버튼의 텍스트를 변경하거나, 파일을 쓰거나, 쿠키 저장, 네트워크를 통해 데이터를 송신하는 것 등이 있다. 좀 더 자세히 설명을 붙이자면 React 컴포넌트가 화면에 렌더링 된 이후에 비동기로 처리되어야 하.. 2023. 1. 17. [React] map 함수 적용시 key props를 부여하는 이유 날 죽여라 리액트 map 함수 적용 시 나오는 오류 map 함수를 생각없이 사용하다 보면 나오는 경고 창이 있다 Each child in an array should have a unique “key” prop. 너 key값 지정 안해줬음 너 동일한 형제들로 구성된 list(map에서 뿌려준 그 lists) 유니크한 키 prop을 줘야 함 이라고 말하고 있다. key 값이 왜 필요한데? 예를 들어 map으로 리스트를 하나씩 뿌려준다고 가정해 보자. 리액트는 내용이 바뀔 때 다시 렌더링을 해주는데 5개의 리스트 중에 하나의 리스트만 바뀌었다면 리액트가 하나씩 리스트를 읽다가 여기서 달라졌네?라고 파악한 뒤 전체를 재렌더링 하는데 그걸 방지하기 위해서 각각의 요소들에게 key값을 선물하는 것이다. 그렇게 되.. 2023. 1. 17. [React] SPA 란? 불안하게 오늘 작성한 코드들이 날 괴롭히지 않는다... 1. SPA란? SPA는 Single Page Application의 약자이다. 예전에 웹 페이지에서는 페이지를 보여줄 때 여러 페이지로 구성이 되어있었다. A html, B html, C html.... 그리고 페이지를 로딩할 때마다 서버에서 리소스를 전달받아와서 렌더링 했다. 즉, 웹 애플리케이션 뷰를 서버에서 담당했었다. 하지만, 규모가 커지고 사용자와의 상호 작용이 많아짐에 따라, 데이터 정보 전송 과부하로 인한 속도 저하 등 문제점이 생기게 되었다. 그래서 요즘 나오는 라이브러리 또는 프레임워크는 뷰 렌더링을 서버가 아닌 웹 브라우저가 담당한다. 예전에는 페이지를 요청할 때마다 서버로 접속하여 받아왔기 때문에, 페이지가 매번 새로고침 되었지.. 2023. 1. 16. [React] <a> 태그 사용시 오류 해결 Router test 롤백 6번 ^^... 오류 발생 The href attribute requires a valid value to be accessible~~~라는 오류가 나왔다 Router를 공부하던 도중 그래도 꽤 많은 오류를 만났다고 생각했는데 아직도 빨간 글씨는 마주치면 어색하다. 피하진 말아야지. 본론으로 들어가서 이 오류가 무엇을 뜻하는가? 영어의 중요성 프런트 개발을 하다 보면 많이 작성하게 된다. a태그의 attribute인 href=""또한 같이 만나게 된다. React를 사용하지 않았을 때 작성했던 코드처럼 똑같이 작성했다. 하지만 여기서 오류를 맞이하게 되었다. The href attribute requires a valid value to be accessible. Provide.. 2023. 1. 16. 이전 1 2 다음 반응형
