본문 바로가기

728x90
반응형

분류 전체보기

24.02.03 수파베이스 현재 로그인한 사용자 정보 가져오기 튜터님의 피드백 중 예상치도 못한 한마디 "구글 로그인이나 카카오 로그인해도 비밀번호 바꿀 거냐..." 앗 그래서 오늘 소셜 로그인을 한 경우에는 비밀번호 변경 창을 안 보이게 할 예정입니다 그러려면 일단 소셜 로그인인지 아닌지 구분해야겠죠 수파베이스 auth.user에 보면 이렇게 provider가 표시가 됩니다 이제 이 정보를 가져오려면 예시) useEffect(() => { const authListener = supabase.auth.onAuthStateChange((event, session) => { if (session?.user) { supabase .from('userinfo') .select('*') .eq('id', session.user.id) .single() .then((resp.. 더보기
24.02.02 수파베이스 스토리지 이미지 업로드&테이블 연결 마이그레이션도 완료했고 이제 다시는 트래픽 초과를 발생시키지않기위해 서둘러 스토리지 연결을 해봅니다 const MypageNav = ({ selectedCategory, onCategoryChange }: MypageProps) => { const user = useSelector((state: RootState) => state.userSlice.userInfo); const fileInputRef = useRef(null); const handleFileChange = useCallback( async (e: React.ChangeEvent) => { if (e.target) { const selectedFile = e.target.files; if (selectedFile && selectedFil.. 더보기
수파베이스 마이그레이션 (수파베이스 계정 서버 옮기기) 24.02.01 결국 무료 트래픽 초과로 인해 수파베이스 서버를 옮기게 되었습니다.... 수파베이스 서버를 옮겨야 한다! 싶을 때 보면 좋을 정리 글이 되겠네요 https://www.youtube.com/watch?v=nyX_EygplXQ 기본적으로 이영상을 따라 했습니다 자동 자막이 잘 돼있어서 영어 몰라도 참고할만했습니다 (물론 저는 튜터님(튜터님도 이거 보고하심) 설명 듣고 같이 봤습니다) https://docs.docker.com/desktop/install/windows-install/ Install Docker Desktop on Windows Get started with Docker for Windows. This guide covers system requirements, where to download.. 더보기
24.01.31 수파베이스 스토리지 연결 오류(rls) 프로필 이미지 업로드할때 data.url로 들어가던게 무료제공 트래픽을 모두 잡아먹었습니다...!! 2월5일까지는 어떻게 사용이 가능하지만 2월8일이 최종 발표인지라 새로운 데이터 베이스 로 이동주닙를 해야겠네요 문제는 일단 프로필 이미지 업로드 기능에 스토리지를 거쳐서 올리는 방식으로 코드 리팩토링을 진행 해야합니다 const handleFileChange = useCallback( async (e: React.ChangeEvent) => { if (e.target) { const selectedFile = e.target.files; if (selectedFile && selectedFile.length > 0) { const file = selectedFile[0]; // 공백 제거 및 특수 문자 .. 더보기
24.01.30 최종 프로젝트 배포 후 추가 수정 중 디테일한 부분을 계속 수정 중에 있다 오늘은 상단에 점 3개 더 보기 버튼을 누르면 수정 삭제 버튼이 나오도록 설정했는데 아래 박스 더 보기를 눌러도 위에서만 수정 삭제가 뜨는 대참사가 일어났다 처음에는 기능 문제인가 아니면 map으로 잘못 뿌려 주고 있나 싶었지만 원인은 css였다 handleMoreInfoClick(post.id)} /> {editingPostId === post.id && ( handleEditButtonClick(post.id)}>수정 삭제 )} 에딧 버튼(점 3개)를 누르면 밑에 있는 수정 삭제 버튼이 나와야 하는데 const StfetchForm = styled.div` flex-direction: column; padding: 10px; justify-content: flex.. 더보기
24.01.29 배포후 긴급수정 배포후 UT(유저 테스트)를 통해 긴급 수정중입니다 부족한 부분이 꽤나 많네요 좀더 유저의 입장으로 개발했어야 싶지않았나 싶습니다 엄청난 피드백;; 오늘도 잠못드는 하루가 될거같습니다 더보기
프론트 엔드 기술 면접 대비 TOP 16/30 24.01.28 제가한 답변은 아니지만 다른분들이 한 베스트 답변들을 모아봤습니다 면접보러 가기전에 3~4줄로 요약해보고 면접보러 가야겠네요 1.상태관리를 왜 할까요? 그리고 평소 state 관리는 어떻게 하시나요? 먼저 상태관리를 해야하는 이유는 리액트는 SPA으로 JS로 DOM을 조작하는 방식이 아니라 가상 DOM 방식을 사용해 화면에 있는 요소들을 제어합니다. 그렇기 때문에 직접 변수를 변경하는 것이 아닌 state를 통해 데이터를 관리해야 변경된 사항을 적용할 수 있습니다. - 상태관리를 사용하는 이점으로는 먼저 말했듯 변경사항을 적용할 수 있다는 점, 두번째로는 하나의 state의 값으로 하위 컴포넌트에 props로 전달하여 일관된 데이터를 공유할 수 있다는 점입니다. - state 관리는 크게 지역적, 전역적.. 더보기
24.01.27 스토리지 연결....!!! 어디선가 본 글인데 진짜 잘하는 개발자는 자기가 짠 코드를 아쉬워하지 말아야한다고합니다 차라리 싹다밀고 처음부터 만드는게 더 좋을수도 있다고... 오늘 저도 그래야 할듯합니다.... 더보기

728x90
반응형