겨리의 개발일기

최근 개인 프로젝트에 구글 애널리틱스를 적용한 내용을 정리해보려고 한다. 😎 😎 구글 애널리틱스(google analytics) 구글 마켓팅 플랫폼 브랜드 내의 플랫폼으로 웹사이트 트래픽을 추적하고 보고하는 웹 애널리틱스 서비스 웹 애널리틱스(web analytics) 웹 사용률을 이용하고 최적화하기 위해 웹 데이터를 측정, 수집하고 분석하여 보고 하는 것 웹 트래픽을 측정하는 과정일뿐 아니라 비즈니스와 시장 연구의 도구로서 사용이 가능하다. 웹사이트 효율성을 측정하고 개선 할 수 있다. 나는 개인 프로젝트로 진행했던 나와 맞는 고양이 찾기(심리테스트) 사이트의 사용률을 측정해보고 싶어서 시도해보았다. 💫 프로젝트 바로가기 : https://find-my-cat.netlify.app/ ✔️ 참고 2023..

Programming/React 2024. 1. 17. 18:38

vite를 사용해서 React + TS 프로젝트 환경을 세팅하던 중 ESLint 오류가 발생했다. 🧨 에러 .eslintrc.cjs와 vite.config.ts 파일에서 ESLint 오류가 발생하고 있다. 😬😬 에러 내용 // eslintrc.cjs Parsing error: ESLint was configured to run on /.eslintrc.cjs using parserOptions.project: /tsconfig.json However, that TSConfig does not include this file. Either: - Change ESLint's list of included files to not include this file - Change that TSConfig to i..

Programming/기타 2024. 1. 12. 18:36

2022년 회고를 작성한 게 엊그제 같은데 벌써 2024년이라니! 한 해가 훌쩍 지나가버렸다. 지난 2023년은 나에게 프론트엔드 개발자로서의 기반을 다진 해가 아닐까 하는 생각이 든다. 다양한 도전을 했고, 성공을 하기도 실패를 하기도 했다. 성공과 실패의 경험 모두 나에게 큰 교훈을 줬고 덕분에 인간으로서, 개발자로서 한층 더 성장할 수 있었다. 📝 꾸준히 이어온 회고 2022년에 시작한 회고는 꾸준히 진행했다. 2023년부터 주간회고는 사적으로, 월간회고는 공개적으로 작성해 봤다. 일 년 이상 진행해와서 그런지 이제는 회고가 습관이 되어 무슨 일이든 기록하고 정리하고 싶어 한다. 개발자가 된 후 가장 잘한 일 중에 하나로 회고의 시작을 말할 수 있을 정도로 많은 사람들에게 회고 작성을 추천하고 있다..

회고 2024. 1. 8. 02:00

프로젝트 10월 중순 쯤 그동안 참여해보고 싶었던 테오 스프린트에 참여하게 되었다. 약 일주일이라는 기간 동안 최대한 집중해서 참여했고, 정말 행복한 시간이었다! 스프린트 회고 보러가기 취준 이력서와 포트폴리오(경력기술서)를 전반적으로 수정했고 지원을 시작했다. 작년부터 참여한 프론트엔드 스터디를 리드해주셨던 고리님께서 많은 도움을 주셨다. (감사합니다 😻) 이력서와 포트폴리오를 완벽하게 해내려고 하면 밑도 끝도 없기 때문에...일단 지원해가면서 계속해서 보완할 예정..! 사실 10월엔 프로젝트 하느라 지원을 많이 하진 못했고, 11월부터 좀 더 적극적으로 시도했던 것 같다. 하지만 결과는 좋지 않았고…😥 부족한 점이 뭔지 파악해야겠다는 생각에 인프런 멘토링을 두번 진행했다. 멘토링에서 받은 피드백을 기..

회고 2023. 12. 18. 00:29

Controller 컴포넌트를 사용해서 처리를 하고 나니 중복된 코드가 많아 개선 할 수 있을 것 같다는 생각이 들었다. 찾아보니 useController 를 사용해서 재사용이 가능한 컴포넌트를 만들 수 있다고 해서 바로 시도! 😎 코드를 보기 전에 useController의 Props 부분부터 확인해보자! useController Props // controller.d.ts export type UseControllerProps = { name: TName; rules?: Omit; shouldUnregister?: boolean; defaultValue?: FieldPathValue; control?: Control; disabled?: boolean; }; 추가 설명 🗸 name - input 의 ..

Programming/React 2023. 12. 15. 01:54

최근 react-hook-form과 MUI를 함께 사용했던 경험이 있었는데 이에 관한 내용을 정리해보려한다. 왜 raect-hook-form을 사용할까? 🤔 리액트를 사용해서 폼을 다룰 땐 유효성 검사를 위해 제어 컴포넌트를 사용하는 경우가 많다. 즉, 사용자가 입력하는 값들을 모두 state로 관리하고 업데이트 한다. 하지만 이와 관련하여 몇 가지 문제점이 있다! 제어 컴포넌트를 사용할 때 문제점 1. 렌더링 이슈 react에서 컴포넌트 리렌더링이 발생하는 조건 중 하나는 state의 값이 변했을 때이다. 모든 값이 state로 연결 되어 있기 때문에 하나의 값이 변하더라도 많은 리렌더링이 발생하게 된다. 2. 코드의 가독성 리액트에서는 제어 컴포넌트로 폼을 다루게 된다. 이를 위해 각 요소마다 sta..

Programming/React 2023. 12. 14. 17:30

https://school.programmers.co.kr/learn/courses/30/lessons/12945?language=javascript 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 설명 피보나치 수는 F(0) = 0, F(1) = 1 일 때, 1 이상의 n에 대하여 F(n) = F(n-1) + F(n-2)가 적용되는 수 입니다. 예를 들어, F(2) = F(0) + F(1) = 0 + 1 = 1 F(3) = F(1) + F(2) = 1 + 1 = 2 F(4) = F(2) + F(3) = 1 + 2 = 3 F(5) = F(3) + F(..

Programming/Algorithm 2023. 11. 28. 19:20

✍ 이진트리 DFS 관련 문제 ✅ 문제 철수는 그의 바둑이들을 데리고 시장에 가려고 한다. 그런데 그의 트럭은 C킬로그램 넘게 태울 수가 없다. 철수는 C를 넘지 않으면서 그의 바둑이들을 가장 무겁게 태우고 싶다. N마리의 바둑이와 각 바둑이의 무게 W가 주어지면, 철수가 트럭에 태울 수 있는 가장 무거운 무게를 구하는 프로그램을 작성하세요. ✅ 입력설명 첫 번째 줄에 자연수 C(1 sum) sumWeights.push(sum); } else { DFS(L + 1, sum + weightList[L]); DFS(L + 1, sum); } }; DFS(0, 0); return Math.max(...sumWeights); } console.log(solution(259, [81, 58, 42, 33, 61]..

Programming/Algorithm 2023. 11. 5. 02:11