로맨테크

노션에선 @(골뱅이)이나 /Link 단축키를 입력하여 기존에 작성했던 노션 페이지를 바로 링크할 수 있다. 예전에 작성해둔 노션 페이지의 제목이 정확히 기억나지 않아도 키워드만 입력하면 연관 페이지들이 뜨기 때문에 편리하다. 노션을 사용하면서 가장 마음에 드는 기능 중 하나다. 오늘은 노션의 링크 삽입과 관련한 소소한 팁 3가지를 소개하고자 한다. 💡 팁 1. @ 단축키로 노션 페이지 링크 걸기 일반적인 서비스에서 @(골뱅이, at)는 보통 특정 사람을 호출할 때 사용한다. 하지만 노션에선 사람은 물론 날짜(Date), 노션 페이지(Page)까지 링크할 수 있다. ❶@ 입력 후 ❷링크하고 싶은 페이지 제목/키워드를 입력하면 연관 페이지들이 나타난다. ❸위/아래 방향키로 원하는 페이지를 선택한 뒤 ❹엔터(..

시중엔 PC에서 안드로이드 스마트폰을 제어할 수 있는 수많은 툴이 있다. Scrcpy 같은 오픈소스 프로그램을 이용해 윈도우나 맥에서 안드로이드 기기를 제어할 수도 있다. 이렇게 안드로이드를 원격 제어할 수 있는 다양한 방법이 있지만 아쉽게도 아이폰(iOS)을 제어할 수 있는 툴은 딱히 없었다. 있다고 해도 아이폰을 탈옥해야 하는 조건이 붙는다. 하지만 최근 우연히 발견한 Wormhole이라는 프로그램을 이용하면 윈도우 PC나 Mac에서 아이폰을 제어할 수 있다. 아마 탈옥하지 않고 아이폰을 원격 제어할 수 있는 유일무이한 툴이 아닐까 싶다. 아래는 Wormhole 개발사 공식 홈페이지에 올라온 구동 영상이다. 영상 중간중간 중국어가 보이는 걸 보니 중국 개발사가 만든 것으로 보인다. Windows/Ma..

노션에서 작성한 모든 페이지는 공개 링크를 만들어 다른 사람에게 공유하거나 검색 엔진에 노출시킬 수 있다. 노션에 가입하지 않아도 누구나 방문할 수 있다는 말이다. 언제가 될진 모르겠지만 노션도 '커스텀 도메인' 기능을 지원할 예정이라고 했었다. 그럼 자신이 보유한 도메인을 노션 공개 페이지에 연동할 수 있기 때문에 콘텐츠 배포 공간으로 활용하기 더 좋아진다. 아쉽게도 도메인 연동 기능을 언제 지원할지는 아직 미지수다. 현재로선 모바일 앱 사용성 개선이 가장 시급해 보인다. 오늘은 자신이 보유하고 있는 도메인을 노션 페이지에 연동하는 방법을 소개하고자 한다. Cloudflare의 Web Worker를 활용하여 HTTP 요청을 수동으로 변경해주면 자신의 도메인으로도 Notion의 공개 페이지에 접속할 수 ..

노션의 숫자(Number) 속성 2개의 값을 Formula를 이용해 나누면 무한 순환하는 소수점으로 표시된다. 만약 숫자 1의 값이 11, 숫자 2의 값이 6이라 가정하고 Formula 속성에서 숫자 1/숫자 2로 나누면 1.833333333333으로 표시된다. Notion은 소수점을 반환할 수 있는 방법이 없기 때문에 원하는 소수점을 표시하려면 별도의 꼼수를 활용해야 한다. 엑셀과 비슷하게 노션에서도 Floor()라는 함수를 제공한다. 소수점을 모두 버리고 정수로 표시해주는 기능이다. 만약 Floor(2.8)을 입력하면 2로 표시된다. 이 Floor 함수를 활용하면 원하는 소수점으로 표시할 수 있다. 1.833333333333에 100을 곱하면 183.333333333이 된다. 여기에 Floor 함수를..

홍보 포스터, SNS 이미지 등을 제작할 때 어떤 폰트를 사용하냐에 따라 분위기가 확 달라진다. 전달하려는 메시지와 톤앤매너에 잘 맞는 폰트를 선정하는 건 그만큼 중요하다. 한글 폰트는 조금만 검색해보면 다양한 정보를 얻을 수 있지만 의외로 중국어 폰트 관련 정보는 별로 없다. 오늘은 중국 마케팅 등에 유용하게 쓸 수 있는 유료/무료 중국어 폰트를 소개하고자 한다. 1. 무게감 있는 중국어 폰트 📺 优设标题黑 (UISDC - 표제흑체) 폰트 이름: 优设标题黑 폰트 제작사: UISDC 폰트 키워드: 속도감, 무게감 라이선스: 무료, 상업적으로 사용 가능 글리프 개수: 7194 다운로드 : 링크 优设标题黑는 에너지를 발산하는 듯한 스타일의 폰트다. 중문 Simhei(黑体) 서체를 바탕으로 획에 굵기를 주고 ..

노션을 쓰다 보면 여러 개의 데이터베이스(Database) 내용을 병합해야 될 일이 생긴다. 보통 A 데이터베이스 내용을 복사하여 B 데이터베이스에 붙여 넣기 하는데, 이렇게 붙여 넣은 Name 속성 이름 앞엔 Copy of... 가 자동으로 따라붙는다. 이럴 경우 Name 속성 이름을 일일이 수정해야 하고 A, B 데이터베이스를 오가며 복사-붙여 넣기 하기도 번거롭다. 오늘은 여러 개의 데이터베이스 항목을 간단하게 병합하는 미립자 팁을 소개하고자 한다. 🔎 가정 [⏰공부], [🏙생활] 2개의 데이터베이스가 있고, [공부] 데이터베이스의 내용을 [생활] 데이터베이스로 병합(옮기기)한다고 가정해보자. 예시 템플릿은 아래 링크에서 Duplicate 하여 자유롭게 사용할 수 있다. 📌 데이터베이스 병합하기 템..

폼 필드(input) 스타일은 디바이스, OS, 브라우저에 따라 달라지므로 원하는 스타일을 지정하기 힘들다. 하지만 accent-color CSS 속성을 이용하면 폼 필드의 강조 색상을 손쉽게 변경할 수 있다.  accent-color 속성은 input 태그의 checkbox radio range 타입에 적용할 수 있다. CSS 셀렉터에 i..

디바운스는 input 이벤트에(리액트에선 onChange), 스로틀은 scroll 이벤트에 자주 사용된다. 디바운스는 아무리 많은 이벤트가 발생해도 마지막 이벤트만 실행하는 반면, 스로틀은 적어도 n 밀리초 마다 정기적으로 기능 실행을 보장하는 점이 가장 큰 차이점. 참고로 Lodash 라이브러리에 디바운스와 스로틀 메서드가 포함되어 있다.

각주 사용법21년 10월부터 Github서도 Markdown 각주를 지원한다. 사용 방법도 간단하다. 각주를 달고 싶은 문장에 대괄호를 열고 [^번호|제목] 형태로 입력하면 된다. ex) [^1] [^memo] 각주 제목은 영어만 지원하는 ..

