웹 (22) 썸네일형 리스트형 gatsby) github.io pages 이용 file hosting - 개발 일지 8 static 이라는 디렉토리를 만들고 소스 코드에서는 static을 제외해서 file resource 주소로 사용함 nodejs, reactjs) gatsby page navigation - 개발 기록 6 다음은 template 으로 navigate 한 예제이다. import React, { useEffect } from 'react';import { navigate } from 'gatsby';const IndexPage = ({ pageContext }) => { const { lastItem } = pageContext; useEffect(() => { if (lastItem && lastItem.id) { navigate(`/${lastItem.id}`); } }, [lastItem]); return ( Hello World )}export default IndexPage; nodejs, reactjs) comment 댓글 기능 view model controller - 개발 기록 5 작성 완료 간단하므로 스킵 사전 참여 아이디어 - online to offline - 무형을 유형으로 증명 nodejs, reactjs) react to static page - gatsby node api - 개발 기록 4 요구 사항 1. react state 별 static page 만들기=> 나 같은 경우 main page의 title, comment, 플레이 할 mp4 파일 name 등 을 객채 별 state로 관리하고 있었다=> 객체 별 state를 객체 ID 를 주소로 하는 (예: /item/1) 개별 page를 static 하게 만들고 싶다 과정 1. gatsby cli install 2. gatsby boilderplate git clone 3. gatsby-node.js 작성: component 별 주입할 data를 server에서 받아와 어떤 template에 어떤 data를 넣어줄지 정리하는 곳const { getDataSource } = require('./src/data-loader');exports... nodejs, reactjs) mp4 파일 화면에 플레이 하기 - 개발 기록 3 nodejs) play.router.jsconst express = require('express');const router = express.router();const playcontroller = require('../controller/play.controller');router.get('/video/:filename', playcontroller.playvideo);module.exports = router; play.controller.jsconst path = require('path');const fs = require('fs');async function playVideo(req, res) { const filename = req.params.filename; const videoPat.. nodejs) puppeteer 사용해서 특정 사이트에서 file download - 개발 기록 2 const puppeteer = require('puppeteer');class ItemDownloader { async downloadImage(link) { const links = await this._extractFileLinksFromLink(link); const paths = await this._downloadFiles(links); return paths; } async _extractFileLinksFromLink(link) { const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto.. 데이터 만들기 데이터 주제 - hot korean girl nsfw 찾는 방법 - 있는 데이터 사용 (amuwiki) 이전 1 2 3 다음