kipid's blog

# DATABASE setup of Panda Market by kipid판다마켓을 위한 DATABASE 를 구축해 봅시다.## PH2024-09-24 : First posting.## TOC## 기본: npx prisma init```[.scrollable]npx prisma init --datasource-provider postgresql```/명령을 실행해서 다음과 같은 파일을 얻자.```[.scrollable]generator client { provider = "prisma-client-js"}datasource db { provider = "postgresql" url = env("DATABASE_URL")}```/.env 파일 설정을 다음과 같이 하자.```[.scrollab..

# prisma with PostgreSQL 를 배워봅시다.## PH2024-09-15## TOC## Prisma 초기화```[.scrollable]npx prisma init --datasource-provider postgresql```/.env 파일 설정하기. 아이디는 자동으로 postgres 로 정해지고 아래에 [password] 는 자신이 설정한 비밀번호를 넣어주고 (비번에 특수문자가 들어간 경우 encodeURIComponent kipid's blog :: Encode/Unescape and Decode/Escape URI Component 함수로 한번 처리해 준 뒤 넣어줘야 함. #, ? 같은게 URL 에선 특수하게 쓰이니...), [database_name] 에는 사용할 DB name 을 ..

# CSP (Content Security Policy) : iframe, image (img), video blocking```document.referrer; // in javascriptreq.headers().get("Referer"); // in vert.x```/referrer 통해서 연결을 허용할 것인가? 말 것인가를 결정하는 거인듯?그런데 CORS (Cross-Origin Resource Sharing) 하고는 좀 다른 개념인건가? 헷갈리네...## RRAMDN - CSP (Content Security Policy) policy directivesMDN - Cross-Origin Resource Sharing (CORS)MDN - The X-Frame-Options response hea..

# 페이스북 퍼오기 (Embeding facebook post)페이스북 퍼오는게 옛날보다 쉬워졌음.## TOC## Example아래와 같이 iframe 으로 퍼오도록 바뀌었음. 좋으다. 국내 IT 업체들도 iframe 으로 쉽게 퍼오도록 좀 바꿔주지 =ㅂ=;;그런데 facebook 도 width 를 responsive 하게 동작하도록 안해주긴 했네 ㅡ,.ㅡ;그리고 가운데 정렬이 힘든데? =ㅇ=;; 어떻게 해야 가운데 정렬이 될까나?``` ```/ ## RRAdevelopers.facebook.com - Social Plugins - Embedded Posts

# Learning JavaScript, especially class-like Constructor function and Property Inheritance through prototype/__proto__ chainingWeb browser 에서 쓰이는, "Object-based based on prototypes" 특성을 갖는 client-side 프로그래밍 언어인 JavaScript를 배워 봅시다. 여기는 제가 헷갈렸던 부분만 조금 정리.## PH2017-08-14: 코드 스타일만 좀 정리. To SEE.2014-06-13: docuK upgrade.2014-05-21: First Posting.## TOC## Making an instance from a constructor function..

# 의료 파업 및 의료 영리화, 원격진료 관련윤석열 정부가 2024년 2월 2000명 규모의 의대 증원과 필수의료 정책 패키지를 발표하자, 의사 및 의대생들이 반대 집단행동에 나선 사건. 의료 파업의 표면적인 이유는 원격진료 반대와 수가인상인거 같긴한데... . 몇가지 관련해서는 분명 정부가 의료보험료를 내는 국민 다수의 편 입장임. 의료보험료가 적게 나가게 하고, 수가를 최대한 낮춰서 (진료의 질까지 낮아지면 문제지만) 전체적으로 적은 비용으로 치료를 받게하자가 정부의 입장인 것이니. 이에 반해 수가를 올리려는 입장의 의사들이 있는거고. 궁극적으로는 돈 싸움. 동네병원과 큰 병원의 싸움이든, 보험공단과 의사들의 싸움이든, 의사와 약사간의 싸움이든, 정부와 의사들의 싸움이든. 어쨌든 핫이슈는 돈인듯. (..

