본문 바로가기

[IT/Programming]/HTML related

React 사용 설정하기 (webpack) # React 사용 설정하기 (webpack) 우선 node.js 를 깔자. 그리고 프로젝트 폴더로 들어가서 (Terminal / Cmd) 에서 다음과 같은 명령어를 친다. ```[.linenums] npm init -y npm install webpack-cli --save-dev npm install webpack-dev-server babel-loader @babel/core @babel/preset-env @babel/preset-react html-webpack-plugin --save-dev npm install react react-dom jquery immer use-immer npm install style-loader css-loader terser-webpack-plugin --sav.. 더보기
HTML a href tag with onclick return # HTML a href tag with onclick return 가장 간단하게 HTML a (anchor/닻) tag 를 사용하는 방법은 ``` link or #hash text ```/ 와 같다. 그런데 간혹 이 링크를 다르게 처리하고 싶을때도 있다. (페이지 새로고침 없이 ajax 로 처리한다던지, pop-up 을 하고 싶다던지, stopPropagation 을 필요로 한다던지 등.) 이땐 다른 html element 들에서도 사용되는 onclick attribute 를 써주면 되는데, 아래와 같은 것들에는 주의가 필요하다고 한다. JavaScript recommendations It is often the case that an anchor tag is used with the onclick e.. 더보기
Email by JAVA (자바 프로그램을 이용해 이메일 보내기, com.sun.mail:jakarta.mail:2.0.1 :: 2021-04-06 에 update 가 끝나있는 오래된 library 임.) # Email by JAVA (자바 프로그램을 이용해 이메일 보내기, com.sun.mail:jakarta.mail:2.0.1 :: 2021-04-06 에 update 가 끝나있는 오래된 library 임.) 이메일 (Email) 을 프로그래밍적으로 보내고 싶은데 어떻게 해야할까? 개인적으로는 Recoeve.net 에 회원가입을 할 때, 계정 만들고 이메일 통해 인증/확인 하기 위한 용도로 이메일을 활용하려고 하는 중인데, 또 비밀번호를 잊어버렸다거나 했을때의 보완수단으로서 활용하려고... 이러려면 아무튼 프로그래밍적으로 이메일을 보낼 수 있어야 한다. 어떻게 하면 될까? ## TOC ## Gmail (지메일) by com.sun.mail:jakarta.mail:2.0.1 (2021-04-06) Gmai.. 더보기
event.keyCode deprecated, then event.key, event.code 는 무슨값을 가질까? # event.keyCode deprecated, then event.key, event.code 는 무슨값을 가질까? event.keyCode 로 단축키 설정하고 이것저것 했었는데 이미 몇년전에 deprecated 되었다네요. 에서 키보드가 눌렸을때의 각 값들을 잘 보여주고 있긴 한데, 한영키나 다른 나라 (중국, 일본 정도?) 키보드에서도 잘 동작하도록 하려면 테스트가 필요할거 같아서 본 글을 작성합니다. Korean, Japanese, Chinese typing handled. event.data on input, compositionstart, compositionupdate, compositionend. ## PH 2024-04-06 : First posting. ## TOC ## event.k.. 더보기
v.qq.com 동영상 퍼오기 # v.qq.com 동영상 퍼오기 동영상 주소: https://v.qq.com/x/cover/mzc00200cg24vid/y0048i7crfg.html iframe ```[.lang-html] ```/ 3분까지만 로딩되고 나머지는 페이지 방문해서 봐야 하는듯? 광고도 많고 ㅡ,.ㅡ;;; 유튜브보다 못한거 같은데, 중국이라서 국내기업 키워주느라 유튜브 막아놓고 이런 사이트 밀어주는듯. 더보기
.webp, .webm, .avif, .mp4 를 img tag, video tag 로 로딩 테스트 (Loading test) # .webp, .webm, .avif, .mp4 를 img tag, video tag 로 로딩 테스트 (Loading test) .webp, .webm 이 .gif 파일을 대체하는 중인데.. (둘 다 움짤 | 움직이는 짤림방지 사진 이지만 용량 차이가 어마어마하기 때문. .webp, .webm 이 더 압축을 잘함.) .webp 는 사진 크기를 25%로 더 줄여서 압축했음. .webm 은 사진 크기를 50%로 줄여서 압축했음. .webm 파일을 가져다가 크기변환없이 압축했음. .mp4: 9.01MB ## PH 2024-02-18 : First posting. ## TOC ## tag test .webp .webm .avif .mp4 ## tag test .webp .webm .avif .mp4 ## 결론.. 더보기
HTML 에서 동영상 연속 재생하기 (playlist, shuffle, replay) # HTML 에서 동영상 연속 재생하기 (playlist, shuffle, replay) 작성중인 글. 이것도 천천히 정리할듯;;; 여러 동영상을 한꺼번에 이어서 재생하거나 반복재생하고 싶어서 정리하는 중. 구현은 Recoeve.net (/user/kipid?cat=[Music/Break]--K-pop) 에 해놨으니 참조하시길. ## PH 2024-01-07 : start, end. ## TOC ## HTML tag HTML5 로 오면서 tag 도 생긴거 같긴한데... 이건 직접 서버를 운영하는 사람만 써먹을 수 있는듯? 동영상을 어딘가에 파일로 올려놔야 하니까;;; 파일 형태로 업로드하고 그냥 link 넣으면 될라나? 사용방법은 참조하시길. 그냥 대충 이런식으로 집어넣으면 됨. Media event 들.. 더보기
유튜브 리스트 (Youtube list) 로 퍼오는 법 # 유튜브 리스트 (Youtube list) 로 퍼오는 법 유튜브 영상 한개만 있는게 아니라, 리스트로 있는 영상들도 많은데, 이 때 동영상 하나만 퍼오는게 아니라 list 통째로 퍼오는 법을 알고 싶어서 정리하는 글. ## PH 2024-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=엄청긴_.. 더보기

티스토리툴바