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

리액트30

비디오 디테일 페이지 만들기 client 안의 views 폴더안에 VideoDetailPage 폴더생성을 하시고 VideoDetailPage.js 그리고 저 파일 생성 하시면됩니다. rfce를 해주면 자동으로 functional 들어가고 import React from 'react' function VideoDetailPage() { return ( VideoDetailPage ) } export default VideoDetailPage 이렇게 코딩을 해주시고 라우터 생성을 해줍시다. client/src/components/App.js 부분으로 가서 방금 만든 페이지 import import VideoDetailPage from "./views/VideoDetailPage/VideoDetailPage.js" 추가해주고, 라우터 처.. 2021. 3. 10.
랜딩페이지 비디오 나타내기 비디오 Template 만들고 몽고DB에서 데이터 가져오고 가져온 비디오 데이터 스크린에 출력 Use map() methods 랜딩 페이지에서 우선 이거 만들고 import React ,{useEffect} from 'react' useEffect(() => { Axios.get('/api/video/getVideos') .then(respones=>{ if(respones.data.success){ }else{ alert('비디오 가져오기를 실패 했습니다.') } }) }, []) 라우터 생성을 위해 server의 video.js 부분으로 갑니다. routes/video.js 부분에 router.post('/getVideos',(req,res)=>{ //비디오를 DB에서 가져와서 클라이언트에 보낸다. .. 2021. 3. 5.
비디오 업로드 하기 이렇게 비슷하다고 생각하다고 알고 있으면 좋습니다. 우선 해야하는것은 비디오의 collection을 만들어야합니다. 거기에 들어가는 것이 Video + writer + title + description + privacy + filePath + category + views + duration + thumbnail 이렇게 들어간다 생각합시다. 1. server의 models에 가서 Video.js를 만들어줍니다. const mongoose = require('mongoose'); const Schema = mongoose.Schema; const videoSchema = mongoose.Schema({ writer : { type: Schema.Types.ObjectId, ref: 'User'//이렇게 .. 2021. 3. 3.
ffmpeg를 이용하여 비디오 썸네일 만들기 우선 라이브러리 설치를 먼저 해야합니다. npm install fluent-ffmpeg 하기전에 ffmpeg.org/download.html Download FFmpeg If you find FFmpeg useful, you are welcome to contribute by donating. More downloading options Git Repositories Since FFmpeg is developed with Git, multiple repositories from developers and groups of developers are available. Releases Approximately every 6 ffmpeg.org 이사이트에서 다운을 해야합니다. 빨간 동그라미 의 links를 .. 2021. 3. 1.
728x90
반응형