moment.js를 인스톨한다. 날짜형식을 지정할 js파일(Products.js)에 moment 관련 아래 소스를 추가한다. const moment = require('moment'); Products.prototype.dateFormat = (date) => ( //return 생략 moment(date).format('YYYY-MM-DD') ); 화면에 뿌려주는 html파일(products.html)에서 해당 함수를 불러 사용한다. {{ product.dateFormat( product.createdAt ) }} 지정한 날짜 형식으로 출력된다.

admin.ctrl.js(controller) 에 아래 소스 코드 추가 // admin의 index.js의 router.get('/products', ctrl.get_products )와 맵핑 exports.get_products = ( _ , res) => { //전체 조회(findAll) find라는 것도 있다. models.Products.findAll({ }).then( (productList) => { // admin/products.html에 파라미터로 받은 데이터 전달 // productList : productList를 productList로만 써도 된다 // Javascript에서 키 값과 벨류 값이 같을 때에는 한 번만 적어줘도 됨. // template은 render res.rende..

▶ width - 요소의 가로 너비를 지정. - CSS 속성에는 기본값(별도로 설정하지 않아도 미리 지정되어 있는 값)이 존재함. - width의 기본값은 auto. - 속성 값 - auto: 브라우저가 너비를 계산. - 단위: px, em, rem, %, vw, cm 등 단위로 지정. ▶ height - 요소의 세로 너비를 지정. - 기본값은 auto. - 속성 값 - auto: 브라우저가 너비를 계산. - 단위: px, em, rem, %, vw, cm 등 단위로 지정. ※ 참고 사항 - 에 width: auto; height: auto; 지정 시에는 화면상에 아무것도 나타나지 않음. - block 요소의 경우 width: auto; height: auto;로 설정 시 브라우저는 width: 100%..

▶ vmax, vmin - vmax와 vmin에서 'v'는 viewport를 의미. - vmax, vmin은 각각 viewport의 최대 너비와 최소 너비를 의미함. - 위의 결과 화면에서는 viewport의 가로의 길이가 세로 길이보다 더 긴 상태. - vmax는 현재 더 넓은 사이즈의 너비를 의미. - 위의 예시에서는 가로가 더 길기 때문에 가로 사이즈의 절반만큼 width값을 정의. - 위의 예시처럼 viewport의 가로 너비를 줄여서 세로가 더 길게 만들면 width값은 viewport의 세로 너비의 절반이 됨. - vmax와 달리 vmin은 가로/세로 중 더 짧은 쪽의 길이를 백분율로 계산하여 사용.

▶ vw, vh - vw는 viewport의 width를, vh는 viewport의 height를 의미함. - 화면에 출력되는 화면 전체가 viewport에 해당. - viewport의 비율이 vw와 vh. - vw는 백분율. 100 단위 안에서 설정함. - vw = 100vw. 50vw는 50%에 해당. - viewport가 늘어나면 늘어나는 만큼, 줄어들면 줄어드는 만큼 절반만 사용하는 것. - 100이 최고 사이즈로 그 안에서 1부터 100까지 선언함.

▶ em - em은 현재 자기 자신의 font-size의 영향을 받음. - .container의 width는 60em인데 해당 font-size가 10px이니 10*60=600px에 해당. - em 사용 시 font-size의 영향을 받고 font-size 조정 시에는 조정된 사이즈의 영향을 받는 모든 부분이 같이 변경됨. - 특정한 조상 요소에 절대적인 값을 입력해 놓고 이하는 그 값에 맞게 변경할 때 em을 많이 사용함. - em은 중간중간에 조상요소를 타고 올라가면서 영향을 받는 관계를 모두 이해해야 함(em의 단점). - 타고 내려오다 중간에 font-size를 지정하기 애매한 구간이 생기면 이 또한 em 단위에 영향을 주기 때문에 관리에 어려움. - 그래서 쓸 수 있는 단위가 rem. ▶ rem..