프레임워크 /라이브러리 1. 프레임워크(Framework) 프레임워크 는 어떠한 앱을 만들기 위한 필요한 부분들을 가지고 있는 것 프레임워크에 라이브러리들이 포함이 되어 있다. 2. 라이브러리(Library) 라이브러리 어떠한 특정 기능을 모듈화해놓은 것.

자료구조 💡 Iterator 순서(인덱스)가 없는 데이터의 집합 전체를 순회해주는 for문과 같은 역할을 해서 전체 데이터를 출력 ( 사용 : Set, Collection ) 자료구조 이미지로 확인해보기 Data Structure Visualization www.cs.usfca.edu 1. 자료구조란? 자료구조(data structure) 데이터를 효율적으로 사용할 수 있도록 구조를 만들어서 저장해둔 것 1-1. 자료구조의 종류 리스트(list) : 배열 리스트(array list), 연결 리스트(linked list)로 세분됨 스택(stack) 큐(queue) 해쉬 테이블(hashtable) 집합(set) * 엄밀히 말하면 자료구조가 아님 자바에서 자료구조 - list ,map,set 특성에 맞게 자료..

깃허브에 저장된 탬플릿 가져와서 새로운 프로젝트 생성하기 깃에서 제공하는 명령어 git clone 은 프로젝트를 손쉽게 가져올 수 있지만, 이전 git 버전까지 함께 가져와진다는 문제가 있다. 때문에 이전 git 버전 기록 없이 다운로드 받아 사용하려면, 실제 깃헙주소에 들어가서 다운로드 버튼을 통해 zip 파일로 폴더를 다운 받아 사용해야하는데, Node.js의 npx degit 명령어를 사용하면 쉽게 CML로 설치 할 수 있다. npx : node.js 명령 degit: 원격저장소를 현제 위치에 다운로드 기능 npx degit 저장소 계정이름 / 저장소이름 다운로드 받을 폴더명 npx degit min-log/webpack-template-basic webpack-template-test

Webpack 프로젝트 생성 웹팩은 오픈소스 자바스크립트 모듈 번들러로 여러개로 나누어져 있는 파일들을 하나의 자바스크림트 코드로 압축하고 최적화하는 라이브러리 이다. 모듈단위로 개발이 가능하여 가독성과 유지보수가 쉽다. 1. Webpack 번들러 설치 npm i -D webpack webpack-cli webpack-dev-server@next 3개의 패키지 설치가 필요하다. webpack webpack-cli : 터미널에서 입력할 수 있는 기능 webpack-dev-server@next : 개발 할 때 수정사항 새로고침 기능 1-1 . scripts 부분 설정 "dev": "webpack-dev-server --mode development", "build" : "webpack --mode produ..

번들러(bundler) 개발시 SASS , vue , react ,svg ,... 등의 기능들을 이용해 작업을 하는데, 실제로 웹에서 동작하지는 않기 때문에 번들러를 통해 변환하는 과정으로 웹 (HTML / CSS/ JS)에서 사용된다. ex ) sass = > package ( 번들러 sass 설치 ) = > css로 변환 parcel : 구성 없는 단순한 자동 번들링 (소/중형 프로젝트에 적합) webpack : 매우 꼼꼼한 구성 (중/대형 프로젝트에 적합) 1. parcel bundler 설치 터미널에서 번들러 설치 npm i -D parcel-bundler 2. Parcel - 정적 파일 관리 추가하기 파비콘등 이미지의 정적 파일들을 dist 폴더로 자동으로 넣어주는 기능 추가하기 2-1. npm..