본문 바로가기

전체 글290

Visual Studio Code import 문 정리 단축키 Visual Studio Code에서 javascript import 문에서 안 쓰는 정의 들을 깔끔하게 정리하는 단축키입니다. Windows: Alt + Shift + O Mac: Option + Shift + O 단축키를 사용하면 사용하지 않는 정의는 모두 지워지고, 가나다순으로 정렬됩니다. 단축키를 사용하기 전과 후의 결과 예시는 아래와 같습니다. 사용하기 전 import React, { useState, useEffect } from 'react' import { SafeAreaView, StyleSheet, View, Dimensions, Alert, Platform, Image } from 'react-native' import { Text, Icon, Button, colors } from .. 2022. 9. 14.
HTML svg에 색상 지정하기 HTML에서 svg에 색상을 지정하는 방법입니다. style="fill: blue;" 형태로 style어트리뷰트를 추가하면 됩니다. 2022. 8. 12.
JavaScript svg에서 DataURL 얻어오기 svg 태그에서 DataURL을 얻어오는 방법입니다. 예시 svg DataURL로 이미지를 표시할 img 태그 DataURL 가져오기 const s = new XMLSerializer().serializeToString(document.getElementById("svg")) const encodedData = window.btoa(s); const dataUrl = `data:image/svg+xml;base64,${encodedData}` document.getElementById('img').src = dataUrl 2022. 8. 11.
JavaScript 다크, 라이트모드 변경 이벤트 처리하기 사용자가 시스템의 화면모드를 라이트 혹은 다크 모드로 변경시 이에 따른 처리를 위해서 자바스크립트로 해당 이벤트를 받아서 처리하는 방법입니다. CSS 다크모드 처리 2가지 방식 다크모드를 처리하는 두 가지 방식에 대해서 설명드립니다. 일반적인 방법은 "@media"태크의 "prefers-color-schem"를 사용하는 방법이며, 또 다른 방법은 " "에 사용하는 파일로딩 방식입니다. 스크립트 ccusean.tistory.com Node.js Prefers-color-scheme 서버에서 처리하는 방법 서버사이드(Server side)에서 사용자의 Color scheme를 미리 알고, 처리할 수 있는 방법을 공유합니다. Mac, iPhone과 같은 경우 이미 오래전부터 "다크테마"라는 것을 제공하고 있습.. 2022. 7. 23.
CSS 다크모드 처리 2가지 방식 다크모드를 처리하는 두 가지 방식에 대해서 설명드립니다. 일반적인 방법은 "@media"태크의 "prefers-color-schem"를 사용하는 방법이며, 또 다른 방법은 ""에 사용하는 파일로딩 방식입니다. 스크립트 방식 시스템에 설정된 light, dark 모드에 따라서 스타일시트가 적용됩니다. 파일로딩 방식 로딩한 파일중에서 시스템에 설정된 모드에 따라서 적용됩니다. JavaScript 다크, 라이트모드 변경 이벤트 처리하기 사용자가 시스템의 화면모드를 라이트 혹은 다크 모드로 변경시 이에 따른 처리를 위해서 자바스크립트로 해당 이벤트를 받아서 처리하는 방법입니다. CSS 다크모드 처리 2가지 방식 다크모드를 ccusean.tistory.com Node.js Prefers-color-scheme 서.. 2022. 7. 23.
프로그래밍 언어 하나로 서버, PC 애플리케이션, Web, App 그리고 AI 모두 만들 수 있는 언어는? 프로그래밍 언어 하나로 서버, PC 애플리케이션, 웹페이지, 휴대폰 App 그리고 요즘 핫 한 AI까지 만들 수 있는 언어는 바로 "JavaScript" 입니다. JavaScript언어 문법을 안다면 아래와 같이 CPU, Memory, Display와 같은 환경이 구축된 환경에서 모든 애플리케이션 제작이 가능합니다. 더 큰 장점은 소스 코딩 한 번으로 Windows, Linux, Mac과 같은 여러 플랫폼에 적용이 된다는 것입니다. Web 개발 HTML, CSS와 함께 동적인 웹페이지를 개발할 수 있습니다. 서버 개발 한 소스로 Windows, Linux, Mac OS에서 구동 가능 Node.js: 서버뿐만 아니라 클라이언트 개발에 사용되며, 주요 라이브러리들이 Node.js에 있으며, 아래에 나열되는 .. 2022. 7. 22.
반응형

티스토리툴바