웹 브라우저 탭 메모장
2023. 4. 3. 18:03ㆍ개발/ETC
브라우저 탭을 빠르게 메모장으로 사용할 수 있는 방법을 소개합니다.
따로 메모장을 켜거나, 텍스트 에디터를 사용하기 번거로우실때,
웹 서핑을 하다가 간단한 메모를 해야할 때 사용해주세요.
아래의 코드를 브라우저 주소창에 복사 붙여넣기 하셔서 입력한 뒤 사용하시면 됩니다.
즐겨찾기나 북마크 등록해두시면 더욱 편하게 사용 가능합니다!
data:text/html, <script src = "https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.0/FileSaver.min.js" integrity="sha512-csNcFYJniKjJxRWRV1R7fvnXrycHP6qDR21mgz1ZP55xY5d+aHLfo9/FcGDQLfn2IfngbAHd8LdfsagcCqgTcQ==" crossorigin = "anonymous" referrerpolicy = "no-referrer"> </script> <body id="body_" onload="sizeSet()" style="font: 2rem/1.0 monospace;max-width:90rem;margin:0 auto;padding:3rem;"><div id="title" style="display: flex; flex-direction: row; justify-content: space-between;"><h2 style="display:inline-block">MEMO IN BROWSER</h2><button style="height: fit-content; position: relative; top: auto; margin: auto 0px;" readonly="readonly" id="save" onclick = "save()">SAVE</button></div><textarea id="content" placeholder="Insert Here" style="padding: 3%; font-size: 1.5rem; width: 100%; height: 500px; border:dotted 3px black; resize: none;"></textarea>
<script>
function save(){
let today = new Date();
let year = today.getFullYear();
let month = ('0' + (today.getMonth() + 1)).slice(-2);
let day = ('0' + today.getDate()).slice(-2);
var dateString = year +"_"+ month + '_' + day;
let content = document.getElementById("content").value;
if(content.trim()==''){
alert('Please Write a Memo');
}else{
content = dateString+`\n`+content;
var blob = new Blob([content], { type: "text/plain;charset=utf-8", });
saveAs(blob,dateString+"_memo.txt");
}
}
function sizeSet(){
let titleHeight = document.getElementById("title").clientHeight;
let bodyHeight = document.getElementById("body_").clientHeight;
let textHeight = bodyHeight-titleHeight;
textHeight = textHeight*0.8;
document.getElementById("content").style.height=textHeight+'px';
}
</script>
- 빈 내용이나 공백만 있을 경우 저장이 되지 않습니다.
- YYYY_MM_DD_memo.txt 로 저장됩니다.
- 저장 시 해당 브라우저 다운로드 경로에 내려 받습니다.
- 저장하지 않고 브라우저를 끄거나 새로고침하면 사라집니다.
기존의 Notepad bookmarklet 트위터 주소에 올라온 코드를 참고해서 브라우저에서 데스크탑으로 저장 가능한 형태로 수정했습니다!!
https://www.itworld.co.kr/news/87879
브라우저 탭을 메모장으로 활용하기
PC를 사용할 때 가장 빠르고 쉽게 메모를 할 수 있는 툴은 무엇일까? 메모장? 구글 킵(Google Keep)? 아니다. 바로 브라우저 자체를
www.itworld.co.kr
'개발 > ETC' 카테고리의 다른 글
| npm vs yarn (2) | 2023.04.14 |
|---|---|
| 맥북 M2, yarn 설치하기🔧 (🖥️terminal, 🍺Homebrew, npm) (0) | 2023.04.14 |
| git GUI 소스트리 (SourceTree) 설치 및 환경설정 - mac, GitHub, token 사용, git 프로젝트 설정 (0) | 2023.03.25 |
| 맥북 M2, git 설치하기 (🖥️terminal, 🍺Homebrew) (0) | 2023.03.24 |
| Git 개념과 구조 (0) | 2023.03.24 |