console.log(score);var score;위 코드를 실행시킨 결과는 어떻게 될까요?1. 참조 에러(ReferenceError)2. undefined 정답은 2번입니다. 이유는 변수 선언의 실행 시점에 연관이 있습니다. 자바스크립트 코드는 기본적으로 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 console.log(score);가 가장 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행합니다. 하지만, 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점, 즉 런타임(runtime)이 아니라 그 이전 단계에서 먼저 실행되기 때문에 참조에러가 아닌 undefined가 출력되는 것입니다.즉, 자바스크립트 엔진은 변수 선언이 소스코드 어디에 있든 상관없이 다른 코드보다 먼저 실행됩니다.⇒ 변..
Front-end
두 가지 용어파싱(Parsing)프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽음실행하기 위해 텍스트 문서의 문자열을 토큰(token)으로 분해토큰에 문법적 의미와 구조를 반영하여 트리 구조와 자료 구조인 파스 트리(parse tree)를 생성하는 과정 렌더링(Rendering)HTML, CSS, Javascript로 작성된 문서를 파싱하여 브라우저에 시작적으로 출력하는 것을 말한다.브라우저 렌더링 과정 순서1. 브라우저는 HTML, CSS, 자바스크립트, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버로부터 응답을 받는다.2. 브라우저의 렌더링 엔진은 서버로부터 응답된 HTML과 CSS를 파싱하여 DOM과 CSSOM을 생성하고 이들을 결합하여 렌더 트리를 생성한다.3. 브라우저의 ..
사용 이유 서합 이후 프론트엔드 과제를 하면서 임시 json 데이터를 불러오기 위해 API를 만들어야했다. 서버에 연결해서 하는 방법도 있지만 현재는 임시 json 데이터를 두는 거라고 생각하였기 때문에 라이브러리 중 json-server를 활용하게 되었다. 기본 설정 asset/db에 data.json이라는 파일을 만들고 { "numbers": [ { "id": 1, "number": 1 }, { "id": 2, "number": 2 }, { "id": 3, "number": 3 }, { "id": 4, "number": 4 } ] } json형태의 데이터를 넣어둔다. 라이브러리 설치 npm install -g json-server sudo npm install -g json-server 설정 json..
대체적으로 Frontend Engineer의 직무 필요 역량에도 기재되어 있듯이 개발하면서 UX, UI 디자인이 많이 언급된다. 그리고 취준 하면서 여러 공고를 보다보니 UX Engineer라는 직종을 보게 되었다. UI, UX의 차이점을 정리하게 되었고, 다른 분들도 함께 궁금증을 해소할 수 있도록 포스팅하게 되었다. 📄 UX 디자인과 UI 디자인의 설명 UI design (User Interface Design : 사용자 인터페이스 디자인) 웹 사이트나 앱과 같은 디지털 화면의 시각적인 요소와 레이아웃을 만드는데 중점을 둔 디자인이다. 색상, 타이포그래피, 아이콘, 버튼 및 기타 그래픽 요소를 선택하여 미적으로 쾌적하고 사용자 친화적인 인터페이스를 만든다. 예시 : 거실 인테리어할 때 전체적으로 톤을..