본문 바로가기

분류 전체보기

 (170)
WIL(17) 1.이번주를 되돌아보자 저번주에 세워둔 이번 주 목표🔥 커뮤니티에 좋아요 기능, 내가 쓴 글 들고 오기 완료 : 북마크 기능과 비슷하게 로직을 짜면서 좋아요 기능을 완성했고 내가 쓴 글을 마이페이지에 들고오는 것 까지 성공했다. 마이페이지의 상품 찜 목록의 예금,적금 필터링 만들기 :기존의 서비스페이지의 productTypes를 prop로 내려주면서 예금 적금 필터링을 완성했다. 컴포넌트의 재활용성이 좋아서 만들기 편했다 ㅎㅎ currentUser가 없다면 로그인하도록 유도 했다. 그리고 좀 더 나아가서 로그인을 했지만 찜 목록이 없다면 보여줄 페이지를 설정해주었다. 안해주면 흰 배경의 탭만 보이는데 유저 입장에서는 랜더링이 덜 된건가? 라고 느낄 수 있는 부분이기 때문이다. 2. 다음주 목표 배포 사용..
TIL-간단한 debounce 1.내가 만난 문제 현재 사용비밀번호를 onchange를 실시간으로 값을 받으면서 현재비밀번호와 입력값이 일치한지 확인하는 함수를 실행시켜줘야했다. 근데 onchange될때마다 함수를 실행하기에는 너무 비효율적이므로 debounce를 사용하기로했다. 2.시도 lodash에서 debounce를 사용했다. debounce를 사용한 이유! : 사용자가 입력하고나서 일정시간 이후에 함수를 실행할 수 있도록 구조를 짜는게 효율적이였다. 입력이 끝나고 나서 0.3초 이후 입력값의 전체를 들고 함수를 한번 실행시킨다. import { debounce } from "lodash"; const debounceFunc = debounce(onChangePassword, 300); //onChagePassword함수를 마지..
마이페이지 유효성 검사 1.고민 개인정보 수정 버튼이 하나임에 따라 비밀번호를 수정 또는 닉네임을 변경했는지 둘 중에 하나만 되어도 저장이 완료되어야하지만 중간에 수정을 하다가 그만둘 경우(수정이 완료되지 않았던 경우), 현재의 개인정보와 똑같은 정보를 입력하는 경우 버튼의 비활성화가 필요하다. const onChangePassword = (event) => { const currentPassword = event.target.value; setEditUserPassword(currentPassword); signInWithEmailAndPassword(authService, email, currentPassword) .then((userCredential) => { const user = userCredential.user;..
WIL(16) 1.이번주를 되돌아 보자 🔥저번주에 세워둔 이번 주 목표 MVP에 들어가는 기능 중 맡은 부분 기한 내에 구현해내기 서비스페이지에서 맡은 부분은 어느정도 한 상태였고, 뒤늦게 맡은 마이페이지 파트에서 UI, 닉네임,비밀번호 수정 기능구현 (아직까지는 update는 되지만, 유효성검사 + 개인정보 수정 시 현재 비밀번호 일치하는지 확인기능 구현은 안됨) 트러블 슈팅 생각하기 튜터님도 얘기해주셨지만 중간점검에서 적을 트러블 슈팅이라하면 cors에러 였던것 같다. 그부분은 블로그에서 따로 정리를 했다...ㅎ 예외처리를 어떻게 할 것인가... 아직 내 부분에서 어떤 부분에 사용을 해야할까 미정이다. 2.다음주 목표 커뮤니티의 좋아요 기능, 내가 쓴 글 마이페이지에 들고오기 마이페이지의 상품 찜 목록 예금, 적금..
cors 정리 TIL 1.SOP(same-origin-policy) : 동일한 출처에 대한 정책 , 동일한 출처에서만 리소스 공유 가능 => 보안을 위해서 생긴 정책 **동일한 출처? 이 세가지가 동일한 것을 동일한 출처라고한다. 이 출처의 비교를 통해서 차단을 할지 말지 결정을 한다. 그러나 다른 출처에서의 리소스가 필요할 경우가 많기 때문에 cors가 생겼다. 참고사항❗️ 출처비교를 통한 차단은 서버쪽에서하는것이 아닌 브라우저가 한다! 2.CORS(cross-origin-resource-sharing) CORS에러라고했지만 위의 SOP의 해결책으로 나온 것이 cors라고 생각하면된다. 방법 1. client : request시 HTTP헤더에 Origin을 담아 전달한다. *origin: http://localhost:30..
중간발표 TIL 1.후기 목표한 MVP구현은 어느정도 해결한 거 같아서 다행이라고 생각이 들었다. 다른 팀들이 구현해낸것을 보니까 다들 대단한거같다👍.. 더 노력해야겠다라는 의지가 생겼다. 라이브러리를 그렇게 많이 쓰지 않았는데 필요한부분이 있다면 적극적으로 사용해 볼 경험도 필요하다고 느꼈다. 2. 튜터님 피드백💪 좋은 후기 1) 프로젝트 아이템이 좋다! 일반적으로도 사용하기 좋은 아이템이다. 2) 금융api라 어느정도 금융지식과 api 공부가 필수라고 얘기해주셔서 그 에 대해서 공부한 것.(노션에 api 정리, 금융지식) 3) 최대금리 순으로 나와서 순위가 보여서 사용자 입장에서 선택하기 좋았다. 4) 최적화를 잘했다. 고쳤으면 하는 것 + 팀원들과 피드백에 대한 해결 1) 로고 : 은행 로고 일정하지 않다. => ..
WIL(15) 1.이번주를 되돌아보자 🔥저번주에 세워둔 이번 주 목표 기능구현 마무리 하기 중간 점검 까지 MVP로 생각하는 기능들을 다 구현하기로 했다. 시간이 되게 많다고 생각했지만 진행될 수록 추가되는 기능과 바뀌는 UI에 대해서 수정하면서 작업을하려니 짧은 기간이였다. 그래도 원래 맡았던 기능구현은 어느정도 완료한 상태라 다행이다. UI마무리하기 어느정도 확실한 틀을 다 만들고 했지만 아직까지 확정된 와이어프레임이 아니므로 계속해서 수정하고 있다. 만들면서 피그마를 중간중간 점검해야한다는것을 깨우치고 있다. 만들면서 부족한 부분 채워넣기 이 부분은 아쉽다... 원래같으면 인피니트스크롤 정말 구현해보고 싶어서 하루...이틀 정도 붙잡고 있었는데 아쉽게 안되었다. 계속해서 붙잡고 있기에는 다른 중요한 기능들이 많아..
TIL 이번주 부터 금요일까지를 목표를 잡고 MVP에 들어갈 기능구현을 시작했다. 시간이 부족해서 마음이 급했다. 원래하고 있던 기능들을 어느정도 마무리하고 다음 작업으로 넘어갔다. 다음작업은 마이페이지다. 파이어베이스로 프로젝트 작업을 하고 있고, 그래서 파이어베이스의 api로 데이터를 읽기 또는 업데이트가 가능했다.🔥 1. 고민 🧐 이러한 형식에서 비밀번호 변경과 닉네임 변경의 버튼은 하나로 수정이 되는데, 파이어베이스에서는 둘의 함수가 달랐다. //Profile update import { getAuth, updateProfile } from "firebase/auth"; const auth = getAuth(); updateProfile(auth.currentUser, { displayName: "Jan..

티스토리툴바