oris9

잡담새로운 스터디를 시작하게됐습니다 ..대인원으로 ..!!!인원이 많아질수록 관리해야할 것도 많아지고, 나하나쯤이야라는 분위기가 생길 수 있다고 생각해서평소에는 5명 내외로 진행하는데,이번에만 .. ! 도전하는 마음으로, 같이 스프린트를 끝냈던 분들을 믿고 진행하게됐습니다. 사실 성장에 도움을 많이 받았던 분들이 많이 계셨기 때문에그분들하고 전부 .. 스터디 해보고싶다.. 라는 욕심도 ㅋ.ㅋ 컸었던거 같아요 하여튼 그래서 무려 20명 가까운 인원으로 시작하게 되었습니다.이번 스터디의 개인적인 목표가1. 공부는 되지만, 부담은 없는 스터디 2. 해야하니까 하는 느낌은 줄이고 자발적으로 참여하고 싶어지는 스터디 ..였는데요 그래서 코드리뷰방식을랜덤하게 리뷰어를 설정해주고, 특별히 원하는 리뷰어가 있다면 추가..

- public - /*로고 이미지 파일*/- src - assets - /*.svg, .png 파일들*/일반적인 프로젝트 디렉토리 구조이다. Vite는 모듈 시스템을 이용하는 경우 자동으로 상대경로를 절대경로로 변환한다.그래서 import a from "../../../assets/a.png" 와 같은 상대 경로를 사용하는 코드는 Vite로 빌드시 자동으로 절대경로로 변환된다.하지만!!! HTML 파일의  태그에서는 이러한 자동 변환이 일어나지 않는다. 🥹이러한 이유로 에셋을 사용할때 상대경로르 입려했지만 로고이미지 다운에서만 문제가 발행하였다.모듈로 import 되지 않는 에셋을 사용하가 위헤서는 절대 경로를 사용하는 것이 더 안전하다!profile넴 이미지 파일명을 그대로 ..

코딩테스트 문제를 풀다가 기본적인 건 알고 있지만 자세한 동작방식이나, 성능상에서 서로 다른 점에 대해 깊게 알고있는 것 같지 않아서 정리해보려고합니다 🤩🤩🤩  1. for문for (let i = 0; i  인덱스를 명시적으로 제어할 수 있어서 시작, 종료, 증감값을 컨트롤 해야할 때 사용하면 좋습니다.continue와 break 같은 제어문을 사용할 수 있습니다. (forEach는 사용불가!)forEach에 비해 조금 더 성능상에 이점이 있고(조금더 빠름,  `for (let i = 0; i 보다 유연하기 때문에 복잡한 로직의 경우 적합합니다(상태복원, 재귀호출) 2. for...of 문for (let el of array) { // 배열의 각 요소에 접근}배열의 각 !! 요소 !! 에 접근..

[선택자]::-webkit-scrollbar{ display: none;}width를 100vw로 지정하게 되고, 만약 y축에 scroll이 생기게 되면, 스크롤바가 vw에 포함되기때문에 x축에도 스크롤바가 생기게 된다 ~ ~ 아래의 방법으로 해결해주면 된다. 1. body 태그에  overflow-x: hidden; 속성 걸어주기나는 global.css 파일에 이렇게 적용시켜서 해결시켰다body { overflow-x: hidden;} 2. 스크롤바 안보이게 숨기기깔끔한 페이지 제작이 필요할때는 나쁘지 않은 방법일 것 같다![선택자]::-webkit-scrollbar{display: none;}

`failed during stage 'building site': build script returned non-zero exit code: 2`  CI= npm run bulid  이미 적용되어있는 상태에서 계속 저 오류가 뜨다가기존에 괜찮던 자잘한 오류들까지 다 잡으니까 드디어 다른 오류가 뜨기 시작했다 (warning도 다 해결해줬음) Deploy did not succeed: Deploy directory 'build' does not exist  bulid 파일을 찾을 수 없다는 에러다.나는 타입스크립트 + 리액트 + vite로 작업중인 프로젝트였고,빌드 설정에서 배포폴더를 dist로 변경해주니까 정상적으로 배포되었다!! ( + 빌드된 dist 폴더도 github에 올려주었다)

자바스크립트로 작성한 리액트 프로젝트를 타입스크립트로 마이그레이션 할 일이 생겼다.기존 프로젝트는 CRA로 빌드되어 있었기에 빌드도구도  Vite로 업데이트 하기로 결정했다.Vite를 선택한 이유 ,우선 CRA에 비해 최근까지 계속 업데이트가 진행되고있고, CRA가 지속적으로 업데이트를 진행하지 않으면서 리액트 자체에서도 CRA가 아닌 Vite를 이용해서 프로젝트를 시작할 것을 권하고 있다고 알고 있다.  이게 지금 나에게는 가장 큰 이유였고, 이를 계기로 자세히 찾아보니 CRA는 webpack을 이용해 모든 코드를 번들로 만드는데, vite는 개발모드에서 ES모듈을 이용해 브라우저에서 직접 모듈을 로드한다고한다. 따라서 개발서버 시작시간이 더 빠르다 (vite는 요청시에 동적으로 모듈을 변환, CRA는..

짧게 요약 정리를 위쪽에서 하고 자세한 단점에 대한 내용은 아래 추가글로 정리해보려고한다일단 개념이 필요하신 분들은 위에만 읽고 넘어가셔도 좋을 것 같다 이 단점은 tree-shaking , 즉 번들링과정에서 사용하지 않는 코드를 제거함에 대한 문제를 담고있다   타입스크립트에서의 Enum은,enum 숫자형이넘 { 숫자형 = 1, 숫자 = 2,}enum 문자열이넘 { 문자열 = "foo", 문자 = "foooooot",}과 같이 사용할 수 있다.이넘은 이렇게 어떠한 숫자나 문자, 상수 집합을 의미하는 데이터 타입이고,여러 개의 상수를 묶어서 관리할때 사용하게된다!가독성이 좋고 유지관리가 편하지만 유연성은 떨어진다는 특징이 있다. ( -> 한번 선언하고 나면 수정이 어렵다) 숫자형이넘은 모든 값이 ..

패키지 삭제후 새로 시작할 때 아래와 같이 진행하면 cannot find module error를 해결할 수 있다 🤩🤩 # 명령어로 캐시를 삭제npm cache clean --force# node_modules 폴더 삭제# package-lock.json 파일 삭제# 재설치npm install