본문 바로가기

Language7

Three.js 개념 및 기본 사용법 정리 Three.js WebGL 기술을 사용하여 3D 랜더링 할 수 있는 라이브러리입니다. 개발 환경 구성 VS Code 에디터 사용 NVM으로 Node.js LTS 설치 Vite 빌드 도구 NVM 설치 가이드 링크 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.4/install.sh | bash nvm ls : 설치된 node.js 버전 보임 nvm ls-remote : node.js 버전 출력 nvm ls-remote --lts : (LTS만 보기) nvm install v16.13.2 (LTS 받기) nvm use v16.13.2 (쓰고싶은 버전) node -v : 버전 확인 sudo apt-get install sl (기차 나옴) Vite 프.. 2023. 8. 13.
타입스크립트 학습 정리 학습하기 위해서 정리하는 것이기 때문에 빈 개념들이 있을 수 있습니다. 타입 적용 방법 타입 종류 - number, string, unknown, any, [], {}, interface 등 / 클래스의 타입(ex. blob, file, htmlElement, 등) 타입 추론 - 파라미터 기본값 설정, 변수 초기화, 함수 반환 값 타입 단언 - as, ! (Non-null) / 단언이 잘못 되면 에러 발생 타입 가드 - 조건문을 통해서 값이 null, undefined, 등이 나오지 않도록 처리 / typeof, instanceof 등 사용 인터페이스 호출 시그니처 interface getCount { (items: string[]): number } 화살표 함수 사용 interface IUser { n.. 2023. 7. 26.
자바스크립트 기본 지식 정리 면접을 준비 및 학습을 위해 부족한 용어 및 개념을 정리하는 것입니다. 비어있는 개념이 있을 수 있습니다. 원시타입 - String, Number, Boolean, null, undefined 참조타입 - Array, Object, Function true - 1, true false - 0, null, undefined, "", NaN, 0a, [].length 부정연산자 - !true, !!false, !{}, !undefined 논리연산자 - &&: and, ||: or 삼항연산자 - 조건문 ? true일 때 값 : false 일 때 값 Nullish 병합 - 변수 ?? 2 : 변수가 0이면 0 반환, 0이 아니면 2 반환 전개연산자 - {...obj} 구조 분해 할당 - const {a, b, ... 2023. 7. 26.
자바스크립트 화살표 함수 정리 함수 선언식 - 함수 호이스팅 발생, arguments 존재 (파이썬의 *args와 비슷) function main() { console.log("working") console.log(arguments[1]) // 3 } main(2, 3, 4) 함수 표현식 - 익명 함수를 만드는 경우에 사용. 함수 호이스팅 x const main = function() { console.log("working") } 화살표 함수 - 익명 함수를 변수에 할당하는 위의 함수 표현식과 동일, arguments 존재 x const main = () => { console.log("working") } // ...을 사용해서 가변인자를 받음 const main = (...args) => { console.log(args[1].. 2023. 7. 21.
자바스크립트의 this 이해하기 어떻게 함수가 호출되느냐에 따라서 this의 의미가 달라진다. 단순히 호출하는 것 말고도 JS의 함수는 일급 객체로, 변수에 함수를 저장하거나, 함수의 인자로 전달하거나, 함수의 반환값으로도 사용 가능하다. 이처럼 동적으로 this가 호출되는 방식에 따라서 가리키는 의미가 달라지는 것을 바인딩 된다고 표현합니다. 실행 컨텍스트 안에 디스 바인딩 컴포넌트에 정보가 담기게 된다. This Biding Rules 기본 바인딩 암시적 바인딩 new 바인딩 명시적 바인딩 기본 바인딩 console.log(this) // 2023. 7. 17.
텍스트 에디터 프레임워크 tiptap 선택 및 공부 https://areknawo.com/top-js-rich-text-editor-frameworks-for-2021/ Top JS rich text editor frameworks for 2021 Rich content editors are everywhere - from comment sections to document editors. ✍ Let's explore the best tooling to make them! 🚀 #webdev #javascript #typescript #FrontEnd #React #VueJS areknawo.com 한 프로젝트를 진행함에 있어서 텍스트 에디터가 필수가 되었다. 그래서 조사를 하다가 좋은 글을 발견하고.. 참고하여 다여러 선택지 중에서 tiptap을 선택하게.. 2022. 9. 1.