목록React (76)
모든 일에 의문을 제기하고 그 의문을 해결하기 위해 지식을 구하고 공부
0. JSX 문법이란? -Javascript 안에서 html 문법을 사용하도록 함. 0. class -html에서 > class -jsx > className 0. css 적용 -style ={{ }} 0. import 중괄호 or not -import { user } from user : just export -import User from user : export default 한 것 0. 상대경로 1) 확장자를 붙이지 않아도 된다. (자동으로 붙여준다.) 2) 상대경로 작성방법 : 같은 폴더 안에 있는 경우 : ' ./ ' 로 시작 : 바깥에 있는 것은 : ../ : ' ./ ' 를 붙이지 않으면 NodeJS 라이브러리에서 모듈을 찾는다. : 모듈도 불러올 수 있다? module.exports 한 ..
React_랜딩페이지에 video 업로드
0. 비디오 카드 Template 만들기 -Row, Col, Card, moment, format 활용 (React 사전 참고) 1. mongoDB에서 video.data 가져오기 1) client에서 server로 [ get 요청 ] 보내기 더보기 useEffect(() => { Axios.get('/api/video/getVideos') .then(response=>{ if(response.data.success){ console.log(response.data) }else{ alert('비디오 가져오기를 실패했습니다.') } }) }, []) 2) server에서 DB 데이터를 client로 보내기 (find, populate, exec 메소드) 더보기 router.get('/getVideos', ..
React_비디오 업로드하기
1. 비디오 Collection 만들기 1) model 만들기 ( writer - ref.User , timestamps ) server > models > Video.js 더보기 const Schema = mongoose.Schema; const videoSchema = mongoose.Schema({ writer : { type : Schema.Types.ObjectId, ref : 'User' }, }, {timestamps:true} ) : 만든 date와 update한 date가 저장됨. .................... const Video = mongoose.model('Video',videoSchema) module.exports = { Video } 2. onSubmit func 만들..
*ffprobe란?) ffmpeg 라이브러리에서 제공하는 메소드 { streams: [0] [ { index: 0, [0] codec_name: 'h264', [0] codec_long_name: 'H.264 / AVC / MPEG-4 AVC / MPEG-4 part 10', [0] profile: 'High', [0] codec_type: 'video', [0] codec_time_base: '1001/60000', [0] codec_tag_string: 'avc1', [0] codec_tag: '0x31637661', [0] width: 1280, [0] height: 720, [0] coded_width: 1280, [0] coded_height: 720, [0] closed_captions: 0,..
React_썸네일 기능
0. ffmpeg 다운 : [ React 사전 - tool 설치 ] 글 참고 1. client에서 server로 videoUploadPage.js [ if 비디오 업로드에 성공하면 ] >> variable을 axios 함. 더보기 if(response.data.success){ let variable={ url:response.data.url, fileName:response.data.fileName } setfilePath(response.data.url) Axios.post('/api/video/thumbnail', variable) .then(response=>{ if(response.data.success){ setDuration(response.data.fileDuration) setThumbn..