Navigate2 [React] Navigate ...? Link 는 특정 주소로 이동해주는 태그였다면, Navigate 는 특정 행동을 했을 때 해당 주소로 이동해줄 수 있게 만들어준다. 1. useNavigate 사용하기 useNavigate는 양식이 제출되거나 특정 event가 발생할 때, url을 조작할 수 있는 interface를 제공한다. ☑️ useNavigate의 인자들 navigate("../success", { replace: true}); 첫 번째 인자로는 주소를 받으며 두 번째 인자로 { replace, state } 인수를 사용한다. replace (true or false) true를 사용한다면, navigate에 적힌 주소로 넘어간 후, 뒤로가기를 하더라도 방금의 페이지로 돌아오지 않는다. 이 때는 자신의 메인 페이지 ("/")로 돌.. 2022. 2. 28. [React] Westagram 코딩 (1) - login HTML과 CSS, JAVASCRIPT(자바스크립트)를 이용해서 만들었던 인스타그램 클론 코딩을 REACT(리액트)를 이용해서 만들어보았다. 우선 이번 시간은 로그인을 리액트로 작업한 것을 포스팅하고 다음에 이어서 메인 페이지 작업을 리액트로 만든 것을 포스팅하려한다. 리액트로 구현한 로그인페이지 완성본 위 영상을 보면 알 수 있듯이, ID와 PassWord에 각각 제한 조건이 걸려있다. 그 조건들을 모두 충족해야 로그인이 가능하며, 그 조건을 모두 만족하면, 아래의 로그인버튼이 활성화가 되면서 cursor모양도 pointer로 바뀌게 된다. 그 후, 버튼을 클릭시 main화면으로 이동하는 것 까지! 이 세가지를 모두 리액트를 사용해서 만들어보았다. 1 step ) 모든 과정을 거꾸로 생각해보기 ! 리액.. 2022. 2. 24. 이전 1 다음