# 유튜브 리스트 (Youtube list) 로 퍼오는 법유튜브 영상 한개만 있는게 아니라, 리스트로 있는 영상들도 많은데, 이 때 동영상 하나만 퍼오는게 아니라 list 통째로 퍼오는 법을 알고 싶어서 정리하는 글.## PH2024-02-10 : First posting.## TOC## 리스트 퍼오기 예제링크: 그냥 동영상 볼 때의 링크: https://www.youtube.com/watch?v=xHW7KOcqToo&list=PLUbFnGajtZlUl0zYr4crGveP21BbcZG_L&index=1플레이리스트 | Playlist 홈의 링크: https://www.youtube.com/playlist?list=PLU9-uwewPMe05-khW3YcDEaHMk_qA-7lI 는 list=엄청긴_id 이런식..

# Java Serializable Object to Byte Array (byte[] or SQL BLOB)MySQL 에 Java Serializable Object 를 byte[] data 로 저장해 뒀다가 필요할때마다 꺼내쓰고 싶어서 알아보는 중 .그냥 string 형태로 변환한 뒤에 저장했다가 string 으로 읽어들이고 분석해서 처리하도록 짤수도 있긴한데... 속도면이나 프로그램 가독성 면에서 안좋을듯?그리고 그림 파일이나 비디오 파일도 어떻게 BLOB 형태로 저장할 수 있는지 좀 공부해봐야겠음.## TOC## Using StreamsException 처리나 close() 처리해야해서 좀 짜증나긴 하는듯.### To byte[]```[.scrollable.lang-java]ByteArrayOut..

# Time as an emergent phenomenon (시간을 근본적인 물리량 (physically fundamental quantity) 으로 보지 않고 창발적인 현상 (emergent phenomenon) 으로 볼 수 있다.)시간을 근본적인 물리량 (physically fundamental quantity) 으로 보지 않고 창발적인 현상 (emergent phenomenon) 으로 볼 수 있다는 논문같은데 -ㅇ-;;; 개인적으로 굉장히 충격적이고 참신한 접근 같음ㅋ. 아직 제대로 읽어보진 않아서 어떤식으로 어떤 더 근본적인 물리현상으로부터 시간개념이 창발한다는 것인지는 모르겠음. 양자역학이랑 시간이란 놈은 아무리 봐도 신기하단 (이해가 안간단) 말야.## RRA ArXiv - Time from ..

# week8 위클리 페이퍼 (데이터베이스 정규화에 대해 설명, 관계형 데이터베이스를 사용하는 이유를 설명)## PH2024-09-03 : First posting.## TOC## 데이터베이스 정규화에 대해 설명데이터베이스 정규화 (Normalization) 는 관계형 데이터베이스에서 데이터의 중복을 최소화하고 데이터의 일관성 (Consistency) 과 무결성 (Integrity) 을 유지하기 위해 데이터를 구조화하는 과정입니다. 정규화는 여러 단계로 나뉘며, 각 단계는 특정한 규칙을 따릅니다.### 제1정규형 (1 Normal Form)모든 속성이 원자값을 가져야 합니다. 즉, 각 열은 하나의 값을 가져야 합니다.테이블의 컬럼이 원자값 (Atomic Value, 하나의 값) 을 갖도록 테이블을 분해하..

i 소속 직위 성명 재산1 대통령 이명박 5,496,5982 국무총리 김황식 1,121,1663 대통령실 대통령실장 임태희 2,630,4654 대통령실 정책실장 백용호 3,488,6405 대통령실 정무수석비서관 정진석 4,531,5106 대통령실 민정수석비서관 권재진 2,562,7997 대통령실 사회통합수석비서관 박인주 435,3968 대통령실 외교안보수석비서관 천영우 1,389,1709 대통령실(현 지식경제부) 경제수석비서관(장관) 최중경 2,949,28710 대통령실 고용복지수석비서관 진영곤 2,184,36711 대통령실 교육문화수석비서관 진동섭 570,99112 대통령실 홍보수석비서관 홍상표 1,036,36413 대통령실 총무기획관 김백준 2,288,41914 대통령실 기획관리실장 김두우 2,1..

