rockettttman

V8은 C++로 작성된 Google의 웹 브라우저를 만드는 데 기반을 제공하는 오픈 소스 자바스크립트 또는 웹 어셈블리(WebAssembly) 엔진이다. 구글 크롬 브라우저와 안드로이드 브라우저에 탑재되어 있고 Node.js 등에서 사용된다. ECMAScript(ECMA - 262) 3rd Edition 규격의 C++로 작성되었으며, 독립적으로 실행이 가능하다. 또한 C++로 작성된 응용 프로그램의 일부로 작동할 수 있다. V8은 컴퓨터가 실제로 이해할 수 있도록 JavaScript 코드를 기계어(CPU가 이해할 수 있는 언어로 숫자로만 구성된 순수 디지털 방식)로 직접 번역한 다음, 번역된 코드, 즉 컴파일된 코드를 실행한다. WebAssembly WebAssembly는 최신 웹 브라우저에서 실행할 수..

자바스크립트에서 객체를 상속하기 위하여 프로토타입이라는 방식을 사용하고 모든 객체는 자신의 부모(역할) 객체와 연결되어 있는데 이 부모 객체를 프로토타입(객체) 라고 한다. var foo = { name: 'foo', age: 30 } console.log(foo.toString()); //[object Object] foo 객체의 프로토타입에 toString() 메서드가 정의되어 있음. 크롬 브라우저에서는 __proto__프로퍼티 형태로 구현되어 있다. 프로토타입 수정하기 아래와 같이 프로토타입에 메소드를 추가하면 해당 생성자로 생성된 모든 객체에서 사용 가능하다. function Person(first, last, age, gender, interests) { this.first = first; th..

quasar framework를 사용하는 프로젝트 중 공통 이라는 공통 input 컴포넌트를 만들고 해당 input의 validate()이라는 함수를 사용하려고 했는데 계속 함수를 찾지 못하는 현상이 있었다. 자식 ref를 제대로 인식하지 못하여서 자식 함수에서 ref를 정의하여 defineExpose를 사용하여 부모 컴포넌트에서도 자식 컴포넌트에 접근하여 함수를 사용할 수 있도록 수정해주었다. DefineExpose

로그아웃 시 토큰도 삭제하고 로그인 페이지를 이동 시 함수 내에서 동작하기 위해 아래와 같이 사용해 주었다. to="/"를 안쓰면 에러가 나서 넣어주긴 했는데 to="#"와 같이 사용해도 된다. 로그아웃

router에서 404처리 시 아래와 같이 해주면 된다. const routes = [ { path: "/:pathMatch(.*)*", redirect: "/404", }, ....//route pages ]

em - font-size에 따라 크기가 달라짐 (기본 : font-size 16px) - px to em rem - font-size에 따라 크기가 달라지지 않음 - px to rem 아래는 em과 rem이 font-size가 16px일때와 30px일때 차이점이다. em rem

vue3 setup방식에서 component를 선언 시 회색 글씨가 뜨면서 'component is declared but its value is never read'와 같은 메세지가 출력될 때가 있다. 컴포넌트가 선언되었으나 사용되지 않았다는 내용인데 오류는 아니지만 소스가 길어지면서 보기 불편해서 해결 방법을 찾아보던 도중 기존에 vetur이 아닌 Volar라는 extension을 사용하라는 추천이 있어서 해당 extension으로 교체해 주었다. 참고: https://stackoverflow.com/questions/69504924/how-to-avoid-component-is-declared-but-its-value-is-never-read-when-i-use-vue

프로젝트 공통 컴포넌트를 만드는 방식 중 vue 3 setup - attr : 부모 컴포넌트에서 자식 컴포넌트로 속성들을 전달하기 위해 사용 - slot : 부모 컴포넌트 안에 자식 컴포넌트 삽입 --App.vue 버튼 --MyButton.vue 라벨 react - props: 부모 컴포넌트에서 자식 컴포넌트로 속성들을 전달하기 위해 사용 - children : 부모 컴포넌트 안에 자식 컴포넌트 삽입 --App.jsx import MyButton from './MyButton'; export default function App() { const onclick = () => { alert('!!!'); } return ( 버튼 ) } --MyButton.jsx export default function ..

구조화 구조화란 인터페이스나 클래스를 사용해 관련된 정보를 묶어 새로운 타입으로 표현하는 것을 말한다. 비구조화 구조화된 데이터는 데이터의 일부만 사용해야 할 때가 있는데 아래와 같이 구조화된 데이터를 분해하는 것을 비구조화라고 한다. 잔여 연산자/ 전개 연산자 ESNext 자바스크립트와 타입스크립트는 점을 연이어 3개 사용하는 ...연산자를 제공하는데 사용하는 위치에 따라 잔여 연산자 혹은 전개 연사자라고 부른다.

Mock mock(object)이란 실제의 데이터를 흉내낸 모조품 이라고 생각하면 된다. 우리는 이 Mock을 가지고 프로젝트 개발과 테스트를 더욱 더 원활하게 진행할 수 있다. Mock을 사용하는 이유 먼저 가장 이상적인 프로젝트 과정으론 기획 -> 백엔드 개발 -> 프론트 개발 이 순차적으로 완벽하게 수행되는게 가장 이상적이고 이대로 진행만 된다면 mocking을 할 필요도 없을 것이다. 하지만 프로젝트 투입 시 백엔드, 프론트 개발자들이 동시에 투입되고 프론트 개발자들은 레이아웃을 다 그리고 api연동을 하면서 몇몇 api들은 개발되기를 기다리는 적이 있을 것이다. 또한 이미 개발 완료되어 연동한 api 조차도 빈번히 수정이 일어나게 되는데 mock이 없다면 프론트엔드 개발자들은 언제 api가 완료..