TL;DR드래그할 수 있는 요소로 변경 — draggable={true}드래그 시작 — onDragStart 이벤트 트리거드래그하고 있는 요소의 인덱스 정보 저장 — state.draggedFrom드래그 상태 true로 변경 — state.isDragging이벤트 트리거 시점의 엘리먼트 리스트 저장 — state.originalOrder마우스 커서가 드롭 가능한 영역에 있을 때 — onDragOver 이벤트 트리거drop 이벤트를 사용할 수 있도록 dragOver 기본 이벤트 방지 — e.preventDefault()마우스 포인터 위치에 있는 요소의 인덱스 저장 — state.draggedTo엘리먼트 순서 변경 — state.updatedOrder 드래그중인 아이템을 마우..

프로그래머스 문제프로그래머스의 "부족한 금액 계산하기" 문제다. 아래 3개 파라미터를 받는다. price : 놀이기구의 이용료money : 고객이 가지고 있는 금액count : 고객이 해당 놀이기구를 이용한 횟수 놀이기구를 이용한 횟수가 늘어날 때마다 횟수 만큼의 이용료를 더 받는다. 놀이기구의 이용료 price 가 100원이라면 1번 이용할 땐 100원, 2번 이용할 땐 200원, 3번 이용할 땐 300원이 된다. 놀이기구를 count 번 탔을 때 money 금액에서 얼마나 모자라는지를 반환해야 된다. 금액이 모자라지 않으면 0을 반환한다. 반복문을 이용하면 아래처럼 쉽게 풀 수 있다.function solution(price, money, count) { let sum = ..

2진법을 사용하는 이유2진법은 0~1로 숫자를 표현하는 방법이다. 전기 신호로 작동하는 기계인 컴퓨터는 2진법을 기반으로 설계됐다. 전기적 신호로 의미를 전달할 수 있는 최소 단위는 ON OFF이다. 전기 신호가 있는 상태를 1, 없는 상태를 0으로 설정한다. 이렇게 단 2가지 상태만 2진수로 표현하는 것이 가장 간단하고 정확하기 때문이다. 2진수를 사용하면 0과 1로 단순하게 처리할 수 있어 속도가 빠르지만 작은 숫자도 매우 길어지는 단점이 있다. 더 많은 신호를 사용할 수도 있지만, 2개 이상의 신호를 사용하면 정확한 신호를 측정하는데 비용이 많이 들기 때문에 현재까지도 2진수를 사용하는 것. 각 진법의 특징2진수 : Binary Number | 二进制 (0~1로 숫자를 표현하는 ..