분류 전체보기 122

두 쿼리 결과 비교하는 방법 : EXCEPT, NOT IN

EXCEPT SELECT DISTINCT SuhumNo FROM z2023_SubjectScore SS INNER JOIN tbDocuMaster DM ON DM.IpsiYear = SS.IpsiYear AND DM.IpsiGubun = SS.IpsiGubun AND DM.SocialNumber_Hash = SS.SocialNumber_Hash WHERE GraduateYear > 2022 EXCEPT -- 두 번째 쿼리 SELECT DISTINCT SuhumNo FROM tbDocuMaster WHERE GraduateYear > 2022; 첫 번째 쿼리에서 반환된 결과에서 두 번째 쿼리에서 반환된 결과를 제외한 결과를 확인 가능. 만약 이 결과가 비어있다면 두 쿼리의 결과는 같고, 결과가 있다면 두 ..

What I Learned/SQL 2023.07.28

링크 복사 기능 구현하는 Clipboard API

const handleCopyLink = (url) => { navigator.clipboard.writeText(url); }; url에는 string 형식으로 아무거나 들어갈 수 있다! 나는 버튼을 클릭하면 해당 페이지의 링크가 복사되길 바랐기때문에 함수가 실행될 때 url을 파라미터로 넘기는 식으로 구현했다. 현재 페이지의 URL을 체크하는 방법은 아래와 같다. import { useLocation } from "react-router-dom"; const location = useLocation(); location을 콘솔 찍어보면 pathname이라는 키가 들어있다. handleCopyLink(`${baseUrl}${location.pathname}`) baseUrl은 페이지의 기본URL, 페이..

[React] non-boolean 콘솔 에러: "Warning: Received false for a non-boolean attribute className."

"Warning: Received false for a non-boolean attribute className." className에 boolean 형태의 값을 받았다는건데 아무리 검색해봐도 boolean을 갖고 있는 형태는 들어가있지 않았다. 구글링해보니, &&연산자를 사용해도 동일한 에러를 발견할 수 있다는 결과가 있었고 실제로 &&연산자를 사용하고 있었다. // ❌ This will throw the above error // ✔️ Use a ternary instead && 연산자를 삼항연산자로 변경하니 에러는 사라졌다! className={state && value} 인 경우에는 state가 false일 때도 있으므로 boolean 값이 들어가 이게 오류의 원인이었던것, https://webt..

[React] useEffect 에러 : useEffect must not return anything besides a function, which is used for clean-up.

콘솔 에러 정리 중 만난 에러 useEffect must not return anything besides a function, which is used for clean-up. useEffect(() => 이 부분이 원인,[]) 중괄호({})로 감싸주면 뚝딱! https://velog.io/@posinity/%EC%97%90%EB%9F%AC-Warning-useEffect-must-not-return-anything-besides-a-function-which-is-used-for-clean-up [에러] Warning: useEffect must not return anything besides a function, which is used for clean-up. Warning: useEffect ..

[JS] 중첩 배열 한 배열로 합치고 싶을 땐 Array.flat()

[ [ {...}, {...} ], [ {...}, {...} ] ] 이런 상황에서 두 배열을 합치는 방법으로 array.flat()이 있다. [ {...},{...}, {...}, {...} ] https://mine-it-record.tistory.com/491 [ES6+] arr.flat() - 배열의 평탄화, 중첩 배열 하나로 만들기 (ft. flatMap()) ES2019(ES10)에서 새롭게 추가된 Array.prototype.flat() 메서드에 대해 알아보자. 이 메서드는 모든 하위 배열 요소를 지정한 깊이까지 재귀적으로 이어붙여 새로운 배열로 만들어주는 역할을 한다. ▷ mine-it-record.tistory.com

[Eslint] import 자동 정렬은 Eslint로!

여러명이 협업하는 경우... 다 제각각 코드 작성 스타일이 다르다. 이걸 맞춰나가는게 협업이라지만, 이런것까지 맞춰야하나 싶은 생각이 들기도 한다. 그 '이런것'에 해당하는 것 중 하나가 import 정렬이었는데.... Eslint에서 import order를 설정할 수 있다고 한다!! 즉, eslint에게 규칙만 알려주면 많은 사람들이 제각각 import 해와도 자동으로 정해진 규칙대로 정렬이 되는 것!!! 일단, eslint부터 설치해준다! npm install -D eslint 이때 확장에서 eslint도 함께 설치해주어야 한다. 그리고 프로젝트의 root 위치에서 .eslintrc.js이라는 파일을 만들어주어 그 안에서 이제 규칙을 작성하면 된다. 기본 순서는 ["builtin", "externa..

What I Learned/etc. 2023.02.16