'리액트' 태그의 글 목록 (3 Page)
본문 바로가기
728x90
반응형

리액트30

Multer 이용 서버에 비디오 저장 onDrop 구현을 해주고 const onDrop = (files)=>{ let forData = new forData; const config = { header : {'content-type': 'multipart/form-data'} } forData.append("file",files[0])//첫번째 가져오기 위해 array 사용 // console.log(files)//파일의 파라미터가 저장됨 Axios.post('/api/video/uploadfiles',forData,config) .then(response=>{ if(response.data.success){ }else{ alert('비디오 업로드를 실패했습니다.') } }) } 우선 이렇게 선언하고 그전에 서버를 구현을 안해놨으니 구현을 .. 2021. 2. 28.
비디오 업로드 만들기 2 state를 만들건데 현재 VideoUploadPage를 보게 되면 onChage나 value 이런 것이 있는데 이를 state로 만들고 한번에 서버로 보낼 것이다. const [VideoTitle, setTitle] = useState("") 이렇게 선언을 해주고 const [Description, setDescription] = useState("") 선언하고 const [Private, setPrivate] = useState(0) const [Category, setCategory] = useState("Film & Animation") 이렇게 두개 선언해주고 option에 대해서 key value 이렇게 있을때 key value 두번 선언해서 해도 되지만 map을 이용해서 할 것입니다. 그걸 하.. 2021. 2. 25.
WEB 만들기 -31 로그아웃 랜딩 페이지에 버튼 하나 생성하면되는것인데 LandingPage로 가서 여기 아래 부분에 로그아웃 넣어주고 나서 const onClickHandler = ()=>{ axios.get('/api/user/logout') .then(response=>{ console.log(response.data) }) } 추가 로그아웃 수정 하면 끝 그리고 제대로 로그아웃이 되면 로그인 창으로 넘어갈 수 있도록 import React, { useEffect } from 'react' import axios from 'axios'; function LandingPage(props){ useEffect(() => { axios.get('/api/hello') .then(response => { console.log(resp.. 2021. 1. 25.
WEB 만들기 - 27 React Hooks 로그인 페이지를 만들기에 앞서서 좀더 리액트에 대해서 설명 class 와 function의 차이 class의 기능 functional에서는 못쓰는데 16.8 hooks 업데이트로 인하여 사용을 할 수 있게되었다. 훅이 생기고 나서는 저렇게 같게 할 수 있게 되었다. 요새는 hooks를 사용 class에서는 constructor 가 먼저 실행되서 state를 먼저 부여 해주고 그다음에 render를 해주는데 이런 돔이 있는데 이 돔에다가 알맞게 넣어주는것 그래서 화면에 랜더링 해주는것 이다. 그다음에는 componentDidMount 이것을 통해서 데이터를 가져오거나 하고싶은것을 해주면 되는것이다. 무튼 저런 라이프 사이클을 가진다. 2021. 1. 24.
728x90
반응형