[Node] NPM 기초
·
Node
NPM 이란? - Node Package Manager - 명렁어로 자바스크립트 라이브러리를 설치, 관리할 수 있는 패키지 매니저 - 패키지 = 라이브러리 = 모듈 = 프로그램이 사용하는 기능 같은 것 [ 장점 ] 프로젝트에서 필요한 라이브러리를 쉽게 다운받을 수 있음 프로젝트에서 사용하는 많은 라이브러리의 버전과 의존성 관리가 용이 필요한 라이브러리를 CDN 보다 편하게, npm 명령어를 통해 프로젝트 로컬 환경 및 전역 환경에 쉽게 설치, 관리할 수 있음 빌드하는 명령어를 자동화하여 프로젝트를 관리할 수 있음
[JavaScript] JavaScript의 모듈들
·
JavaScript
1. 모듈(Module)이란? - 개발하는 애플리케이션의 규모가 커지면 파일을 여러 개로 분리하는 것이 좋음 - 이 때 분리된 하나의 파일을 모듈이라고 부름 - 모듈을 대개 클래스 하나 혹은 특정한 목적을 가진 여러 개의 함수를 포함하는 라이브러리로 구성되어 있음 [ 장점 ] 유지보수 용이 기능들이 모듈화가 잘 되어 있는 경우, 의존성을 줄일 수 있기 때문에 기능의 개선이나 수정이 용이 네임스페이스화 코드의 양이 많아질수록 전역 스코프에는 존재하는 변수명이 겹치는 경우가 존재 -> 이때 모듈로 분리하면 모듈만의 네임스페이스를 따로 가지기 때문에 해당 문제를 해결할 수 있음 재사용성 같은 코드를 반복하지 않고 모듈로 분리시켜서 필요할 때마다 재활용 가능 2. 모듈 시스템 - 모듈을 필요시에 불러오는 방법 ..
[JavaScript] JavaScript의 API들
·
JavaScript
2.1 자바스크립트 유용한 Array APIs 1) map ( ) 배열 내의 모든 요소에 대해 주어진 함수를 호출한 결과를 모아서 새로운 배열을 반환 const numbers = [1, 2, 3, 4, 5, 6, 7]; const result = numbers.map((number) => number * 2); console.log(result); // [2, 4, 6, 8, 10, 12, 14] 2) some ( ) 배열 안의 한 요소라도 주어진 판별 함수를 통과하는지 테스트 const animals = ["강아지", "고양이", "토끼", "병아리", "호랑이", "말"]; const result = animals.some((animals) => animals === "강아지"); console.lo..
[JavaScript] IT 용어들 (API, 동기, 비동기, 프론트엔드, 백엔드)
·
JavaScript
1. IT 용어 이해 1.1 API란 무엇인가? - Application Programming Interface - 응용 프로그램에서 사용할 수 있도록, 운영 체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스 - User Interface, 즉 사용자와 프로그램과 소통하기 위한 접점 1.2 동기와 비동기란? - 동기 : 답변을 기다리는 것 - 비동기 : 답변을 기다리지 않는 것 1.3 프론트엔드 & 백엔드란? 프론트엔드 : 사용자가 마주 보는 인터페이스로, 주로 웹 및 모바일의 사용자 인터페이스 (UI) / 사용자 경험 (UX)를 개발하는 데에 초점 - 언어 : HTML, CSS, JavaScript - 테크놀로지 : AngularJS, ReactJS, Bootstrap 백엔드 :..
[JavaScript] JavaScript 입문
·
JavaScript
0. 자바스크립트 입문 강좌 0.1 DOM이란? - Document Object Model - 웹 문서를 제어하기 위해 웹 문서를 객체화 한 것 - 웹 문서, 즉 HTML을 객체화 함으로써 문서를 제어할 수 있음 0.2 BOM이란? - Browser Object Model - 웹 브라우저를 제어하기 위해 브라우저를 객체화 한 것 0.3 script 태그 defer, async - HTML에서 자바스크립트 파일을 사용할 때, 태그로 자바스크립트 파일을 불러옴 - 브라우저에서는 HTML 파일의 위부터 아래로 순차적으로 파싱 -> HTML이 파싱 되기도 전에 DOM 요소에 접근하려고 할 때, DOM 요소에 접근하려고 했기 때문에 발생한 문제 생성되지 않은 객체에 대한 문제 발생 [ 해결방법 1 ] body 태..