reset.scss html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, ..

babel-loader 진보한 자바스크립트를 끼워넣어서 어떻게 될지 시험해보겠다. import "../scss/styles.scss"; const something = async() => { console.log('something'); } ↑ main.js 작성하고 npm run dev:assets로 실행 근데 사실 만들어진 파일은 똑같다. 사실은 조치를 취해야 된다. 즉, 옛날 자바스크립트로 만들어주어야 한다. npm install babel-loader로 바벨로더를 설치한다. webpack.config.js로 가서 rule을 하나 더 추가한다. npm run dev:assets로 실행해본다. 그리고 static 폴더에 있는 main.js를 보면 사실 거의 같지만, 잘 작동한 것이다. 이렇게 하면 문..

Webpack이란 - 최신 프런트엔드 프레임워크에서 가장 많이 사용되는 모듈번들러 - 모듈 번들러: 웹 애플리케이션을 구성하는 자원(HTML, CSS, Javascript, Images 등)을 모두 각각의 모듈로 보고 이를 조합해서 병합된 하나의 결과물을 만드는 도구 ** 즉, 프로젝트 작업을 하다보면 HTML CSS Javascript Image 등 파일 수가 엄청 많아지는데 이를 하나로 묶어주는 도구를 말하는 것이다. ★ 노마드코더 강의가 현 기준으로 몇 년 된 강의라서 웹팩도 바뀐 점이 많아 강의를 그대로 따라하면 안되는 부분이 많았다. 다행히 덧글에 천사😇분들께서 해결방법을 알려주셔서 그대로 따라했다!,,,, 1. extract-text-webpack-plugin가 webpack이 4버전으로 넘어..

3.12 Searching Videos 정규표현식을 사용하여 Search 구현하기 이제 검색 화면을 수정할 것이다. 정규 표현식 이라는 것이 있다. 이것은 string으로부터 무언가를 가져오는 것이다. 우리가 정규 표현식으로 하고 싶은건 handsome을 찾던 Handsome을 찾던 대소문자를 구별하지 않고 찾도록 하면서 내가 찾는 단어가 포함된 모든 걸 찾는 것이다. export const search = async(req, res) => { const {query: { term: searchingBy }} = req; let videos = []; try{ videos = await Video.find({title: {$regex: searchingBy, $options: "i"}}); }catch(..

딕셔너리(맵) 딕셔너리(맵) : 데이터를 [키,값] 쌍으로 담아두는 자료구조 (키와 값의 쌍으로 이루어진 컬렉션) 키: 원소를 찾기 위한 식별자 집합의 Set 클래스와 마찬가지로 ES6에는 Map 클래스가 내장되어 있음 Map 객체와 객체의 차이 Map 객체는 객체와 유사하지만 다음과 같은 차이가 있음 구분 객체 Map 객체 키로 사용할 수 있는 값 문자열 또는 심벌 값 객체를 포함한 모든 값 이터러블 X O 요소 개수 확인 object.keys(obj).length map.size 1. Map 객체의 생성 - new Map() / new Map([[키1,값1], [키2,값2]]) Map 객체는 Map 생성자 함수로 생성한다. Map 생성자 함수에 인수를 전달하지 않으면 빈 Map 객체가 생성된다. co..

정규 표현식(Regular Expression) /정규표현식/플래그 텍스트에서 우리가 원하는 특정한 패턴을 찾을 때 아주 요긴하게 쓰일 수 있다. 예) 아주 긴 글에서 전화번호 형태의 패턴을 찾거나 웹사이트 형태의 패턴을 찾을 때도 사용될 수 있음 찾아진 문자열을 다른 문자열로 변경도 가능 또는 사용자가 입력한 데이터가 이메일이나 패스워드와 같은 특정한 패턴에 부합하는지 - 유효성 검사를 할 때에도 쓰일 수 있음 // 슬래쉬를 이용해서 나타내주면 된다. 슬래쉬 안에 우리가 찾고자하는 패턴을 작성해주면 된다. 그리고 어떤 옵션으로 검색할 건지 플래그를 활용할 수 있다. 플래그 글로벌과 멀티라인을 이용할 것임 글로벌: 매칭되는 다수의 결과값을 기억할 수 있는 것을 말함 멀티라인: 한 줄 한 줄 1. 그룹,레..