Jake의 블로그

# 새 브라우저 창에서 외부 사이트 열기 # Web 기반 개발을 진행하다 보면, 외부 사이트를 새 브라우저 창에서 띄우는 기능이 필요한 경우가 있습니다. 이 경우, 아래와 같은 방법으로 처리할 수 있습니다 // 화면 사이즈 가져오기 const height = window?.screen?.height; const width = window?.screen?.width; const url = "https://enfp-jake.tistory.com"; // 외부 브라우저 열기 window.open(url, "_blank", `height=${height}, width=${width}`);

# 터미널에서 인증서 목록 조회하기 - 맥에서 IOS 또는 Mac용 소프트웨어를 개발하는 경우, 출시 시점에서 인증서에 대한 처리가 필요합니다. 이 경우 Keychain 앱을 실행해서 확인할 수도 있지만, 터미널에서 아래의 명령으로 바로 조회할 수 있습니다. security find-identity ​

# Apple 앱 암호 만드는 방법 OSX에서 동작하는 앱을 만들어서 직접 배포하는 경우, Notarization이 필요합니다. 이 경우, Apple 계정과, 암호가 필요합니다. 보안 상 개인의 Apple 패스워드를 사용하는 것은 위험하므로 Apple에서 제공하는 앱 암호 기능을 사용하여야 합니다. 오늘은 이 앱 암호 생성 방법을 소개하려고 합니다 - 아래의 사이트에 접속하여, Apple 아이디로 로그인을 진행합니다 https://appleid.apple.com/ Apple ID Your Apple ID is the account you use for all Apple services appleid.apple.com - 로그인을 완료하면, 아래와 같은 메뉴들이 보입니다. 앱 암호 메뉴를 선택합니다. - ..

# 2022년 5월 마켓플레이스 무료 컨텐츠 ※ 언리얼 엔진에서 사용 가능한 컨텐츠입니다. 일정 기간 동안 할인율 100%로 제공하는 정기 이벤트입니다. 구입 후 언리얼 엔진 라이브러리에서 다운 및 이용이 가능합니다 # 다운로드 콘텐츠 검색 - UE 마켓플레이스 언리얼 엔진 마켓플레이스에서 9,000개 이상의 콘텐츠를 검색해 보세요. www.unrealengine.com # 무료 컨텐츠 구성

# Coolors로 나만의 팔레트를 만들어보자 - 서비스를 기획하거나 앱을 개발할 때 컬러를 정하는 일은 고민거리 중 하나입니다. 적당한 색을 몇 개 골랐는데 서로 어울리지 않는다거나, 몇 일 지나서 보니 마음에 들지 않는 경우도 있습니다. 본 포스팅에서는 이런 문제를 해결해 줄 Coolors라는 서비스를 소개하려고 합니다 # Coolors 사이트 Coolors - The super fast color palettes generator! Generate or browse beautiful color combinations for your designs. coolors.co # Coolors 사용방법 - Coolors에서 제공하는 다양한 기능이 있겠으나, 가장 애용하는 기능은 팔레트 생성 기능입니다. 사용..

# react-use-measure - 본 포스팅에서는 react-use-measure 라이브러리를 사용해서, component의 정보를 가져오는 방법을 소개합니다 # Github Page GitHub - pmndrs/react-use-measure: 🙌 Utility to measure view bounds 🙌 Utility to measure view bounds. Contribute to pmndrs/react-use-measure development by creating an account on GitHub. github.com # 사용방법 - 언제나처럼 설치를 진행해줍니다 yarn add react-use-measure - 측정하고 싶은 Element에 아래와 같이 구현해주고 bounds를 확..

# Public API 모음 - 1인 개발자 또는 소규모 개발 팀에서 개발을 하다보면, Public으로 제공되는 API는 시간과 자원을 아껴주는 고마운 존재입니다. 오늘 포스팅에서는 Public API들을 모아서 정리해 놓은 깃허브 사이트를 알려드리려고 합니다. 당장 사용할 일이 없다 하더라도 기억해 둔다면, 언젠가 요긴하게 쓰일 수 있을 것 같습니다. # 깃허브 페이지 GitHub - public-apis/public-apis: A collective list of free APIs A collective list of free APIs. Contribute to public-apis/public-apis development by creating an account on GitHub. github.c..

# react-resize-detector 를 활용한 리사이즈 이벤트 처리 - 와 같은 HTML Element의 사이즈가 바뀔 때 변경된 사이즈에 대해 대응할 필요가 있을 때가 있습니다. 본 포스팅에서는 react-resize-detector라는 라이브러리르 사용해서 HTML Element 크기 변경 이벤트를 처리하는 방법을 소개 하려고 합니다 # 사용방법 - 라이브러리를 설치해 줍니다 yarn add react-resize-detector - 아래와 같이 구현해 주시면 됩니다 import { useResizeDetector } from 'react-resize-detector'; const CustomComponent = () => { const { width, height, ref } = useRes..

# 2022년 4월 마켓플레이스 무료 컨텐츠 ※ 언리얼 엔진에서 사용 가능한 컨텐츠입니다. 일정 기간 동안 할인율 100%로 제공하는 정기 이벤트입니다. 구입 후 언리얼 엔진 라이브러리에서 다운 및 이용이 가능합니다 # 마켓플레이스 바로가기

# html2canvas를 활용한 스크린 캡쳐 - 본 포스팅에서는 html2canvas를 활용하여 원하는 HTML 요소들을 이미지로 만드는 방법을 소개합니다 # 라이브러리 사이트 html2canvas - Screenshots with JavaScript Try out html2canvas Test out html2canvas by rendering the viewport from the current page. Capture html2canvas.hertzen.com # 사용방법 - html2canvas를 설치해 줍니다 yarn add html2canvas - OnClick 등의 원하는 이벤트에서 다음과 같이 지정된 id의 요소를(아래의 경우 "save_element_id") 캡쳐합니다 html2canv..