안녕하세요! 구름톤 유니브 벚꽃톤이 다 지난 후 회고록을 작성해보려 합니다,,우선 저는 구름톤 유니브가 생긴 1기 부터 참여하고 싶었었는데요.좋은 기회로 1기 참여자 중 멋사 동기인 정민 언니가 대표로 함께하게 되어 저는 2기 미르미로 참여할 수 있었습니다 ㅎㅎ자소서도 열심히 써서.. 합격하고 바로 참여하게 되었어요첫 활동으론 온보딩 세미나 였는데요. 구름 회사에 가볼 수있는 기회가 될 테니 반드시 오프라인으로 참여했습니다!1월까지 인턴을 하고, 2월엔 무엇을 해볼까.. 하던 도중 구름톤은 저에게 아주 좋은 기회였어요 블랙 앤 화이트로 꾸며져 있던 구름 ,, 내부의 웅장함 느끼고 갔습니다 이렇게 시작해서! 저는 지원자 수 1등 백곰팀 🐻❄️ 에 합류하게 되었습니다우선 저희팀이 큰 판넬을..
{ handleSendVerification(); }, }} /> {showVerificationInput && ( console.log('확인 버튼 클릭'), }} /> )} navigate('/login')} /> react-hook-form 을 사용할 때,폼에서 전체를 관리하고 있으며 inputForm 컴포넌트 안에 버튼을 눌렀을 때, 해당 값에 대한 yup 에러를 잡고 싶다면?그리고 그 잡은 에러를 Input Form 안에 에러메세지로 표기하고 싶다면,,,?예를 들어 이런 상황에서, 이메일을 작성 하지 않고 inputForm 컴포넌트 안에 있는 인증번호 발송 버튼을 누르면전체 fo..
원래는 이렇게 이전 데이터를 로컬 스토리지에 저장했다. 유저 정보를 로컬스토리지에 저장하는게 말이 되는가 싶겠지만해커톤 당시에는 너무 바쁜 나머지 상태관리를 도입할 여유가 없었다. 그래서 백엔드 개발자의 의견을 수렴하여 Secure localStorage 를 사용하고 있었던 것이다. 근데 이제 newVecgom 을 들어가는 만큼, 더이상 이런 코드는 필요가 없다고 생각했고..zustand 를 써보려 한다. > Zustand 란? > 왜 Zustand 를 도입했는지 ? 이렇게 세팅을 해준 후, 전역 값을 api 호출 전에 저장해주었다.그리고 다른 페이지에서 다시 가져오는 코드를 적었고,콘솔에 잘 찍히는 것을 확인할 수 있었다!
이번엔 AudioRef 에 대한 리펙터링을 진행할 것이다. 컴포넌트의 간단한 구조는> WritePad > Letter > ImageUpload > > > Recode > 이미지 첨부 Button가장 상위의 컴포넌트에 선언되는 form 의 default value 에 audio Ref 값을 추가해준다. 그리고 나서 복잡하게 컴포넌트의 props 로 전달하고 있던 부분을 모두 제거한다.그 안에 있는 Letter 컴포넌트에서도 제거 react-hook-form 은 혁신 인 것 같다.. 이게 진리고 이게 답이다.. 코드가 점점 더 깔끔해지고 있고, 컴포넌트 사이에 props 없이 값..
컴포넌트의 간단한 구조는 > WritePad > Letter > ImageUpload > > > Recode > 이미지 첨부 Button 즉, 이미지를 보여줘야하는 곳과 이미지를 첨부해야 하는 곳의 위치가 다르기 때문에, 늘 그렇듯 Ref 를 사용했다. Ref 를 필요한 각 컴포넌트의 Props 로 보내주듯이 구현을 했다.즉, react-hook-form 을 사용하고 있으면서 장점을 전혀 활용하고 있지 못했던 것이다. 이렇게구현하면, 코드에 inputRef 가 남발한다. 이렇게 가장 상위의 컴포넌트에서 props 사용해서 가장 하위의 컴포넌트까지 전달해주는 형식을 띄고 있는 것..
no such file or directory, open 'E:\projects\myCore\myCore\.next\BUILD_ID 오류 해결 next project 를 start 했을 때 npm run start 예를 들어 이런 식으로 오류가 난다. (다른 곳에서 캡쳐) 1. update node and next latest version. 2. npm uninstall next 3. npm install next 4. npm run build 5. npm run start 이렇게 버전 업데이트 하고, 다시 next 설치 후 빌드 해주면 해결된다! 참고 : https://github.com/vercel/next.js/discussions/57066
