React : state의 초기 값을 null로 하면 안되는 이유
위와 같이 로그인 컴포넌트가 있다는 가정하에 위 처럼 username 과 password의 state가 있다고 해보자 그리고 위 state를 이용해서 input에 유저가 value를 넣을때마다 account의 username과 password의 값이 바뀐다고 해보자. 그러한 상태에서 state의 username을 지우게 되면 어떻게 될까? 이러한 상태에서 웹을 리로드해도 아무런 문제가 뜨지 않는다 하지만 input에 문자를 입력하게 된다면 위와 같은 경고가 뜨는것을 확인할수가 있다 이 경고는 무슨 의미일까? input의 value값을 state의 account 값으로 해놓으 상태이다 이 상황에서 account의 username이 지워지거나 null값이 되면 value의 값또한 null이 될것이다. val..
React route(react-router-dom) 공부 [2]
현재 url에서 다른 url로 이동 할 경우 콘솔창의 네트워크 부분을 보면 bundle이 계속해서 불러와지는 것을 볼수가 있다. 글쓴이가 만든거처럼 간단한 앱이면 속도적인 측면에서 별 차이가 없게지만 규모가 큰 앱일 경우 속도가 느려지는 그러한 상황이 발생할수가 있다. 이러한 문제점을 해결할수 있는 방법중 하나가 react-router-dom 의 컴포넌트중 하나인 Link컴포넌트를 이용하는 방법이다. navbar.jsx 파일을 연 다음에 먼저 Link를 import해주고 태그들을 Link 컴포넌트로 바꾸고 ahref들을 to 속성으로 바꾸면 된다. 다른 url을 클릭을 해도 bundle을 불러오지 않고 처음에 불러온 bundle이용하는것을 볼수가 있다.
React router (react-router-dom)공부 [1]
https://drive.google.com/open?id=1Q1wY2rf1yqFVWLsBlz9K7uxh4ZaBV_3f router-app.zip drive.google.com 해당 파일을 받고 열어보면 이러한 간단한 웹페이가 나온다 일단은 router를 기능을 사용하려면 react자체 내에서는 router기능이 없기 때문이 react-router-dom이라는 라이브러리를 설치해야한다. 설치를 하고 index.js로 가서 import를 해주자 import를 해주고 해당 컴포넌트를 app로 둘러 싸준다. BrowserRouter 컴포넌트는 history API (pushState, replaceState and the popstate event)를 이용해 URL과 UI의 싱크를 맞춘다. 그리고 나서 app..