![react](https://tistory1.daumcdn.net/tistory/4365896/skin/images/react-logo.png)
목록📖 전체보기 (254)
즐겁게, 코드
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/b96Rip/btq6qhnNtcJ/q9ZskQzdtujiVsolfI6zw0/img.png)
※ 요약) 결제 실패로 인한 계정 락이 걸린 상태일 수 있는데, 이럴 경우 실시간 상담 기능을 이용하면 바로 해결할 수 있다! 유데미에서 지르고 싶은 강좌가 생겼는데, 카드번호를 입력해도 계속 지원팀에 문의하라는 메시지만 뜬 적이 있었습니다. 😅 카드 문제인가 싶어 친구한테도 부탁해 보고, 모바일로 시도해도 결과는 똑같았네요. 그래서 '엥이,,, 못된 스타트업 같으니,,,' 하고 새로운 계정을 팔까도 고민했지만, 사놓은 강의들이 아까워 조금 더 찾아보기로 했습니다. 👨🏻💻 유데미 지원 센터 - 실시간 문의하기 링크 : https://support.udemy.com/ 유데미 지원 센터에서는 다양한 해결책들이 정리되어 있습니다. 다만 어느 지원 센터가 그렇듯, 결론은 "안되면 문의하세요" 입니다. 그럼 문..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/kBks2/btq6fS3GJXq/MdphdCzCEpJpXc1xCa4Oxk/img.png)
📋 내용 : git이 파일명 대소문자 변경사항을 감지하지 못할 때 아주 열받는 문제다. home.tsx라는 파일을 만들고 한번 커밋 트리에 반영되면, 이후에는 Home.tsx라고 이름을 바꿔도 인식하질 못한다. (+ 대략 알아보니 MacOS나 깃허브 GUI 버전에서 발생하는 문제라고 한다.) 이전에 윈도우 노트북에서는 이런 문제가 없었던 것 같은데, 아무튼 이것 때문에 배포도 실패하는 등 사소하게 거슬리는 문제다. 여하튼, 결론은 깃에서 케이스(대소문자) 변경사항을 무시하지 않도록 하는 명령어를 한번 쳐주면 된다. (※ 깃 설정을 한번 바꾸면 이후에도 계속 반영되니, 최초 1회만 입력하시면 됩니다.) git config core.ignorecase false 📋 참고 I change the capital..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bXFMY3/btq53Y4gYIJ/KEj8VfpiK3OMQAMJF4Y8F0/img.png)
[백준 온라인 저지 링크] 4963번: 섬의 개수 입력은 여러 개의 테스트 케이스로 이루어져 있다. 각 테스트 케이스의 첫째 줄에는 지도의 너비 w와 높이 h가 주어진다. w와 h는 50보다 작거나 같은 양의 정수이다. 둘째 줄부터 h개 줄에는 지도 www.acmicpc.net 특별한 점은 없는 탐색 문제입니다! 다만, 섬을 사방이 아니라 대각선까지 탐색해야 한다는 점에만 유의하세요! [정답 코드 - Python] from collections import deque dy = [-1, 0, 1, 0, -1, 1, 1, -1] dx = [0, 1, 0, -1, 1, 1, -1, -1] def BFS(node): q = deque() q.append(node) global visited visited[nod..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cGCZ5F/btq52U2dZy5/EEQGVCmcFygsjneKY8OEB0/img.png)
Array.from() 은 문자열 등 유사 배열(Array-like) 객체나 이터러블한 객체를 배열로 만들어주는 메서드입니다. (※ 유사 배열 객체란, 키가 인덱스 값으로 되어있고 길이를 나타내는 length 속성을 갖는 객체를 의미합니다.) // 1. 문자열을 배열로 만드는 예시 console.log(Array.from("Hello")); // [ 'H', 'e', 'l', 'l', 'o' ] // 2. 유사 배열 객체를 배열로 만드는 예시 console.log(Array.from({ 0: "찬민", 1: "희진", 2: "태인", length: 3 })); // [ '찬민', '희진', '태인' ] // 3. 함수의 매개변수들을 순서대로 배열로 만드는 예시 const funcA = (...argume..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/vifcG/btq53Y39EG0/BE0OWmPvhP5zIF5bO2OKSk/img.png)
타입스크립트로 리액트 프로젝트를 진행하다 보면 가장 난감한 것 중 하나가 바로 DOM과 관련된 부분인데요, 문자열이나 정수, 객체 정도는 원시 타입이나 인터페이스로 해결할 수 있지만 DOM은 같은 특이한 타입들이 존재하기 때문입니다. const onChangeEmail = e => { setEmail(e.target.value); }; 위 코드의 이벤트 콜백 인자 e의 타입은 과연 무엇일까요? 아마 e가 정확히 어떻게 생겼는지 알 수 없으니 any타입을 사용하시는 분도 많을 텐데요, 정확한 답은React.ChangeEvent입니다. 이걸 도대체 어떻게 알까 싶지만, 사실 여기에는 규칙이 하나 있습니다. 이벤트에도 마우스 클릭, 키보드 키 누르기 등등 여러 종류가 있음은 아실텐데요, 이 중에서 사용할 이벤..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bp5vMO/btq56d0tihQ/VqP1TKKnzy7LcUlKgToGe1/img.png)
내용 : 파일명 변경 후 임포트 시 Already included file name~ 에러가 출력됨. 원래 SignUpModal 이라는 이름의 파일을 SignupModal로 변경했더니 갑자기 빨간 줄이 그어지면서 알 수 없는 오류가 출력됩니다. 아마 바벨이나 웹팩 문제인줄 알고 발만 동동 구르실 수 있는데, 다행히 타입스크립트 설정으로 고칠 수 있는 문제였습니다. Already included file name~ 에러가 출력된다면 tsconfig.json의 옵션 중 forceConsistentCasingInFileNames 가 true로 되어 있을 것입니다. forceConsistentCasingInFileNames 옵션을 false로 설정해주면, 문제가 해결됩니다. (+ 설정을 변경했음에도 문제가 해결..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/c7cAts/btq53RwJ3qI/donN23heOf8Oo5Zem2Mfz1/img.png)
Next.js에는 두 가지 중요한 기본 페이지가 있는데요, 바로 _document와 _app 입니다. _document와 _app에는 페이지에 공통적으로 적용될 내용을 작성하곤 하는데, 둘이 정확히 어떻게 다른지와 어떤 내용을 작성해야 하는지에 대해 정리해 보겠습니다. 📝 App 페이지 _app은 서버로 요청이 들어왔을 때 가장 먼저 실행되는 컴포넌트로, 페이지에 적용할 공통 레이아웃의 역할을 합니다. 🎯 주요 사용 목적 모든 컴포넌트에 공통으로 적용할 속성 관리 function MyApp({ Component, pageProps }) { return } export default MyApp ⚙️ 규칙 1. Component 속성값은 서버에 요청한 페이지가 됩니다. (Ex. http://localhost..