API
-
JS / 유튜브 자주쓰는 iframe player API 매개변수 정리Web dev/ETC 2024. 2. 14. 23:01
자주 쓰는 유튜브 iframe player 매개변수 정리 유튜브영상 시작시간 설정 // 시작시간 설정 유튜브영상 끝나는시간 설정 // 끝나는시간 설정 유튜브영상 자동재생 // 자동재생 설정 mute=1 로 소리없음을 해야 자동재생 유튜브영상 컨트롤러 제거 // controls=0(컨트롤 제거), controls=1(기본값)플레이어 컨트롤이 플레이어에 표시 유튜브영상 로고 제거 // 유튜브 로고 제거: modestbranding=1 유튜브영상 반복 재생 // 반복재생 단일영상은 playlist를 추가 해줘야한다. 유튜브영상 관련 영상 표시 안하기 // 관련 동영상 표시 안하기 유튜브 IFrame Player API https://developers.google.com/youtube/player_parame..
-
React / heroku 에 json-server 배포하기 React deployWeb dev/React 2022. 4. 16. 14:19
저번에 AWS EC2에서 react 와 express 로만든 프로젝트를 배포해보았다. 그리고 이번에는 json-server로 api를 만들어 프로젝트를 베포해봤다. 물론 React는 CRA로 만들었다. webpack이니 뭐니 아직 초보라 잘모르겠다..공부할것이 많다. 1. json-server 셋팅 프로젝트 최상위 루트에 서버폴더를 만든 후 api와 index.js를 만들어 서버를 만들것이다. 리엑트 빌드까지 할 것이다. 2.헤로쿠 프로젝트올리기 회원가입 후 프로젝트를 git으로 push할 것이다. 물론 처음해본거지만 깃헙과 비슷한것 같다. 깃헙과 연동도 되어 깃헙에 푸쉬하면 자동으로 업데이트된다 ㅋㅋ 1. json-server 셋팅 json-server 설치 npm i json-server server..
-
React / json-server 로 쉽고 빠르게 API , server 만들기Web dev/React 2022. 4. 16. 13:28
프론트엔드 개발연습을 할 때에 백엔드까지 개발하는것은 번거롭다.. json-server를 사용하면 3분만에 임시서버를 만들 수 있다. 프로젝트 최상위 루트에 api를 만들어준다. data.json { "carList": [ { "id": 1, "name": "올 뉴 투싼", "price": "78000", "manufacture": "17년식", "imageURL": "/images/car-tucson.png", "discount":"20%" }, { "id": 2, "name": "코나", "price": "65000", "manufacture": "19년식", "imageURL": "/images/car-kona.png", "discount":"20%" }, { "id": 3, "name": "셀토스..
-
React axios swiper 데이터뿌리기Web dev/React 2022. 3. 16. 12:21
앞서 React 와 express 를 연결시킨 뒤 axios로 api 데이터를 받아와 콘솔로 찍어보았다. 그리고 받아온 데이터를 swiper 로 렌더링 시켜보았다. 1. useEffect 로 로드되었을때 데이터를 받아와 useState 값에 넣어준다. const [item, setItem] = useState([]); useEffect(() => { const callApi = async () => { await axios.get("/api") .then((res) => { setItem(res.data.product) }); }; callApi(); }, []); setItem 에 데이터를 넣어준뒤 item에 데이터가 잘들어갔나 콘솔을 찍었는데 자꾸 안들어 가서 한참 버벅였다.. 콘솔도 찍어보고 ret..