자바스크립트 문자열 전체 replace 하기 (replaceAll)

문자열 replace는 특정 값을 지정한 값으로 바꿔주는데, 문자열 전체를 바꿔주진 않는다. 처음 해당하는 변수만 바꿔주고 실행을 멈춘다. 그렇다고 for문을 다 돌리기엔 코드 가독성이 안좋아서 정규식으로 하는 방법을 찾았다. 이렇게 하면 된다! 혹시 안의 값이 소대문자 구문이 필요하지 않으면 gi를 넣으면 된다.

Read more
React ) useScroll / 노마드코더말고 직접 만든 스크롤 훅

섹션마다 스크롤 이벤트를 더해야해서 custom hook으로 만들어봤다! 노마드 코더와 다른 점은 element가 정해진 지점에 오게되면 true를 반환해서 해당 컴포넌트에서 스타일을 더하게된다. (이건 각자 css에서 정하면 된다 나같은 경우는 fade in) useScroll 사용예시

Read more
React ) \n 을
태그로 렌더링하기

api로 받은 데이터에 \n이 포함되어있는데, 받은 그대로 렌더링을 하면 줄바꿈이 되지 않는다. 그럴 땐 \n을 기준으로 split하여 배열을 생성하고, 렌더링 하면된다.

Read more
자바스크립트 빈 객체 체크하기

자바스크립트에서 빈 객체를 체크하는 법 빈객체는 null, undefined, length로 체크를 할 수 없기 때문에 객체의 속성을 배열로 만드는 Object.keys()함수를 사용해서 빈 객체를 체크한다. 사용예시

Read more
axios request마다 authorization 업데이트 하는 방법 ( interceptor )

프로젝트를 진행하는데 api마다 axios의 headers를 import해서 사용하였다. 그런데 그렇게 사용하다보니 axios가 header를 매번 update하지 않아서 authorization이 제대로 되지 않았다. 예를 들면, 로그인 하기 전의 token value를 가지고 있어서 로그인 하고 나서 새로고침 하기 전까지는 authorization이 undefined or null 값이 들어가게 되었다. 그래서 막 찾다보니 axios.interceptor로 이슈를 해결할 수 있었다. interceptor는 axios가 request가 발생할 때마다 작동하게 […]

Read more
React ) axios로 엑셀 파일 다운로드

먼저 axios로 파일 다운로드를 요청할 때, responseType을 arraybuffer로 지정해준다. 2. request를 받아 Blob 객체를 만든다. 이때 백에서 heades에 content-type과 encoded-disposition에 파일의 정보를 담아 보내주어야 한다. content-type을 Blob 객체를 선언할 때 type을 정의하는데 만약 항상 고정되어 있는 타입을 받아온다면 하드코딩으로 해도 된다. encoded-disposition은 파일의 이름을 지정할 때 쓰인다. 경우에 따라 디코딩을 해야한다(예시에 방법기재) 주의할 점 : […]

Read more
Input=file 에서 같은 파일 입력받기

Input 태그를 통해서 파일을 입력받을 때 onChange 이벤트를 더하게 된다. 그런데 onChange는 실질적인 데이터가 바뀔때만 반응하므로 기존의 파일을 다시 업로드할 때는 이벤트가 작동하지 않으므로 value를 reset 해줄 필요가 있다. 이렇게 이벤트 함수에서 value를 리셋해줄 경우, 다시 같은 파일을 입력해도 이벤트가 작동하게 된다.

Read more
1일 1코딩) Programmers Lv1. 같은 숫자는 싫어

문제: https://programmers.co.kr/learn/courses/30/lessons/12906 코드1. 처음엔 단순히 문제를 그대로 해석해서 풀었는데, 다른 사람의 풀이를 보니 훨씬 깔끔한게 있었다. 같은 숫자가 연속될 경우 패스하고, 아닐 경우 result에 push 하는 방법!

Read more
1일 1코딩) Programmers Lv1. 3진법 뒤집기

문제: https://programmers.co.kr/learn/courses/30/lessons/68935 코드1. number type을 n진법으로 변환 : num.toString(n); string type을 number n진법으로 변환 : Number.parseInt(str, n); string을 뒤집기 : str.split(”).reverse().join(”); array => reverse => string

Read more