본문 바로가기

Javascript36

[React] Side Effect / useEffect / Clean up Effect 부러질지언정 휘어질 수 없다. Side Effect 란? 이건 설명을 듣는 순간부터 헷갈렸다. 위에 말이 뭘 뜻하는가? 블로깅을 무조건 해야 한다는 말이다. 마음이 시키는 블로깅 됐고, 본론으로 들어간다. side effect란 함수가 실행되면서 함수 외부에 존재하는 값이나 상태를 변경시키는 등의 행위를 말한다. 이렇게만 말해서 알아듣는 사람은 코딩 천재가 아닐까 싶다. 물론 난 천재는 아닌듯하여 예제까지 같이 적을 예정,,,, 예를 들어 함수에서 전역변수의 값을 변경하거나 혹은 함수 외부에 존재하는 버튼의 텍스트를 변경하거나, 파일을 쓰거나, 쿠키 저장, 네트워크를 통해 데이터를 송신하는 것 등이 있다. 좀 더 자세히 설명을 붙이자면 React 컴포넌트가 화면에 렌더링 된 이후에 비동기로 처리되어야 하.. 2023. 1. 17.
[React] React Router 비 좀 그만내려어어어어어어 제발 Router 란 ? (22.03.15 기준) 최근에 react-router가 v5에서 v6로 업데이트가 되었다! v6 기준으로 블로그를 작성할 예정이니 참고 바래용 Creat-React-App 줄여서 CRA에는 Routing을 하는 기능이 들어있지 않아서 가장 많이 사용하는 Routing-Solution인 react-router-dom을 추가해서 Routing을 구현한다. 사용자가 입력한 주소를 감지하는 역할을 하며, 여러 환경에서 동작할 수 있도록 여러 종유의 라우터 컴포넌트를 제공한다. 이중 가장 많이 사용하는 라우터 컴포넌트는 BrowserRouter와 HashRouter이다. BrowserRouter : HTML5를 지원하는 브라우저의 주소를 감지한다. HashRo.. 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.
반응형