# Black Holes as Elementary Particles, and Elementary Particles as Mini Black Holes신기방기한 논문인듯. 개인적으로는 "기본 입자들이 작은 블랙홀 같은게 아닐까?" 생각중이기도 한데, 블랙홀을 기본 입자로 보는 시각도 있는듯? 제대로 읽어본적이 없어서 아직 크게 할말은 없음. 읽고나서 덧붙여야지.## RRA Nucl. Phys. B380 (1992) 447-477, Black Holes as Elementary Particles, by C.F.E. Holzhey, and F. Wilczek. (arXiv:hep-th/9202014) StackExchange physics - Are elementary particles ultimate fat..

# 방향키 (위: ArrowUp, 아래: ArrowDown) 로 숫자 조정하기방향키로 숫자 조작을 가능하게 만들어 봅시다. LabVIEW 에서 기본적으로 동작을 지원해줬던거 같은데, 이걸 JavaScript 로 구현해 보려고 함.해당 코드는 https://recoeve.net/ 점수 메기는데 적용되어 있습니다.## PH2024-09-16 : First posting.## TOC## Input Floating Number ## Code```[.lang-html] Floating Number ```/```[#pre-code-change-number]```/## RRA

# 윈도우 11 홈 (Windows 11 Home) 에서 RDP (Remote Desktop Protocol) 접속할 때 매번 비밀번호 안치고 접속할 수 있게 해주는 방법Windows 11 Home 에서는 RDP 연결할 때 비밀번호를 저장 못하고 매번 비밀번호 (password) 를 입력하고 RDP 에 접속했어야 했는데, Copilot 에게 물어서 Windows 11 Home 에서도 비밀번호를 처음에 한번만 입력하고 이후로는 기억해 놓은 password 로 접속할 수 있게 하는 방법을 찾았다.## PH2024-09-15 : First posting.## TOC## cmd 창 열고 레지스트리 값 추가하기cmd 창이나 Windows PowerShell 을 관리자 권한으로 열고 다음과 같은 명령어로 레지스트리..

# jQuery.ripples - 이미지에 물결 그래픽 효과 주기최근에 구글링을 하다가 블로그를 엄청 예쁘게 꾸미시고 글 퀄리티도 매우 뛰어난데를 발견했는데, 거기서 신기한게 있어서 나도 배우기 및 적용해볼겸 작성하는 글.## PH2023-11-29 : First posting.## TOC## jQuery.ripples.jsjQuery 라이브러리니 당연히 jQuery 가 선행되어야 하고, 실행 메소드 하나만 해주면 바로 적용이 된단다.유의 할점은 이미지는 태그가 아닌 css의 background-url 속성으로 적용되어야 한다고 한다. (객체 속성으로도 명시할 수 있음.) 아마도 그냥 img 로 load 되면 속성을 변화시키면서 img 를 바꾸는게 막혀서 그런듯 하다. (.gif 로 하면 더 멋질거 ..

# 한글 포함한 코딩 폰트 추천 (Recommending Coding Font with Korean supported)## PH2024-09-15## TOC## fonts.google.com :: Nanum Gothic Coding Nanum Gothic Coding 참조: 구글에서 coding 검색하니 이거 하나 뜸. 한글 지원되는 폰트만 보여주는건지, coding font 는 많을거 같은데 =ㅂ=;;;아무튼 한글이 나눔 고딕처럼 꽤나 예쁨. 영어 2글자가 한글 1글자 너비를 가지게 만들어 줬음.해당 font-family 가 안깔린 경우를 위해 아래와 같이 인터넷에서 폰트를 가져올 수 있도록 설정해 줘야 함.``````/CSS 는 다음과 같이 설정하면 됨.```body { font-family:'Nan..

# Time zone table | settingRecoeve.net timezone 설정을 위해 공부/연구하는 중. 어떻게 선택하게 해야 쉽게 설정 가능할까나?## PH2023-10-26 : Update. Vatican img. 근데 왜 sublime text 에서 HTML syntax 로 안보여주고 하얗게 일반 text 처럼 나올까나? 이상하네 ㅡ,.ㅡ;;;2023-07-05 : First posting.## TOC## Time in javascript```[.linenums.lang-js]new Date();Wed Jul 05 2023 08:21:44 GMT+0900 (한국 표준시)// Local time 으로 표시해줌. UTC+09:00new Date().toUTCString();'Tue, 04 ..

