-
Javascript, jQuery 2022‧10‧17
배열의 마지막 값 가져오기
slice(-1)을 이용해서 배열의 마지막을 가져올 수 있다. 하지만 이렇게 하면 배열의 마지막 값만 배열에 담기는 것이라["E"]가 된다. 그렇기 때문에 "E" 만 받아오려면 아래처럼 다시 배열안의 값을 가져온다. 또는 아래처럼도 배열의 마지막 값을 가져올 수 있다.
-
Javascript, jQuery 2022‧10‧11
논리연산자(논리합 논리곱) 단축평가
검색해서 나온 설명들이 어려워서 정리해봤다. 논리곱 (&&) A 조건이 맞으면 A, 그렇지 않으면 B 를 반환한다.이걸 if 문으로 풀자면 if(A){ A } else { B } 인데 단축평가이기 때문에 이렇게 if 처럼 연산되지 않고 A를 바로 반환한다. 그냥 이해하기 쉽게 이렇게 if 로 풀어봤다. 논리합 (||) A 조건이 안맞으면 A, 그렇지 않으면 B 를 반환한다.이걸 […]
-
Tools 2022‧08‧25
git - 깃 버전 차이로 인해 다른 브랜치 것으로 덮어씌우기
A라는 브랜치를 B 라는 브랜치 것으로 덮어 씌우고 싶을 때 이렇게 하면 A 라는 브랜치는 예전 커밋들 사라지고 B라는 브랜치 커밋들로 덮어 씌워짐(참고로 만약을 대비해서 이런 작업할 때는 브랜치를 로컬에 백업해 놓아야 함)
-
Javascript, jQuery, Reactjs, Tools 2022‧07‧15
js - 채널톡 삽입(커스텀 버튼, 뱃지 카운트, 서포트봇 양식 연동)
요즘 채널톡(https://channel.io/)을 이용해서 웹사이트에 채팅 상담을 하는 기능을 만드는 데 기본 제공하는 스크립트를 넣어 아래처럼 버튼 설치 및 설정을 통해 쉽게 구현할 수 있다. 그러나 이렇게 삽입을 하면 아래 이미지처럼 기존 웹사이트의 최상위 레이어로 위에서 생성한 버튼이 고정 노출되게 된다. 하지만 웹사이트 개발할 때 기존 웹사이트 ui/ux 맞게 채널톡 버튼을 만들고 싶고 거기에 채팅 메시지가 […]
-
Reactjs 2022‧04‧20
react jsx 스타일을 조건 넣어 인라인으로 처리
기존에 리액트로 작성할 때 인라인으로 스타일을 넣고 조건에 맞춰 값을 넣은 적은 있었다. 예를들어 state 에 abc 값이 있으면 0, 없으면 100%의 width로 지정한다고 할 때, 이렇게 쓸 수 있다.그런데 이렇게 되면 강제로 width를 꼭 이 곳에서 처리되게 된다. 다른 css 파일들에서 이 영역에 스타일을 붙였다면 그 스타일들은 무시되고 위에 인라인으로 처리된 것이 적용될 것이다. […]
-
Javascript, jQuery 2021‧12‧30
JS - ?? 연산자 넣어서 기본 값 넣기 (null 병합 연산자)
?? 는 널 병합 연산자 (Nullish coalescing operator) 로 ES6부터 쓰기 시작했다.지원 브라우저 체크하는게 좋다. 설명) 'A가 null 이거나 undefined이면 B로 해라' 라고 까지만 설명들을 봤다. 좀 더 디테일한 설명이 필요한데 'A가 null 이거나 undefined이면 B로 하고 그렇지 않으면 A로 하라' 라고 풀어 설명해 주는게 좋을 듯 하다. 나는 기본값을 지정해주는 용도로 사용하고 있다.위 문법 […]
-
TypeScript 2021‧12‧06
refers to a value, but is being used as a type here. Did you mean 'typeof'
리액트를 타입스크립트로 작성할 때 위와 같은 오류 로그를 발견하였다. 이유는 화면 .tsx 로 구현되어야 할 페이지를 .ts로 파일명을 작성하였기 때문이다.이런 경우는 파일 확장자 명을 .tsx에서 .ts로 변경하면 된다.
-
Tools 2021‧11‧10
git 403 에러에 remote set-url 으로도 해결 안될 때 (mac OS)
작업하는 중에 깃을 사용할 때 git the requested URL returend error 로 403 이 발생하기 시작했다. 어느날 갑자기 webstorm에서 뜬금없이 403 에러를 보내면서 아래 메시지도 자동 갱신에 걸려 비슷한 오류를 로그에 보여주고 있었다. pull 을 받아봤다.이벤트 로그에는 아래처럼 설명되었다. 그리고 cli로 git pull을 입력했을 때는 아래처럼 오류가 나왔다. 접근 권한에 문제가 생긴 것 같다.그런데 생각해보면 […]
-
TypeScript 2021‧11‧09
타입스크립트와 함께 React.lazy 사용하기
기존에 타입스크립트로 작성 전에는 아래처럼 작성했다. 그러나 타입스크립트로 작성하면 작동되지 않아 찾아본 결과 아래처럼 작성하여 해결되었다. 그리고 불러오는 대상 파일에 export default class { ... } 이렇게 되어 있는 부분에서 default를 삭제하고 내보냈다.