본문 바로가기

분류 전체보기

 (179)
[#. Node] route, axios request(요청) 시 req.params vs req.query 차이 req.params vs req.query req.params 미리 자리를 정해놓고 원하는 변수로 지정해놓은 route 파라미터 router.get('/product/:id', controller.productDetail); localhost:3000/product/1 console.log(req.params)// { id: '1' } req.params 값은 router => controller => view로 넘어가게 된다 router router.get('/product/:id', controller.productDetail) localhost:3000/product/1// req.params.id = 1 controller exports.productDetail = fucntion(req, res..
[#. JavaScript] 소수점 올림, 소수점 내림, 소수점 반올림, 소수점 반올림 후 숫자를 문자열로 변환 소수점 올림, 내림, 반올림, 반올림 해서 문자열로 출력 하는 방법을 알아보자 소수점 올림 Math.ceil(89.123);// 90 Math.ceil(89.678);// 90 소수점 버림 Math.floor(89.123);// 89 Math.floor(89.678);// 89 소수점 반올림 Math.round(89.123);// 89 Math.round(89.678);// 90 toFixed 지정한 소수점 이하 숫자를 반올림한 후 숫자 -> 문자열 변환하여 출력 toFixed(2) => 소수점 3번째 자리에서 반올림 (89.123).toFixed(0)// "89" (89.123).toFixed(2)// "89.12" (89.123).toFixed(4)// "89.1230" (89.678).toFixed..
[#. JavaScript] 문자를 숫자로 형변환하는 parseInt, Number의 차이 parseInt, parseFloat의 차이 문자열을 숫자로 바꿔주기 위해 형변환을 사용한다 parseInt, Number의 차이를 알아보자 Number 변환하는 자리에 숫자만 가능 Number('1234')// 1234 Number('100만원')// NaN parseInt(정수) 변환하는 자리에 문자가 섞여있어도 숫자로 시작하는 경우에만 숫자가 시작하는 부분부터 숫자가 끝나는 부분까지 변환 가능 parseInt('1234');// 1234 parseInt('100만원');// 100 parseInt('가격은 100만원');// NaN parseFloat(실수) parseInt와 기본적으로 같지만, parseInt는 정수로 출력 parseFloat는 실수로 출력 var kg = '5.7kg'; parseInt(kg)// 5정수 parseFloat..
[#. React] import 중괄호 {}를 쓰는 이유 import a, { b } from '/config' react에서 변수를 사용하려고 할 때 중괄호 {} 안에 표기하는 변수, 그리고 그냥 표기하는 변수가 있다 이렇게 import할 때 중괄호 {} 사용 여부는 변수를 보내주는 방식에 따라 달라진다 /config.js const a = 0; const b = 1 export { a }; export const c = 2; export default b; config.js에서 변수를 불러오려고 한다 import f, {a, c as two} from '/config'; console.log(f, a, two)// 1, 0, 2 export default로 선언된 변수는 중괄호 {} 없이 받아올 수 있으며 변수명이 달라도 된다 export default b..
[#. JavaScript] 브라우저 화면 넓이(width), 높이(height) 값 가져오기 반응형 웹에서 기기별 px을 구해야 하거나, 여러모로 화면 위치값이나 넓이와 높이값이 필요할 때 사용할 수 있다 window.screenTop : 상단으로부터 브라우저 위치 window.screenLeft : 왼쪽으로부터 브라우저 위치 window.innerWidth : 브라우저 화면의 너비(viewport) window.innerHeight : 브라우저 화면의 높이(viewport) window.outerWidth : 브라우저 전체의 너비(메뉴, 툴바, 스크롤바 포함) window.outerHeight : 브라우저 전체의 높이(메뉴, 툴바, 스크롤바 포함)
[#. CSS] 반응형 웹 모바일, 태블릿 디바이스별 CSS 적용하기 미디어 쿼리 media query 반응형 웹을 구현하기 위한 미디어 쿼리(모바일, 태블릿 기기 기준 px) /* 아이폰 SE */ @media only screen and (min-device-width : 320px) and (max-device-width : 374px) { } /* 스마트폰 모바일(세로) */ @media only screen and (min-device-width : 375px) and (max-device-width : 479px) { } /* 스마트폰 모바일(가로) */ @media only screen and (min-device-width : 480px) and (max-device-width : 767px) { } /* 태블릿, 아이패드 */ @media only screen and (min-device-..
[#. Python] virtualenv, virtualenvwrapper python 가상환경 세팅, 설치하기 (macbook 기준입니다) @ 가상환경 프로젝트 별로 다른 버전의 python, 라이브러리, 모듈을 사용하게 된다 하나의 환경 안에서 서로 다른 버전을 사용하다 보면 서로 충돌을 일으킬 수밖에 없다 가상환경을 이용하면 각각의 python 프로젝트 별로 독립적인 환경을 사용할 수 있다 @ 설치하기 pip3 install virtualenv virtualenvwrapper ① virtualenv 사용하기 ⑴ 가상환경 생성 virtualenv --python=python3.6 python 버전 지정 => 현재 경로에 가상환경이 생성된다 ⑵ 가상환경 실행 . /bin/activate 혹은 source /bin/activate ⑶ 가상환경 종료 deactivate ② virtualenvwrapper 사용하기 @..
#9. iframe 동영상 위에서 swiper slide not work 슬라이드 안 될 때 해결 swiper.js를 사용해서 동영상 리스트를 생성했는데 iframe 동영상 위를 슬라이드하면 작동하지 않는다 iframe이 터치 이벤트를 삼켜서 그렇다고 한다 iframe { pointer-events:none; } css에서 iframe 터치 이벤트를 무력화한다 동영상 재생이 되지 않지만, iframe youtube 이미지를 썸네일처럼만 사용하고 싶을 때는 가장 간단한 방법이다

티스토리툴바