# event.keyCode deprecated, then event.key, event.code 는 무슨값을 가질까? (키보드 (KeyBoard) event handler: compositionstart compositionupdate compositionend)event.keyCode 로 단축키 설정하고 이것저것 했었는데 이미 몇년전에 deprecated 되었다네요. 에서 키보드가 눌렸을때의 각 값들을 잘 보여주고 있긴 한데, 한영키나 다른 나라 (중국, 일본 정도?) 키보드에서도 잘 동작하도록 하려면 테스트가 필요할거 같아서 본 글을 작성합니다.Korean, Japanese, Chinese typing handled. event.data on input, compositionstart, compo..

# week1 위클리 페이퍼 (CSS 에 대해 설명 (position, display: flex and grid), 시맨틱 (Semantic) 태그를 사용하면 좋은 점)## TOC## CSS (Cascading Style Sheets) 의 Cascading에 대해 설명해 주세요.Cascading: 폭포처럼 떨어지는...폭포가 계단형식으로 떨어지는 것처럼 CSS Selector 가 가장 specific (구체적: id, class, tag or postfix (e.g. :hover, :focus, :visited, :nth-child(3), :first-child, ::before, ::after, ::placeholder) 순으로 금은동 메기듯 더 상위 level) 스타일부터 적용시켜 나가면서 덜 spe..

# React Router 에서 CSS 충돌을 막고 좀 더 개발 친화적으로 CSS 를 다룰 수 있게 해주는 CSS module 을 배워봅시다. (Learning module.css)## PH2024-09-12 : First posting.## TOC## React Router### Install (npm install react-router-dom)```npm install react-router-dom```/과 같은 명령어로 우선 package 를 깔자.### 사용방법```import { BrowserRouter, Route, Routes } from 'react-router-dom';import ReactDOM from 'react-dom/client';import './root.css';import..

# Recoeve.net 퍼가는 법 (iframe) 및 reco 공유하는 법Recoeve.net 을 iframe 으로 퍼가는 법과 각 reco 들을 공유하는 법에 대해 설명드리겠습니다.## PH2023-12-28 : First posting.## TOC## iframe 으로 퍼가기.여러가지 옵션으로 iframe 으로 퍼오실 수 있는데, ToR (목록: 단축키 T) 을 키신 상태로 퍼오실수도 있고, 언어 설정을 다르게 해서 퍼오실수도 있습니다. Multireco mode (멀티레코 모드: 단축키 M) 로도 퍼오실 수 있어요.우선 퍼오고 싶은 유저의 recoeve.net 사이트에 접속하시고, floating bar (고정된 떠다니는 버튼들) 로 옵션을 적절히 선택해 주세요. ToR (목록) 을 킬 것인지 말..

# To correct inaccurate location measured by GPS with Wi-Fi RSSI (Received Signal Strength Indicatior). (Wi-Fi 신호세기를 이용해 GPS 튀는거 잡는 방법.)Wi-Fi (와이파이) 신호 세기로부터 거리를 추측하는 법을 알아봅시다.ps. License | Patent (특허권) : 상업적으로 사용을 금합니다. 상업적 사용을 원하시면 이 글에 댓글을 달거나 open kakao talk :: kipid 로 알려주세요. (우선 특허는 보류중.)GPS 가 가끔씩 튈 때가 있는데, 이 때 Wi-Fi rssi 를 이용해서 위치가 튀지 않았다는 것을 보정해주면 좋음. 거리가 얼만큼 변한건지 min, max 를 추측하려면 약간은 생각을..

# JAVA 에서 Selenium 이 제대로 동작 안할 때 해결법org.openqa.selenium.NoSuchSessionException 이 자꾸 뜰 때 해결법.## PH2024-09-05 : First posting.## TOC## JAVA 에서 WebDriver 의 path 를 정해주지 말고, Windows 환경 변수에서 PATH 에 WebDriver directory 를 추가합시다.```System.setProperty("webdriver.chrome.driver", FileMap.preFilePath + "/Recoeve/webdriver/chromedriver.exe");curChromeOptions.setBinary(FileMap.preFilePath + "/Recoeve/webdriver..

