우주먼지 개발 log

1. 전역상태 관리의 필요성- 상태란? 일종의 데이터 저장 변경 관리하는 데이따 리액트의 UI 렌더링에 필요한 정보들의 의미하기도 함. 상태가 변경되면 UI가 리렌더링됨 **가장 기본적인 방법** //useState function TestComponent() { const \[value, setValue\] = useState("초기값"); console.log(value); _//_ **\=> 초기값** _return_ null; } 그럼 데이터 흐름이 양방향 인 것? -> ex) Vue 리액트의 데이터 단방향 흐름의 단점 망할 프롭스 드릴링 fxxx function HomePage () { const [selectedMemeberName, setSelectedMemberName] = useState..

진영튜터님 로그인 인증 관련 세션 https://github.com/yoojinyoung/lecture-authentication/tree/main/src 1. ID/PW 입력 없는 로그인 기능 구현 2. 로그인 여부에 따른 라우트 구분 구현 3. ID/PW 입력과 API 응답을 통한 로그인 기능 구현 4. localStorage를 사용한 새로고침 시 인증 풀림 대응 위 네 가지가 세션 시간 동안 구현한 것들을 흐름에 따라 살펴볼만한 내용들이구요 아래 두가지는 main 브랜치의 코드를 보시면서 추가로 익혀볼만한 내용들입니다 1. redux-thunk를 사용한 로그인 기능 구현 2. 새로고침 시 인증 풀림 대응 시나리오 이거는 못들어서 코드 봐야함 빠른시일내에 !!!

이런 코드를 줄여보자. const signInWithGoogle = () => { const googleProvider = new GoogleAuthProvider(); return signInWithPopup(authService, googleProvider); }; const signInWithGithub = () => { const githubProvider = new GithubAuthProvider(); return signInWithPopup(authService, githubProvider); }; const socialGoogleLoginhandler = async (event) => { event.preventDefault(); await signInWithGoogle() .then((r..

대기업 개발자가 퇴사하고 부트캠프를 한 이유? (마케팅 각이다^-^) 솔직 : 업을 좀 바꾸고 싶은데 (embedded 개발 -> 웹 개발 (frontend) ) 혼자서 공부는 할 수 있지만 목적이 필요하잖아? 제일먼저 포트폴리오가 필요하겠지? 그런데 대기업 문화에 찌들어 혼자 뭘 구해서 하는 방법을 잃어 버렸음. 요새는 사이드 프로젝트도 알아서 찾아서 하고 하더라 하지만 요새 사이드 프로젝트도 구하기가 어렵다고 하더이다. 경험이 없는 사람을 동료로 받아주지는 않거든요! 그래서! 스파르타 내배캠 과정! 안하면 아쉬웠던 3가지 정도 이유가 있습니다. (잘 가르쳐줘서 이런건 식상하고 다른곳도 다 잘 가르쳐줄테니 적지 않습니다~) 1) 팀프로젝트의 기회 (그것도 다양한 사람들과, 여러번) 알아서 찾아서 진행하..

계획 계획 갑자기 P가 J가 되지는 않지만~ P를 일 시키는 것도 결국엔 계획이었다. 나는 약간 산만한 경향이 있기 때문에 집중해서 하나 하나 처리하려면 계획을 조금더 작은 단위로 작성할 필요가 있었다. 큰 덩어리일 때 보다 하나 하나 클리어해 가는 맛이 있다. 그래서 남들 할일 계획표에 비해 세부적인 경향이 있다. 헤더에 알람 받는 부분 구현 이라고 적고 그 안에 다시 - DB에 알람이 있으면 읽어와서 useState로 저장(useQuery) - DB에 알람이 들어오면 List에 추가 (invalidateQueries) - 알람 클릭시 게시물로 이동 및 알람내역에서 삭제 (useMutation) - 알람이 있으면 종 UI 변경 - dropdown 바깥 클릭시 닫힘 적용 등등을 자세히 명시해둔다. 이렇게..

생각나는 것은 많은데 이력서는 쓰기 싫은 'ㅇ'; 나에 대한 처방전 why ? 1) 목적이 없고 -> 숙제라는 목적보다는, 이력서 준비라는 목적보다는, 목표하는 회사를 정해서 지원서 제출을 목적으로 해야겠다 -> 세부적인 할일을 안 적어둔 것도 크다. 나라는 애는 안적으면 안한다~ * 2) 사실 하고싶은 말은 많은데 공간이 너무 한정적이어서 틀이 정해져 있어서 -> 자유 양식 블로그 주절주절 먼저해보기~ 3) 그동안 못놀아서 뽀로로야! -> 낮, 밤! 활용! 하루종일 놀지는 말자 ~ 단기 목표 목요일 23:59 인텔리픽 1차 이력서 제출 할일 가고싶은 회사 하나만 찾아 이력서 양식보기 프로젝트 작성 부분 보강 TIL / 회의록 한번 훑어보기 자기소개 부분 러프한 버전 하고싶은 이야기 키워드 별 정리 !!..

