본문 바로가기
728x90
반응형

분류 전체보기238

2023.05.14, weekly memoirs weekly memoirs ✅ 이번 주에 한 일 첫 출근 전에 많이 먹기 👆 찐으로 살찜... 이번 주 내내 나가서 사람들과 고기 먹은 기억 밖에 없다...ㅎ 7월부터 위코드에서 개발 공부를 시작해 해가 바뀌고 5월이 되었으니 벌써 개발자의 꿈을 꾸게 된 지 10개월이 훌쩍 넘었다. 어떤 일이 생기더라도 무조건 개발자 해낼 거라 마음 굳게 먹고 js 들여다본게 정말 오래 전 일 같은데 아직 1년도 안 되었다 생각하니 기특하면서도 그 동안 많이 고생하긴 했다 하는 감동이.. 왔다 ㅎ 개발을 시작하며 미래를 그리는 일이 재밌어졌다 학습을 즐기는 편이긴 했지만 내일 어떤 걸 공부하고 이번 주는 어떤 걸 학습할 지 계획 세우며 즐거워하는 편은 아니었는데 개발을 시작하며 개발 관련된 공부를 계획 세우는 일이 나름.. 2023. 5. 14.
2023.05.07, weekly memoirs weekly memoirs ✅ 공부 1. script로 폴더 만들기 "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject", "made": "cd ../../ && mkdir asdf", "erase": "cd ../../ && rm -rf asdf" }, npm run made npm run erase 터미널 명령어가 들어가는 건 똑같으니까,, 이걸 이용해 원격 서버도 해 봤다 1) 원격 어떻게 하지 여기서 5계층 세션을 씀 ssh 2) 연결해보기 환경설정 -> 공유 (몬터레이 기준) 일단 원.. 2023. 5. 7.
2023.04.30, weekly memoirs weekly memoirs ✅ 공부 1. 기업 과제를 구현하며 recoil 공식문서를 좀 뜯어보았다. 예전에 프리온보딩 과제하면서 전체 데이터를 filtering 해서 쓸 때 recoil이 그걸 간략하게 도와주는 함수가 있었던 기억이 나, 공식 문서를 훑어보았는데 아니나 다를까 아예 공식문서에 대놓고 전체데이터를 이렇게 filtering 해서 쓰면 됩니다 ^_^ 하고 투두리스트로 친절하게 적혀있어서 아주 재미나게 썼다 https://recoiljs.org/ko/docs/basic-tutorial/selectors 전체 데이터 필터링 할 때 쓰기 좋은 듯 2. 이번주는 최적화에 대해서 알아봐도 좋을 거 같단 생각이 들었다. 1) 디바운싱 리팩토링 진행하기 2) useMemo 나 useCallback 적용해.. 2023. 4. 30.
e.target, e.currentTarget 차이 e.target, e.currentTarget target은 부모로부터 이벤트가 위임되어 발생하는 자식의 위치, 내가 클릭한 자식 요소를 반환함 => 클릭이 일어난 바로 그 요소 currentTarget은 이벤트가 부착된 부모의 위치를 반환함 => 클릭이 일어난 요소부터 상위로 올라가며(버블링) 이벤트 핸들러가 등록된 요소를 가리킴 1. button 안에 자식 없을 때 2. 하위 div 만들었을 때 target은 하위를 가리킴 3. 하위 div 2개일 때 target : 가장 하위(secondChild)를 가리킴 currentTarget : button 을 가리킴 4. 하위 div 5개 만들어봄 target : 가장 하위(fifthChild)를 가리킴 currentTarget : button 을 가리킴 .. 2023. 4. 30.
git은 파일명/폴더명 대소문자 구별 못함 1. Memo.styles.ts 로 처음 세팅하고 git에 push 한 후 2. memo.styles.ts 로 이름을 바꾸었다 그리고 3. ㅎㅎ 방금 만든 컨벤션을 지키기 위해 대문자로 작성된 styles.ts 모두 소문자로 바꾸었다 다시 git에 push 하고 혹시 몰라 clone 받아 확인해봄 4. 실행 안 됨 (마감 30분 전) 상황 1. 폴더명 바꾸었던 파일은 오류 없이 잘 돌아감 2. clone 받은 파일만 난리남 3. 그러면 git 문제 원인 git 원래 폴더명/파일명 대소문자 구별 못함 해결방법 1. 대소문자 무시 하지 말라는 명령어 git config core.ignorecase false 2. 로컬에 남아있는 캐시 삭제 git rm -r --cached . 3. git에 다시 push g.. 2023. 4. 29.
2023.04.23, weekly memoirs weekly memoirs ✅ 공부 1. next.js가 코드 스플리팅을 지원해준다는 이점을 가지고 있는 건 알았지만 mpa, ssr, ssg 에 밀려 코드 스플리팅이 뭔지 파보진 않았었다. 그냥 빌드할 때 cra 과 next.js 가 알아서 해주는 거~ 하고 등한시하다, next.js 에 나름 여유가 생겨 이번 기회에 한번 코드 스플리팅 파보았다. import 구문을 사용해 js 코드를 여러개의 chunk로 분리하고 필요한 시점에 로드하여 성능을 최적화하는 기술! 여기까지는 오... 좋네... 그렇군 했는데 이게 lazy, suspense 와 연계되어 있는지는 몰랐다. lazy 함수가 1. import()를 호출하는 함수를 인자로 가진다는 것 2. 이 함수는 react 컴포넌트를 promise를 반환해.. 2023. 4. 24.
웹 최적화 - Image LazyLoading Image LazyLoading 페이지 내에서 실제로 필요할 때까지 리소스의 로딩을 미루는 것 👆 전체 페이지에서 모든 이미지를 받아오지 않고 스크롤을 내릴 때마다 받아옴 페이지 초기 로딩 시 필요한 이미지 수를 줄일 수 있음 필요한 부분 먼저 받아오면서 필요하지 않은 사진들을 받아오지 않아도 되므로 유저가 빠르게 이용할 수 있고 비용이 감소함 적용 방법 html 은 img 태그의 src="이미지 주소" 를 읽으면 이미지를 무조건 로드함 lazy loading 을 위해서 src 속성이 아닌 다른 태그를 사용해서 이미지 url을 지정함 이렇게 이미지 로드를 사전에 막고, 언제 로딩할 것인지(뷰포트에 들어오면 로딩하라!) 알려주면 된다. 방법으로는 1. window scroll event 2. observe.. 2023. 4. 17.
프로그래머스 다음 큰 숫자 풀이 문제 내 풀이 function solution(n) { let hex = [...n.toString(2)] let count = 0; hex.filter(x=> x==="1" ? count +=1 : ""); let minCount = 0; let i = n+1; while(true){ let min = [...i.toString(2)] min.filter(x=> x==="1" ? minCount +=1 : "") if (count === minCount){ break; } minCount = 0 i+=1 } return i } filter / map 안에 삼항자를 돌려 1의 갯수를 구했고 while 문을 사용해 count === minCount 가 같을 때 break 를 해주었다 그리고 chatGPT .. 2023. 4. 17.
2023.04.16, weekly memoirs weekly memoirs ✅ 공부 1. 코테에 떨어지고 크게 낙심한 한 주... ^_ㅠ 탈락 문자를 받고 나서 지금까지 많이 느슨해지지 않았나~ 하는 반성을 많이 하게 되었다. 이번주는 하루에 한 개 이상 코딩테스트 문제를 풀었고 next.js 강의를 머리에 집어 넣는다는 생각으로 꼼꼼하게 듣고 기록했다. 원래 했었던 하루하루 무엇을 공부했는지 기록하는 노션도 다시 활성화하며 열심히, 꾸준히 하자는 다짐을 많이 새겼던 주였다 ✅ 취업 1. 계속해서 면접에 떨어지면서 과연 지금 내가 준비가 다 된 게 맞는가? 하는 생각이 크게 들었다 슬픈 마음보단 어떤 점이 부족했는지, 앞으로 어떤 점을 더 보강해야하는지 하는 고민을 많이 한 거 같다 지금 당장 어떤 걸 우선순위로 가져야할지 아직까지도 고민하고 있다 n.. 2023. 4. 16.
728x90
반응형

티스토리툴바