투명한유리구슬처럼보이지만 투명한유리구슬처럼보이지만

서버측에서 인증번호의 유효시간을 3분으로 정하긴 하겠지만 프론트에서도 명시해주기위해 3분타이머를 생각했고 인증완료를 할때 3분내로 인증번호를 입력하지 못하면 버튼이 비활성화되도록 하며 3분타이머를 만드는걸 했다. timeLeft 상태값은 타이머의 남은 시간을 저장하는 변수입니다. 초기값은 initialTime으로 전달된 값으로 설정됩니다. tick 메소드는 timeLeft 상태값을 1초씩 감소시키는 함수입니다. setInterval 메소드를 사용하여 1초마다 tick 함수가 호출되며, timeLeft 상태값이 변경됩니다. 타이머가 종료되면 clearInterval 메소드를 사용하여 타이머를 중지합니다. 이를 위해 useEffect 훅을 사용하여 컴포넌트가 마운트될 때 setInterval 함수를 호출하고..

localStorage 브라우저를 닫았다 열어도 데이터가 남아있다. 유효기간 없이 데이터를 저장하고, JavaScript를 사용하거나 브라우저 캐시 또는 로컬 저장 데이터를 지워야만 사라진다. 저장공간이 크다. useEffect(() => { localStorage.setItem('key', 10) }, []) useEffect로 확인해보면 브라우저가 마운트 됬을때 setItem 이용해서 localStorage에 키값은 ‘key’로 value는 10으로 저장하게되면 아래처럼 저장이 된다. 아래처럼 value를 객체형식으로 저장하면 useEffect(() => { localStorage.setItem('item1', 10) localStorage.setItem('item2', "20") localStora..

내 첫 프로젝트를 하게됐다. 처음에는 사전스터디 멤버들과 함께 하기로했었지만 백엔드 선택한 분들은 아직 자바공부중인데 내가 거기까지 알지 못하다보니 너무 추진한것도 있었다. 다행히 본격적으로 시작하기 전에 여러 사정으로 인해 프로젝트는 무산이 됬지만 남자친구랑 개인프로젝트로 남자친구가 서버단으로 나는 프론트단으로 프로젝트를 하기로했다 비록 첫 아이디어는 도영님이였지만 좋은 취지인거 같아서 계속 이어서 꼭 만들고 싶다는 생각이 들었다. 아직 리엑트강의를 처음부터 끝까지 들은게 아니여서 어려움이 많긴했는데 강의에서 내가 필요한 부분을 찾아본다던가 구글링, chetGPT로 찾아가면서 만드니까 조금씩 그래도 틀이 잡히기 시작했다. 비록 만들면서 css부분이라던가 리엑트에서 막히거나 안풀릴때 준영님이나 규식매니저..