본문 바로가기

전체 글

event.keyCode deprecated, then event.key, event.code 는 무슨값을 가질까? (키보드 (KeyBoard) event handler: compositionstart compositionupdate compositionend) # 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) 태그를 사용하면 좋은 점) # 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) # 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.. 더보기
노무현 대통령의 아름다운 그림자, 문재인 비서실장 # 노무현 대통령의 아름다운 그림자, 문재인 비서실장요새 좀 정치에 관심을 끊고 살았는데, 문재인씨 건드리면 내가 분신자살을 해서라도 본때를 보여주겠음. 사랑하고 존경하는 사람 2~3명 정도는 목숨걸고 지킬 수 있어야 하지 않겠냐? 개새들... 덤벼봐. 세무조사 나오고 별 지랄 다 떨어봐 다 받아줄께. -->예전에 보고 긁어놨었던 글을 다시 정리. 글쓴이 분은 블로그를 닫으신듯 함.개인적으로 이 글을 접하고 문재인씨 팬(?)이 된것도 있어서... 요새 힘드신거 같길래, 힘내시라는 의미(?)로 팬으로서 정리해 봄.## PH2015-12-14 : To SEE.2012-07-22 : Daum 에서 블로그 하던 시절 이 글을 긁어와 올렸던 날짜.## TOC##[.no-sec-N] 상념글쓰기 화면을 띄워놓고 한.. 더보기
지구 기후/기상 정보 (기온, 바람, 해류) 관련 - 바람/온도 지도, 강수량 지도 # 지구 기후/기상 정보 (기온, 바람, 해류) 관련 - 바람/온도 지도, 강수량 지도지구 기후/기상 정보를 그래픽적으로 잘 보여주는 사이트 가 있어서 정리중.폰에서 아래로 스크롤 할 때는 오른편에 넣어놓은 border 를 이용해 드래그 해주세요.## PH2023-06-15 : 안될과학 동영상 update.2022-07-07 : update.## TOC## 날씨와 기후의 정확한 차이점은 무엇일까?! [기후변화 1/2] (국가녹색기술연구소 오상진 박사)기상/날씨 vs 기후: 특정 시간, 특정 날짜의 온도/습도/강수량 등을 나타내는게 기상/날씨 이고 기후는 장기적으로 (30년 정도) 온도/기온/강수량의 평균을 내어 보는 것 안될과학 Unrealscience :: 날씨와 기후의 정확한 차이점은 무엇일까?! .. 더보기
Recoeve.net 퍼가는 법 (iframe) 및 reco 공유하는 법 # 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 튀는거 잡는 방법.) # 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 이 제대로 동작 안할 때 해결법 # 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.. 더보기
문재인(文在寅) vs 박근혜(朴槿惠) 프로필 비교 # 문재인(文在寅) vs 박근혜(朴槿惠) 프로필 비교2012년 대선 때 정리했던 두분의 프로필 입니다. html 정리해서 다시 올립니다.## PH2024-09-09 : Update 대통령직 및 연금, 파면 추가.2015-12-13 : To SEE. img tag with delayed-src.2014-12-08 : 박근혜 친인척 관련 재산 정리.2014-06-13 : docuK upgrade.2012-12-01 : First Posting.## TOC##[.no-sec-N#moonjaein] 문재인(文在寅) 프로필 1953 경남 거제 출생 (1953년 1월 24일) 1965 부산남항초등학교, 1968년 경남중학교, 1971년 경남고등학교 졸업 1973 경희대학교 법대 입학 (재수, 입학때 4년.. 더보기
React 를 배워보자. (Learning React) with TypeScript and esbuild bundling # 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 각각의 특징과 각 방식을 어떤 상황에 사용하면 좋을지 설명) # 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 설정 시 주의할 점을 설명) # week5 위클리 페이퍼 (useMemo, useCallback 에 대해 설명하고, 어떤 경우에 사용하면 좋을지, 남용할 경우 발생할 수 있는 문제점을 설명, 리액트 생명주기 (life cycle) 에 대해 설명, React 에서 배열을 렌더링할 때 key 를 설정해야 하는 이유와 key 설정 시 주의할 점을 설명)## PH2024-09-02 : First posting.## TOC## useMemo, useCallback 에 대해 설명하고, 어떤 경우에 사용하면 좋을지, 남용할 경우 발생할 수 있는 문제점을 설명useMemo 와 useCallback 는 React 에서 성능 최적화를 위해 사용되는 훅입니다. 각각의 역할과 사용법, 그리고 남용 시 발생할 수 있는 문제점을 설명드릴게요.### useM.. 더보기

티스토리툴바