Frontend Dev Environment
1.[프론트엔드 개발환경과 실습] NPM #1
인프런에서 모든 강의 25% 👏 할인 행사를 진행할 때 '프론트엔드 개발환경의 이해와 실습'을 강의를 구매했다. 지금까지는 Javascript, Vue.js, Python 등을 위주로 공부했었는데 같은 팀이었던 스크립터분이 프론트엔드로서 나아가려면 개발환경
2.[프론트엔드 개발환경과 실습] Webpack #2
ㅎㅎ작년에 결제한 강의인데 올해 처음부터 다시 듣고있다... 흐름이 끊기다보니 다 까먹었다ㅠ 처음부터 들어도 생소하기도하고 다시 듣다보니 조금 더 이해가 가는 부분도 있다. 강의 하나에 시간이 길진 않지만 따라서 타이핑하고 구글링해보고 하느니라 시간이 오래 걸린다!!
3.[프론트엔드 개발환경과 실습] Webpack #3
모든 내용을 완벽히 다 이해할 순 없지만 그래도 머릿 속에 내용을 박기 위해서 코드를 따라서 타이핑도 해보고 강의 내용을 정리하면서 되짚어보고있다. 음 뭔가 시간이 좀 더 지나서 내가 아는게 더 많아진다면 이때 들었던 것들이 이런거였구나 하면서 더 잘 이해될 것 같다.
4.[프론트엔드 개발환경과 실습] Webpack #4
번들된 결과물을 난독화하거나 특정 텍스트를 추출하는데 사용플러그인은 Class로 제작appply 함수를 구현, 인자로 받은 compiler 객체 안에 있는 tap() 함수를 사용플러그인 작업이 완료되는 시점 = Done번들된 결과물에 접근 = compilationweb
5.[프론트엔드 개발환경과 실습] Babel #5
👩💻 인프런 강의 Babel - ECMAScript2015+ 이상으로 작성된 모든 코드를 브라우저에서 동작하도록 호환성을 지켜줌 (타입스크립트, JSX 포함) - 설치 : npm install @babel/core @babel/cli - 실행 : npx bab
6.[프론트엔드 개발환경과 실습] Babel #6
가장 많이 쓰이며, es5 문법에 맞게 변환됨npm i @babel/preset env브라우저 버전명만 지정하면 env 프리셋이 최적의 코드를 출력해줌es5로 변환하지 못하는 것들로 코드 조각을 추가해서 해결Promise는 대체할 수 없으나 es5 버전으로 구현할 수는
7.[프론트엔드 개발환경과 실습] Lint #7
최근 가장 많이 사용코드의 문제점을 검사하여 더 나은 코드로 정정해줌npm i eslintnpx eslint app.js (실행).eslintrc.js 환경설정 파일 생성npx eslint app.js --fix (지정된 규칙에 한해서 자동 오류 수정 가능)"exten