profile
UI 마크업 개발자 장지훈입니다.
post-thumbnail

M1 맥북 NVM 설치 안내

윈도우 환경에서 Node.js 설치는 https;//nodejs.org 접속 후 필요한 버전을 찾아 다운로드 설치를 진행하는 방식으로 그 방법이 간단하지만, Mac 환경에서는 유닉스 기반으로 만든 OS로 개발환경 설치를 터미널과 터미널 명령어로 설치해야 하는

2022년 6월 19일
·
0개의 댓글
post-thumbnail

프로퍼티 어트리뷰트

자바스크립트 엔진은 프로퍼티를 생성할 때, 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동 정의한다. 프로퍼티의 상태란 프로퍼티의 값(value), 값의 갱신 가능 여부(writable), 열거 가능 여부(enumerable), 재정의 가능 여부(con

2022년 4월 19일
·
0개의 댓글
post-thumbnail

Vue 개발 환경 설정

크롬 브라우저에서 F12 키를 누르면 개발자 도구 실행이 된다. Vue로 개발된 페이지에 접속된 경우 개발자 도구 상단에 "Vue"라는 탭 메뉴가 추가된 것을 확인 할 수 있다.

2022년 4월 11일
·
0개의 댓글
post-thumbnail

웹팩 데브 서버

변경된 코드를 브라우저에서 확인이 필요할때 $ npm run build 통한 번들링 작업없이도 수정즉시 브라우저 새로고침되어 확인 가능함.

2022년 4월 9일
·
0개의 댓글
post-thumbnail

웹팩 주요 속성 4가지

entry, output, loader, plugin에 대한 웹팩의 주요 4가지 속성을 이해하고 넘어가기

2022년 4월 4일
·
0개의 댓글
post-thumbnail

바벨(babel) 실습

바벨은 주로 ECMAScript 2015+ 코드를 현재 및 과거의 브라우저와 같은 환경에서 호환되는 버전으로 변환하는데 주로 사용되는 도구이다.

2022년 4월 4일
·
0개의 댓글
post-thumbnail

웹팩 소개 및 설치

최신 프론트엔드에서 가장 많이 사용하는 모듈 번들러(Module Bundler)로 웹 애플리케이션을 구성하는 자원(HTML, CSS, Javascript, Images 등) 모두 각각의 모듈로 보고 이를 종합해서 병합된 하나의 결과물로 만드는 도구이다.웹팩에서 모듈은

2022년 4월 3일
·
0개의 댓글
post-thumbnail

NPM 설치 및 설정

NPM(Node Package Manager)은 Node.js를 설치하면 자동으로 설치가 된다. NPM은 명령어로 자바스크립트 라이브러리를 설치하고 관리할 수 있는 패키지 매니저로, 전 세계 자바스크립트 개발자들이 모두 자바스크립트 라이브러리를 공개된 저장소에 올려놓고

2022년 4월 1일
·
0개의 댓글
post-thumbnail

ESM(모듈) import & export

애플리케이션을 구성하는 개벌적인 요소로서 재사용 가능한 코드 조각을 말한다.모듈(module)은 자신만의 파일 스코프(모듈 스코프) 를 가진다.import와 export를 사용하여 선택적으로 모듈 자산을 재사용 할 수 있다.ES6 Moule를 ESM이라 한다.scrip

2022년 4월 1일
·
0개의 댓글
post-thumbnail

데이터타입, data types, let vs var, hoisting

변수(variable) = 변경될 수 있는 값 의미함변수를 선언시 var, let, const 키워드를 사용. 하지만 var는 ES6 이후 권장하지 않음.const는 단 한 번만 할당 가능한 변수로 재선언, 재할당 모두 불가능 상수(constant)라 한다.변수의 이름

2022년 3월 28일
·
0개의 댓글
post-thumbnail

구글 스프레드시트 실시간 연동(웹 크롤링 for JSON)

velog에서 REST방식에 Open API를 제공하지 않아, 글 목록 외부로 가져올 수 있는 방법이 없다. JSON 파일로 목록을 만들어 놓고 내부에서 처리할 수도 있지만, 상시 업데이트가 되는 부분이라 유지/보수 측면에서 JSON 파일을 직접 수정하는 방식은 적합하

2022년 3월 24일
·
0개의 댓글
post-thumbnail

JSON

HTTP (Hypertext Transfer Protocol)브라우저 위에서 동작하고있는 웹사이트나 웹어플리케이션과 같은 클라이언트들이 어떻게 서버와 통신할수 있는지 정의한 것HyperText를 주고 받을 수 있는지를 규약한 프로토콜중의 하나HyperText란?웹사이트

2022년 3월 19일
·
0개의 댓글
post-thumbnail

나머지 매개변수 & 전개 연산자

나머지 매개변수는 파라미터 이름 앞에 ...기호를 더해 임의의 매개변수를 정의하는 것으로 나머지 전달인자를 하나의 배열로 반환한다.반환 값이 배열이기 때문에 sort, map, forEach와 같은 메소드를 사용해 편리하게 데이터를 사용할 수 있다.함수의 매개변수를 r

2022년 3월 16일
·
0개의 댓글
post-thumbnail

깊은 복사(deep copy)

JavaScript는 원시 타입과 참조 타입이라는 두가지 자료형을 제공하며 Object를 제외한 모든것들은 Primitive한 성격을 갖고 있다.Primitive Type : 데이터의 실제 값Reference Type : 데이터의 주소 값자세한 내용 클릭깊은 복사(De

2022년 3월 15일
·
0개의 댓글
post-thumbnail

배열 함수들 Array APIs

배열 원소를 연결하여 하나의 문자열로 반환각 구분값을 추가할 수 있으며, 구분값이 없는 경우 쉼표(,)로 표기됨문자열을 일정한 구분자로 잘라서 배열로 저장'limit\` 입력되면 그 이하로 배열 저장됨배열의 원소의 순서를 반대로 만드는 메서드순서가 바뀐 배열을 새로 만

2022년 3월 13일
·
0개의 댓글
post-thumbnail

배열 개념과 APIs

배열을 만드는 방법은 new Array()와 \[] 이렇게 두 가지 방식이 있다.대괄호 \[] 를 이용해서 데이터에 접근할 수 있다.\[] 숫자인덱스를 전달하게 되면, 그 인덱스에 해당하는 value들을 받을 수 있다.배열은 index가 0부터 시작하기 때문에, 총길이

2022년 3월 10일
·
0개의 댓글
post-thumbnail

Object

Javascript type의 일종관련 있는 데이터나 함수의 묶음Object는 key, value로 구성된 프로퍼티(Property) 집합체 이다.Object = property+methodproperty : 데이터를 의미method : 데이터를 참조하고 조작할 수 있

2022년 3월 10일
·
0개의 댓글
post-thumbnail

Class 객체지향언어

클래스는 모양이 정해진 틀과 같다. 붕어빵 틀 혹은 청사진이라고도 부를 수 있다.데이터가 들어가 있지 않고 한번만 선언된다.메모리에 올라가지 않는다.붕어빵 틀로 만든 붕어빵클래스에 데이터를 넣어서 만든 것이 객체클래스를 이용해서 많은 객체를 만들 수 있음붕어빵 클래스에

2022년 3월 3일
·
0개의 댓글
post-thumbnail

Functions 함수

프로그램을 구성하는 매우 기본적인 빌딩 블럭 - sub-program 이라고도 불린다. - 여러번 재사용이 가능하다. - 한가지의 업무나, 값을 계산할 때 사용된다.

2022년 2월 22일
·
0개의 댓글
post-thumbnail

preventDefault()

기본(default)를 막다(prevent) 라는 단어에서 유추 할수 있듯이 html에서 표준으로 제공하는 태그의 기본 이벤트 발생을 막는 메서드입니다. 예를 들어 앵커태그 <a> <submit> <button> 태그는 각각 페이지 이동이나 form 데이터 전송 등의

2022년 2월 22일
·
0개의 댓글