본문 바로가기
Deno 디노 Deno 디노 V8 JavaScript 엔진 및 Rust 프로그래밍 언어를 기반으로하는 JavaScript 및 TypeScript 용 런타임 Node.js의 최초 제작자 인 Ryan Dahl이 만들었으며 생산성에 중점을 둔다. Deno 특징 생산성과 안전한 스크립트 환경 제공이 목표 단일 실행 파일로 배포 브라우저 호환성 유닛 테스트, 린트, 포맷팅 등 개발 경험 향상을 위한 빌트인 툴 제공 HTTP 효율적 제공 Deno 단점 타입스크립트 컴파일러 병목현상 내부적으로 마이크로소프트사에서 제작한 TSC를 타입 체킹에 사용하고 있어 V8엔진과 비교할때 느린편이다. 아직은 부족한 플러그인 인터페이스 Node.js와 비교 Node JS Deno Engine V8 V8 Written in C++, Javascri.. 2020. 10. 1.
CSS 시스템 폰트 System font css OS 별 시스템 폰트 특정 운영 체제의 시스템 폰트를 기본값으로 설정하면 성능을 향상 시킬 수 있다. 맥 기본 시스템 폰트 OS 버전 시스템 폰트 Mac OS X El Capitan San Francisco Mac OS X Yosemite Helvetica Neue Mac OS X Mavericks Lucida Grande 윈도우 기본 시스템 폰트 Windows Vista Segoe UI Windows XP Tahoma Windows 3.1 to ME Microsoft Sans Serif 안드로이드 기본 시스템 폰트 Android Ice Cream Sandwich (4.0)+ Roboto Android Cupcake (1.5) to Honeycomb (3.2.6) Droid Sans 우분투 기본 시스템 .. 2020. 10. 1.
리액트 함수형 컴포넌트 리팩토링하기 state 컴포넌트내 상태관리 클래스형 컴포넌트 this.state = { isVisible: true, users: [], }; 함수형 컴포넌트 useState 훅 사용하기 const [isVisible, setIsVisible] = useState(true); const [users, setUsers] = useState([]); useCallback const toggleVisibility = () => { setIsVisible(!isVisible); } 이 메서드는 요소를 다시 렌더링 할 때마다 다시 생성되는 문제가 있다. useCallback 으로 감싸서 함수를 재사용, 캐싱할 수있다. const toggleVisibility = useCallback( () => setIsVisible(!is.. 2020. 9. 30.
리액트 컴포넌트 절대경로 import 리액트 컴포넌트 import 시 절대경로와 상대경로 사용하기 상대경로 import Button from './components/Tabs'; 상대경로 단점 상대경로 폴더가 깊어질때는 아래처럼 패스가 길어지게 된다. 😭 import Button from '../../../../components/Tabs'; 절대경로로 import 하기 config파일 내 baseUrl 을 추가하면 아래처럼 절대경로로 import할 수 있다. 설정 변경시 IDE를 재실행 시켜줘야 제대로 작동한다. tsconfig.json { "compilerOptions": { "baseUrl": "src" }, "include": ["src"] } import Button from 'components/Tabs'; 절대경로 사용시 훨씬 .. 2020. 9. 30.
javascript 연산자 Javascript Operator 자바스크립트 연산자 주요 기본식과 좌변식 의미 기본식 자바스크립트 일반식 및 기본 키워드 this 실행 문맥의 특별한 속성 function 함수 정의 class 클래스 정의 function 생성기 generator 함수 식 정의 yield 생성기 함수 일시정지 및 재개 yield* 다른 생성기 함수 또는 순회가능 객체로 위임 async function 비동기 함수 표현식 정의 await 비동기 함수를 일시 중지했다가 다시 시작하고 promise의 resolution/rejection을 ​​기다림 [] 배열 초기자 및 리터럴 구문 {} 객체 초기자 및 리터럴 구문 /ab+c/i 정규식 리터럴 구문 ( ) 그룹 연산자. 좌변식 좌변값은 할당 대상을 의미 Property a.. 2020. 9. 29.
canvas tutorial 1 Canvas API Javascript, HTML 엘리먼트를 통해 그래픽을 그릴 수 있다. 애니메이션, 게임 그래픽, 데이터 시각화, 사진 조작 및 실시간 비디오 처리를 위해 사용된다. Canvas API는 주로 2D 그래픽에 중점을 두고 있습니다. WebGL API 또한 엘리먼트를 사용하며, 하드웨어 가속 2D 및 3D 그래픽을 그린다. html JS const canvas = document.getElementById('canvas'); HTML 엘리먼트에 대한 참조를 얻는다. const ctx = canvas.getContext('2d'); 엘리먼트의 컨텍스트(렌더링될 그리기의 대상)를 얻는다. 실제 그리기 getContext('2d') 메서드를 이용해 그린다. ctx.fillStyle = 'gre.. 2020. 9. 26.

이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

티스토리툴바