const and let Arrow functions(화살표 함수) Template Literals(템플릿 리터럴) Default parameters(기본 매개 변수) Array and object destructing(배열 및 객체 비구조화) Import and export(가져오기 및 내보내기) Promises(프로미스) Rest parameter and Spread Operator(나머지 매개 변수 및 확산 연산자) Classes(클래스) Generator(생성자) Iterator(반복자) 템플릿 리터럴(Template literals) 복잡한 문자열을 쉽게 만들어주는 장치로 문자열 안에 문자열 및 변수를 넣을 수 있다. 기존 문자열 출력 시 변수와 함께 출력하려면 아래와 코드와 같이 따옴표(', ..

ES6(ECMAScript 2015)는 ECMAScript 표준의 최신 버전이다. ES6는 새로운 언어 기능이 포함된 주요 업데이트이며, 2009년에 표준화된 ES5 이후로 언어 기능에 대한 첫 업데이트이기도 하다. ES5 이하 명세에서 문제가 되었던 부분들이 해결되었고 많은 기능들이 추가되었다. 이는 가독성과 유지보수성 향상으로 이어졌다. React나 Vue 등의 라이브러리들도 이에 맞춰 개발 환경을 ES6로 바꾸게 되었고 이러한 이유로 인해 우리는 ES6에 주목하고 관심을 갖게 되었다. ES6는 아래의 새로운 기능들을 포함하고 있다. const and let Arrow functions(화살표 함수) Template Literals(템플릿 리터럴) Default parameters(기본 매개 변수) ..

호이스팅(Hoisting) 호이스팅이란 "끌어올린다"는 뜻으로 변수 및 함수 선언문이 스코프 내의 최상단으로 끌어 올려지는 현상을 말한다. 이는 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미한다. 호이스팅 시 var 키워드로 선언한 변수의 경우 undefined 값으로 변수를 초기화한다. console.log(num1); // undefined var num1 = 6; // 선언, 초기화 console.log(num1); // 6 컴파일러는 자바스크립트 엔진이 인터프리팅하기 전에 컴파일을 하는데, 이 때 var num1 = 6;을 2개의 구문으로 여긴다. var num1 num1 = 6 var num1은 변수 선언문으로, 컴파일을 할 때 처리하고 num1 = 6은 실행할 때..

Reset CSS, Normalize CSS는 브라우저마다 HTML 요소에 대한 기본 CSS값이 다르기 때문에 그 차이를 없애기 위해 필요하다(크로스 브라우징을 위해 사용). Reset.css 모든 브라우저의 내장 스타일을 '없애는' 기법이다. 아무 스타일도 없는 상태에서 스타일링을 시작하며, 공식적으로 권장하는 기법이라기보다 실무에서 편의에 의해 임의로 지정하는 설정이다. * { margin: 0; padding: 0; border: none; } 초기에 reset이라는 개념이 잡히기 전에는 *으로 초기화하는 방법을 많이 사용했으나 전역으로 사용되는만큼 불필요한 렌더링이 발생해 최근에는 많이 사용되지 않는다. Eric Mayer의 reset.css를 많이 이용한다. CSS Tools: Reset CSS..

마진 겹침 현상이란? 인접한 마진이 상쇄되는 현상을 말한다. 블록 요소에 한해서 좌우 방향은 적용되지 않고 오직 수직방향으로만 적용되며, 마진값이 0이더라도 상쇄 규칙은 적용된다. 또한 좌우 마진은 겹치더라도 상쇄되지 않는다. 이는 아래의 경우처럼 3가지 상황에서 발생한다. 1. 형제 박스요소 간에 상하 마진이 겹칠 때 div { background-color: tomato; width: 100px; height: 100px; } .d1 { margin-bottom: 60px; } .d2 { margin-top: 30px; } 위와 같을 때, 생각대로라면 d1과 d2에 각각 margin-bottom과 margin-top을 주었으니 전체 margin이 90px이 되어야 할 것같지만 그렇지 않다. 형제 블록..

개발자로 취업할 때까지. 엘리스 AI 트랙 4기 레이서 모집 엘리스 AI 트랙은 레이서 여러분이 스스로 학습하고 성장할 수 있도록 돕는 개발 학습과 취업 페이스메이커입니다. 6개월 후 스스로 성장하는 개발자로 거듭나고 싶은 예비 개발자라면, 엘리스 A elicetrack.oopy.io 지원 동기? 컴퓨터 공학을 전공했지만 학교에서는 따로 웹에 대해서 배우지 않았기 때문에 상대적으로 웹에 대해 공부한 기간이 짧았다. 코로나로 계속 집에 있다보니 공부도 잘 안되고 지원한 회사들은 다 떨어졌기 때문에 자신감이 많이 떨어졌었다. 지금 바로 취업하는 것도 좋지만 이왕이면 기초를 좀 더 다지고 들어가는 게 맞다고 생각했다. 독학으로 하면 느슨해질 것 같아 부트캠프, 국비지원 중에서 굉장히 많은 고민을 했다. 프론트..

https://leetcode.com/problems/keys-and-rooms/ Keys and Rooms - LeetCode Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com 문제 There are n rooms labeled from 0 to n - 1 and all the rooms are locked except for room 0. Your goal is to visit all the rooms. However, you cannot enter a locked room w..