코딩 끝(이라고 하면 안되지만) 취업 준비 시작~ 그리고 과정 마무리 정리 좀 ㅠ.ㅠ 우리 최종 프로젝트도 마무리해야할 것 태산~ 매일매일 코딩테스트 준비도~ 그리고 운동~ + 클라이밍 타임테이블 일 화 수 목 금 일 약속 (실화인지?) 요새 코딩한다고 운동 못해서 하루만해도 근육통 오는뎀 ^0^ 취준도 운동도 화이팅해보자~

뭔가 이날을 기념해 두고 싶어서 뒤늦게 작성해보는 TIL TIL 일것 까진 없지만 후기와 사진..? 1. 발표준비 중간발표 자료 기준으로 최종에 추가할 것 추가하고 발표자 효짱님이 스크립트 작성해주시고, 미뇽님이 시연영상 찍어주시고, (이거 영상 만들어서 진행하길 100배 1000배 잘했고 굳아이디어였다. 6분짜리 영상으로 만들고 2배속쯤 돌려서 우리 한 것 대부분을 보여줄 수 있어서 좋았다. 타이핑 하는 시간 화면넘기는시간 줄어서 진짜 굳!) 다른분들 발표 보면 2-3분 짜리 예정되어있는 시연을 최종이라 다 보여주고 싶으니까 5분넘게 하신조가 많았단 말이죠 ㅠ.ㅠ 효짱님이 당일 2번이나 시뮬레이션 해보고 피드백 받고 스크립트 수정해서 진행해주셨고 ~ 수고하셨습니다~ 나머지 분들과 전날까지 열심히 수정..

오늘도 화이팅! 1. tailwind 반응형 구현 굉장히 쉽다 우리는 사이즈를 일단 급히 적용하는 만큼 1개만 적용하여 lg (라지) 사이즈 이상 이하만 적용해보았다. 라지 이상일 때 사이즈를 300px로 라지 이하는 100px로 정하는 코드 ! 사용법은 쉽지만 적용은 안쉬움 반응형 구현으로 인한 이슈 야금야금 양산 하는 즁 이거 이렇게 맞추면 저거 망가지구 특히 Z 값은 주의가 필요하다. 제일 난리.. ^0^ 테스트도 많이 해봐야하고 세심한 코딩 필요하다!!! 프로젝트 진행 상황 ✓ 쟝님이 도메인도 구매하셔서 적용함 디벨로팜 입니다 : https://develofarm.site 많 관 부 .. ✓ 오늘 Main MVP 15~16 배포 현황 [Bugfix] CSS 정리정돈 [add]프로필 수정페이지에서..

내일 제출이라고~!?! 납기일이라고!!! 1. 알람 데이터 읽음 처리 시 바로 안되는 이슈 (invaildation Queries 바로 안될때 있음) 수정 - 개별삭제 시 간헐적으로 안됨/ 전체 삭체시 100% 안됨 문제였던 부분 : 1) 알람 온 게시물로 routing 을 하고, invalidationQueries를 해준 것 (이미 화면이 이동된 후라 제대로 동작 안한듯) 공식문서의 내용 확인 : Mutations | TanStack Query Docs Please keep in mind that those additional callbacks won't run if your component unmounts before the mutation finishes. 2) 알람 전체 삭제 시 안되었던 부분 ..