본문 바로가기

분류 전체보기170

[PostgreSQL] INSERT INTO SELECT 1. 첫번째 방법 INSERT INTO [생성할 테이블] SELECT [컬럼1, 컬럼2, ...] FROM [가져올 테이블] WHERE [조건] 아래와 같이 에러 문구가 나올 경우 두번째 방법을 사용하시면 됩니다. ERROR: column "id" is of type bigint but expression is of type timestamp without time zone Hint: You will need to rewrite or cast the expression. Position: 34 2. 두번째 방법 (serial) INSERT INTO [생성할 테이블](컬럼1, 컬럼2, ...) SELECT * FROM [가져올 테이블] WHERE [조건] 3. 예제 작성기준 환경 OS macOS postg.. 2023. 4. 10.
[Mac] 화면분할 프로그램 Magnet 마그넷 윈도우(Window)처럼 화면분할을 자체적으로 Mac에서 지원하는게 없어서 Magnet 마그넷을 통해서 화면분할을 쓰고 있습니다. 1. App store magnet 검색 2. 마그넷 승인하기 시스템 설정 - 개인정보 보호 및 보안 - 손쉬운 사용 - Magnet.app 활성화 3. 마그넷 환경설정 화면 오른쪽 최상단에 보면 마그넷 아이콘이 생겼을겁니다. 거기서 환경설정을 들어가면 단축키가 나옵니다. control + option + 방향키를 사용하시면 됩니다. 2023. 4. 9.
[Mac] iTerm2 설치하기 iTerm2는 macOS에서 많은 편의기능을 제공해주는 Terminal Application입니다. 1. 공식 홈페이지 접속 [iTerm2 홈페이지]: https://iterm2.com/index.html iTerm2 - macOS Terminal Replacement iTerm2 by George Nachman. Website by Matthew Freeman, George Nachman, and James A. Rosen. Website updated and optimized by HexBrain iterm2.com 2. 다운로드 클릭 3. iTerm2.zip 압축풀기 다운로드 폴더에 iTerm2-버전.zip (필자에 경우: iTerm2-3_4_19.zip) 파일이 설치 되어있을 겁니다. 4. iTe.. 2023. 4. 9.
[Mac] Finder 숨김 폴더 보기 ⌘⇧. Command-Shift-. 단축키 누르면 보입니다. 2023. 4. 8.
[Javascript] getElementById vs querySelector 비교 결론부터 말씀드리면 getElementById가 조금 더 빠르기 때문에 id가 있는 Element를 찾는 경우에는 getElementById를 사용하고 보다 정교하게 Element를 찾는 작업이 들어가면 querySelector를 사용하는게 좋습니다. 1. getElementById 주어진 ID 문자열과 일치하는 속성을 가진 Element를 찾아 반환합니다. 결과가 없다면 null document.getElementById(id); 2. querySelector 제공한 선택자 또는 선택자 그룹과 일치하는 문서 내 첫번째 Element를 반환합니다. 결과가 없다면 null 백슬래시("\")를 사용해 특수문자를 이스케이프 해야합니다. document.querySelector(selectors); 예제 See.. 2023. 4. 7.
[PostgreSQL] 문자열 자르기 (SUBSTRING, SPLIT_PART, REPLACE) 1. SUBSTRING SUBSTRING( 문자열, 시작위치, 길이 ) - 문자열: 문자를 자르기 위한 전체문자 - 시작위치: 1부터 첫번째 글자로 시작합니다. - 길이: 시작위치로부터 길이까지 문자열을 자릅니다. 예시 ( 기본 ) SELECT SUBSTRING('가나다라마바사' , 1, 3); -- 가나다 SELECT SUBSTRING('가나다라마바사' , 2, 2); -- 나다 SELECT SUBSTRING('가나다라마바사' , 3, 1); -- 다 예시 ( 마지막 문자까지 ) -- address 컬럼에 '서울특별시 마포구 희우정로'라고 있다고 가정. SELECT SUBSTRING(address , 7, LENGTH(address)); -- 마포구 희우정로 2. SPLIT_PART SPLIT_PART.. 2023. 4. 5.
[Google Adsense] 광고 차단 회복 적용하기 사이트에서 광고를 허용해주세요라는 문구를 보신적 있으실 겁니다. 광고 차단 회복이라는 기능을 통해서 적용하는데 아래와 같이 진행하시면 적용 하실 수 있습니다. 1. 구글 애드센스 접속 [구글 애드센스]: https://adsense.google.com/start/ Google 애드센스 - 웹사이트에서 수익 창출하기 Google 애드센스의 웹사이트 수익 창출 기능을 사용하여 수익을 올려보세요. Google 애드센스에서 광고 크기를 자동으로 최적화하여 광고의 노출 및 클릭 가능성이 높아집니다. adsense.google.com 2. 개인정보 보호 및 메세지 클릭 3. 광고 차단 회복 클릭 4. 메세지 만들기 클릭 5. 사이트 추가 클릭 6. 사이트 추가 1. 사이트 URL 선택 2. 로고 (선택) 3. 맞춤.. 2023. 4. 5.
[Svelte] CSS style 변수 사용하는 방법 1. Custom Properties 활용 the color is set using a CSS variable 사용하는 상단 div에 커스텀 프로퍼티(--theme-color: {color})를 넣고 하단 style에서 var를 활용해 해결하면 됩니다. * 커스텀 프로퍼티(Custom Property)는 앞에 더블 하이픈(--)으로 시작합니다. 참조 [svelte dev]: https://svelte.dev/repl/4b1c649bc75f44eb9142dadc0322eccd?version=3.6.7 CSS variables • REPL • Svelte svelte.dev [mdn custom properties]: https://developer.mozilla.org/en-US/docs/Web/CSS/U.. 2023. 4. 3.
[Javascript] 현재 화면 높이 구하기 get document body height 1. 높이 요소 중 최대값 구하기 const body = document.body; const html = document.documentElement; const height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight ); console.log(height); 참조 [stakoverflow]: https://stackoverflow.com/questions/1145850/how-to-get-height-of-entire-document-with-javascript How to get height of entire .. 2023. 4. 3.
[HTML] 공백 삽입 ( ) None-Braking Space HTML에서는 스페이스는 1번만 인식하기 때문에 추가로 공백을 삽입하고 싶으면 HTML Entity를 사용해야합니다. See the Pen Untitled by Park, Chungman (@pcm9881) on CodePen. 참조 [HTML Entities]: https://www.w3schools.com/html/html_entities.asp HTML Entities W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQ.. 2023. 4. 1.
[MUI] v4 Drawer elevation classes paper 사용시 elevation 미동작 Drawer Elevation doesn't work when paper class is defined material ui v4 1. 문제 https://v4.mui.com/api/drawer/ Drawer API - Material-UI The API documentation of the Drawer React component. Learn more about the props and the CSS customization points. v4.mui.com 내용 공식 문서 내용을 보면 elevation에 number 타입으로 기본 16이라고 작성이 되어있으나 계속해서 0으로 인식되는 문제가 발생했습니다. 2. 해결 [Github material-ui]: https://github.com/mui/mat.. 2023. 3. 30.
[CSS] div 위아래 수직정렬 1. flex .parent { display: flex; align-items: center; } See the Pen Untitled by Park, Chungman (@pcm9881) on CodePen. 2023. 3. 30.