dukDukz

메가테라 데브로드 프론트엔드 코스 수강 후기 블로그 방문자에게 메가테라 생존코스를 추천했던 과거 메일... 2023년 3월 메가테라 프론트엔드 데브로드 코스를 수강하면서 매주 회고록을 남기는데 그 글을 보고 수강을 고민하던 분께 메일을 받은적이 있다. 강의를 수강하면서 같이 일하는 개발자 동료들에게도 많이 추천을 했던터라 주저하지 않고 추천한다는 내용의 답장을 보냈다. (실제로 이 분이 3기생으로 들어오셔서 디스코드와 모각코에서 뵐 수 있었는데 따로 인사는 드리지 않았지만 괜히 내적 친밀감이 들었던 기억이 남아있다...) 종강은 6개월 전에 했는데, 지금 시점에서 돌아봐도 데브로드 프론트엔드 코스를 추천하는가? 답변은 "강력히 추천합니다." 라고 할 수 있겠다. 주니어 개발자 (1~3년차) 에게 추천하는..

staleTime 가져온 데이터가 오래되었다고 판단하는 기준 시간 [ms] 기본 값은 0 이다. staleTime : 0 - 데이터를 가져온 즉시 오래된 데이터로 인식함. - 캐시된 데이터를 우선 사용하고 API 를 재 호출하여 새 응답으로 데이터를 교체 stateTime : 3000 최초 요청 이후 데이터를 다시 요청한다고 가정함. - 3초 이전에 데이터 요청하면, 최신 데이터라고 판단. 이전에 캐시된 데이터를 사용 - 3초 이후에 데이터 요청하면 캐시된 데이터를 우선 사용하고 API 를 재 호출하여 새 응답으로 데이터를 교체 쿼리 무효화 (queryClient.invalidateQueries) get - list post - add something and update list by queryClie..

1. Vite 로 React 프로젝트 생성 https://ko.vitejs.dev/guide/ yarn create vite yarn 프로젝트 생성시 React + typescript로 설정 2. Eslint 의존성 설치 yarn add -D eslint vite-plugin-eslint eslint-config-react-app vite.config.ts import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' import eslint from 'vite-plugin-eslint'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [react(), ..

vite 설치 yarn create vite 설치 가이드대로 설치 eslint 설치 yarn add -D eslint vite-plugin-eslint eslint-config-react-app 설치하고 vscode relaod 필요함 vite.config.js import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; import eslint from 'vite-plugin-eslint'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [react(), eslint()], }); .eslintrc.cjs rules 부분 module.exports..

버튼 클릭시 전 후 값으로 상태값을 변경시키는 부분 -> 컴포넌트로 만들었다. export default function MoveCategoryButton({ moveType, category, setCategory, }) { // 카테고리 전체 const categories = ['apple', 'banana', 'grape']; // 버튼 클릭시 이벤트 발생 const changeCategory = (type) => { // 현재 카테고리의 index 값을 찾는다 const currentVaule = categories.indexOf(category); // 배열상에서 인덱스 상으로 전 후에 있는 값을 찾는다. const nextVaule = categories[currentVaule + 1]; co..

error: cannot lock ref 'refs/remotes/origin/*****': 'refs/remotes/origin/*****' exists; cannot create 'refs/remotes/origin/*****/+++++' remote에서 받아올 브랜치와 내 로컬에 있는게 이름이 겹쳐서 충돌이 난 것. remote에서 이미 삭제된 브랜치이지만 내 로컬에 남아있어서 git pull git fetch git remote update ... 명령이 되지 않았다. 모든 원격 저장소의 브랜치 정보를 정리하는 명령어 git fetch --all --prune 원격과 로컬의 싱크를 맞춰서 원격에서 이미 삭제된 브랜치를 정리하자. (소스트리로도 가능함) 참고 더보기 https://jjkim01.ti..

쿠키 html5 부터는 쿠키의 단점을 보완하기 위해 로컬 스토리지를 사용 스토리지 데이터가 소멸되는 시점의 차이 로컬스토리지 -> 브라우저 창을 닫아도 있음. 지우기 전까지. -> key-value 형태로 저장하고 value 에는 객체, string 이 들어갈 수 있음 세션스토리지 -> 탭을 새로 생성할 때마다 세션 스토리지 값이 초기화 되므로 탭을 닫으면 세션 스토리지의 값이 없어진다. -> key-value 형태로 저장하고 value 에는 string 만 들어갈 수 있다. 브라우저간 쿠키 or 로컬스토리지 공유 - 기본적으로 브라우저 간의 쿠키는 공유되지 않음. - 서브 도메인끼리는 공유 가능함. 다만 로컬호스트에서 테스트가 어려움 브라우저간 세션 스토리지 공유 - 브라우저 탭마다 다른 세션을 갖고 ..

잘한 것은 무엇인가? 모각코 참여하기 운동 다시 시작..! 일주일에 강제로 3번은 가야한다.. 백엔드) 배치 돌리는거 문제 해결... 새벽 한시마다 배치 돌아가게 하는 부분.. 전날 가입자 성별, 결제 이용 추이 등을 가져오고 조립해서 데이터 넣는 작업이였다.. DB는 3개 사용하고 rdb, mongo 두 종류여서 좀 헤메기도하고 스트레스도 좀 받았다. 최찍시간에 상담신청해서 상황은 바뀔 수 없으니 마음가짐을 바꿀 수 밖에 없고 좋은 기회라고 생각하고 임하라는 조언에 그 다음날 부터 몰입해서 했던 것 같다. (프론트 개발자인데 백엔드를 해야 하는 부분에 대해서 고민을 보냈었다.) 강의에서 배웠던 부분(js 고차함수 다루는법)을 활용할 수 있었다. -> 이 부분이 제일 만족스럽다. js의 배열과 객체 다루..