# React 를 배워보자. (Learning React) with TypeScript and esbuild bundling## PH2024-08-28 : First posting.## TOC## Initiate React AppBundler 로는 Tree shaking 과 multi threading 을 지원해서 가장 빠르고 좋다는 esbuild 를 사용합시다. ```mkdir hello_reactcd hello_reactnpm init react-app .npm run startnpm install --save-exact --save-dev esbuildnpm audit fix --force// audit 뜻 : 1.감사 2.단속 3.청강 4.세무조사npm install --save-dev @babe..

# week6 위클리 페이퍼 (웹 페이지 렌더링 방식 CSR, SSR, SSG 각각의 특징과 각 방식을 어떤 상황에 사용하면 좋을지 설명)## PH2024-09-03 : First posting.## TOC## 웹 페이지 렌더링 방식 CSR, SSR, SSG 각각의 특징과 각 방식을 어떤 상황에 사용하면 좋을지 설명웹 페이지 렌더링 방식에는 CSR (Client-Side Rendering), SSR (Server-Side Rendering), SSG (Static Site Generation) 세 가지가 있습니다. 각 방식의 특징과 사용 상황을 설명드릴게요.### Client-Side Rendering (CSR)특징:브라우저에서 렌더링: 모든 JavaScript 파일을 클라이언트(브라우저)로 전송하고, ..

# week5 위클리 페이퍼 (useMemo, useCallback 에 대해 설명하고, 어떤 경우에 사용하면 좋을지, 남용할 경우 발생할 수 있는 문제점을 설명, 리액트 생명주기 (life cycle) 에 대해 설명, React 에서 배열을 렌더링할 때 key 를 설정해야 하는 이유와 key 설정 시 주의할 점을 설명)## PH2024-09-02 : First posting.## TOC## useMemo, useCallback 에 대해 설명하고, 어떤 경우에 사용하면 좋을지, 남용할 경우 발생할 수 있는 문제점을 설명useMemo 와 useCallback 는 React 에서 성능 최적화를 위해 사용되는 훅입니다. 각각의 역할과 사용법, 그리고 남용 시 발생할 수 있는 문제점을 설명드릴게요.### useM..

# JavaScript 중급 서술형 평가 (자바스크립트에서 this 키워드의 사용과 그 특성에 대해 설명, 렉시컬 스코프(Lexical Scope)의 개념과 그 특성에 대해 설명, 브라우저가 어떻게 동작하는지 설명, 이벤트 버블링과 캡처링을 설명하고 이를 방지하기 위한 방법을 서술, 프로미스(Promise)의 3가지 상태에 대해 설명)## PH2024-08-31 : First posting.## TOC## 자바스크립트에서 this 키워드의 사용과 그 특성에 대해 설명자바스크립트에서 this 키워드는 실행 컨텍스트에 따라 그 값이 결정되며, 현재 실행중인 함수 또는 메소드의 "소유자"를 가리킵니다.전역 실행 컨텍스트에서 this 는 전역 객체 (브라우저에서는 window, Node.js 에서는 global..

# 마지막이 ```/ 로 끝나면 error 나는거 해결합시다.어랏 에러가 안나네. 뭐가 바뀐거지? =ㅂ=;;;## PH2024-08-30 : First posting.## TOC## Codes printed```[.scrollable.lang-js]window.m = window.k = {}; // window.m can be asigned another JSON or number/string and so on. But window.k must be kept.(function (m, $, undefined) {m.version0 = "2.12";m.getUTF8Length = function (s) { let len = 0; for (let i = 0; i = 0xd800 && code arr[sort..

# 인터넷, Web, HTML, 블로그에서 수식 사용하기 (Equation or math in HTML, blog)블로그에 물리/수학 관련 이야기를 쓰면서 수식 쓸 일이 많았는데, 해결 방법을 찾았다. 아래아한글 (hwp), MS-word도 수식입력기를 지원하지만, 복사와 편집이 쉬운 plain text 형태의 LaTeX 수식이 갑인듯 하다. 입력 방법에는 대략 아래와 같은 방법들이 있다. 각자 편할데로 골라잡자.윈도우에서는 (Windows 7부터인가?) 손글씨로 입력한 수식도 인식하고 디지털화 해주는 수식입력기 (Math Panel Input) 도 기본 프로그램으로 제공한다. 이런 프로그램은 대체 어떻게 짠건지... 후덜덜;; Tablet PC가 대중화되면서 많은 사람들이 이용하기 시작할듯? 손으로 쓸..