어느날 z-index가 적용이 안되는 문제가 발생해서 원인을찾다보니 stacking context라는 이론까지 도달하게되었다 내가 정리한내용을 살펴보자 아래에 나올 내용에 대해 이해한대로 간략하게 정리해보자면 stacking context -> html elements를 쌓기위한 자료 (z-index를 적용한 elements에서부터 시작) stacking order -> html elements를 어떻게 쌓을지에 대한 정책 1. z-index를 적용하는순간 stacking context가 만들어진다 2. html document의 모든 elements는 document내에서 다른 element 보다 앞에 있거나 뒤에 있을 수 있다. 이것이 stacking order 3. z-index는 position ..
next12 버전 -> next 13 app directory 로 변경하면서 발생한 오류이다 useRouter는 SSR할때 사용가능하지만 해당컴포넌트는 CSR로 설정되어있다 (최상단에 use client 선언) 여기서 페이지 이동을 하고싶으면 useNavigation을 사용해야한다 import { useRouter } from 'next/router' 이놈을 import { usePathname, useRouter } from 'next/navigation' 이놈으로 바꿔주면 된다 끝
REST API란? Representatinal State Transfer의 약자 자원 (Resource) - URI /member/{id} - 여기서 member라는 리소스만 식별 행위(Verb) - Http Method /member/{id} - 어떻게 처리할지 정의 표현(Representations) 즉 , API란 URI에서 식별한 resource(member)를가지고 어떤행위(Http Method)를 할지 표현한 것 REST API 설계규칙 소문자사용(주소에서 대소문자 구분하므로 카벨케이스가 아닌 소문자사용 할 것) 언더바보다는 하이픈을 사용할것( _ x - 0) 슬래시는 계층구분용도기 때문에 마지막에는 사용하지않는다 Http Method관련 용어는 포함하지않는다 동사보다는 명사를 사용해서 명명..
문제발생 개발중에는 적용되던 폰트가 빌드 후 적용안됨 문제 분석 빌드하게되면 폰트, 이미지, svg 파일들은 .next/static/media 폴더안으로 들어가면서 절대경로로는 찾을 수 없게된다 해결방법 오류발생코드 오류 해결 코드 차이점이 보이시나요? 폰트 받아오는 경로를 절대경로 -> 상대경로로 수정 하면 해결됩니다 끝
1. 내가 보려고 만든 국내 IT 기업 기술 블로그 20개 1) kakao Tech · 카카오의 기술 블로그로, 카카오 서비스를 만드는 개발자들의 실제 개발 사례를 중심으로 기술과 노하우를 전달합니다. 이벤트와 오픈소스, 채용 정보도 확인할 수 있습니다. blog https://tech.kakao.com/ 2) 쿠팡 기술블로그 · 국내 온라인 쇼핑 사이트 쿠팡의 기술블로그입니다. 쿠팡 글로벌 개발팀이 쿠팡을 만들고 진화시키면서 배운 점과 얻은 교훈을 비롯해 다양한 테크 관련 이야기를 전달합니다. https://medium.com/coupang-engineering/kr/home 3) WATCHA 팀 블로그 · 국내 OTT 서비스의 대표 주자 왓챠의 팀 블로그입니다. 개발, 테크, 기술이 가장 메인 주제입..
1. list 한번에 insert 하기 거두절미 하고 일단 mybasit mapper부터 보면 controller에서는 List를 파라미터로 받아서 매퍼까지 넘겨줬다 하나하나 간략하게 알아보면 나는 insert할건데 id는 insertMaintenanceByDaily로 mapper.java랑 매핑할거고 파라미터는 Map형태로 받아올거야 insert해야할 컬럼들은 고정이니 foreach밖으로 빼놓자(안에 넣어도 상관없음) foreach를 이제 살펴보자 그냥 for문이랑 비슷하다고 생각하면 된다. 1. foreach로 반복해서 insert할건데 2. 반복해서 입력할 자료구조(collection)는 list고 3. list안의 data들 각각은 item이라고 부를거야 4. 반복문 끝날때마다 콤마( , )로 구..
MariaDB MariaDB 데이터베이스 비밀번호 변경방법 다른개발자들과 로컬 테스트db 비밀번호 통일이 안되어있어서 비밀번호 통일하면서 찾아봄 root 계정 DB 비밀번호 admin으로 바꾸는 명령어 - 끝 길게 설명하고싶지만 설명할 것도없다 simple is best
React.js __ { Object(...) is not a function } React 사용중 Object(...) is not a function 라는 오류를 만났다 ( 이런유형의 오류만나면 구글링하다 하루 다갈수있음) 오류를 보면 const history = useHistory(); 이 한줄이 문제란 무책임한 오류한줄을 보고 구글링을 시작한다 구글링 시작하자마자 맨위에 나오는 블로그에서 해결방법을 찾았는데 제리조셉 형님께서 2020년 3월 9일에 남겨주신 한줄의 글에 난 구원받을수 있었다 react-router-dom 대신 react에서 useHistory를 가져오고 있었다? import 똑바로 했나 내코드를 보러가보자 헿 제리조셉 형님과 같은 실수를 하고있었다 use는 react지 라는 고정관..
쇠질하듯 타겟포인트만 간단하게 포스팅 npm-check-updates package.json의 dependencies 와 devDependencies 에 기록된 각 패키지들의 버전을 현재기준 최신버전으로 바꿔준다 설치방법 npm 라이브러리 설치하듯이 설치하면된다 (전체 라이브러리를 관리하기위한 목적이므로 범위는 -g) 사용법 CLI로 ncu를 입력하면 업데이트할 목록확인가능 CLI로 ncu-u를 입력하면 dependencies 와 devDependencies 의 패키지들이 최신버전으로 변경 변경사항을 적용하려면 npm install 실행하여 변경사항 적용 더보기 실제 솔루션에서는 라이브러리 하나하나 버전바뀌는거에 아주민감하기에 그냥 최신 트렌드 공부하는 토이프로젝트에나 적용할만하다 3줄요약 npm ins..
무지성으로 활용하는 React Hook에서 componentWillUnmount() 기능 사용하기 React에는 useEffect라는 어마무시한 Hook이 있다 혼자서 아래 3가지 기능을 다 담당 1. componentDidmount 2. componentWillunmount 3. componentDidUpdate 지금 이 포스팅에서는 2번째로 서술한 componentWillunmount 요녀석에 대해서 알아보자 useEffect(() => { console.log('컴포넌트 나타나면 실행될 함수 구현'); return () => { console.log('컴포넌트 사라지면 실행될 함수 구현'); }; }, []); 저 함수를 Modal, Popup, Tooltip 등등에 넣어보고 창을 열었다 닫았다하면..
import numpy as np import cv2 from matplotlib import pyplot as plt """ Homography의 정의 두 이미지를 비교했을때 서로 매칭(투영이라고 표현하면 이해에 도움이될듯하다)되는 포인트사이에서의 변환 관계 cv2.findHomography()와 cv2.perspectiveTransform() 함수를 사용하여 Homography 분석을 통해 투영된 영역을 찾아낼 수 있다. """ sample1 = r'C:\Users\admin\Desktop\Gunha_test\Test.png' sample2 = r'C:\Users\admin\Desktop\Gunha_test\input.png' img1 = cv2.imread(sample1,0) # queryImage..
안녕하세요 하울의 Code_Lift 입니다 리스트 추가할때 항상 리스트 2개만들고 + 연산자를 이용해서추가를 했었는데 좀 색다른방법이 없을까하고 찾아보니 여러가지가 있어서 간단하게 정리해봤습니다 ################### # list 추가하는방법 1 ################### a = [1, 2] a.insert(0, 4) # a 리스트의 (0번째에, x값을 넣어라) print(a) # 실행결과는 # a리스트의 0번째에 4가 들어간 [4, 1, 2] ################### # list 추가하는방법 2 ################### # 서로 합칠 여러개의 리스트를 준비 a = [1, 2] b = [3] c = [4] # 더한 순서대로 인덱스에 맞춰 리스트에 추가된다 a =..