검색기능을 정말 간단하게 구현하고 싶을때: 프로그래밍 가능한 검색 엔진을 사용하면 웹사이트, 블로그 또는 웹사이트 모음에 대한 검색 엔진을 만들 수 있습니다. 웹 페이지와 이미지를 모두 검색하도록 엔진을 구성할 수 있습니다. 순위를 미세 조정하고 자신의 프로모션을 추가하고 검색 결과의 모양과 느낌을 사용자 지정할 수 있습니다. 엔진을 Google 애드센스 계정에 연결하여 검색으로 수익을 창출할 수 있습니다.

#cse#api
#78
  • 혜택은 웹뷰로 존재함
  • GraphQL을 사용 중
useSWR(
  `{
    pages {
      user_group
      highlight_color
      page_list {
        type
        page_id
        page_name
        is_new
      }
    }
  }`,
  (query) => request('https://api.zigzag.kr/api/2/graphql', query)
)
#api
#77
# /home/USERNAME/.zshrc

HOME="/mnt/c/Users/cbcru"
DL="$HOME/Downloads"

if [[ $PWD == $HOME ]]; then
    cd $DL
fi
#zsh#dotfiles#shell
#75
extractFrames() {
  ffmpeg -i $1 -vf fps=30 output_frame_%d.png
}

# $1 = frames로 사용될 파일들
# $2 = output 파일
# Example: concatFrames ./frame_%5d.png output.webm
concatFrames() {
  ffmpeg -framerate 30 -i $1 -c:v libvpx-vp9 -pix_fmt yuva420p $2
}

# $1 = frame로 사용될 파일
# $2 = output 파일
# Example: frameToVideo frame.jpg output.mp4
frameToVideo() {
  ffmpeg -loop 1 -i $1 -c:v libx264 -t 10 -pix_fmt yuv420p $2
}

# $1 = 인코딩할 영상 video.mp4
# $2 = output 파일명
encodingVideo() {
  ffmpeg -an -i $1 -vcodec libx264 -pix_fmt yuv420p -profile:v baseline -level 3 "${$2}.mp4"
  ffmpeg -i "${$2}.mp4" -vcodec libvpx-vp9 -b:v 1M -acodec libvorbis "${$2}.webm"
}
#ffmpeg#video
#74

서버/프론트 구분이 없는 환경일 경우 옜날에는 이렇게 세팅해서 개발

const bs = require('browser-sync').create()

bs.init({
  port: 8081,
  https: false,
  proxy: 'http://localhost:8080',
  serveStatic: [
    {
      route: '/resources',
      dir: 'src/main/webapp/resources',
    },
  ],
  files: 'src/main/webapp/resources/**/*',
  open: false,
})
#local
#72

서비스워커로 fetch를 감지해서 해당 기능을 구현한다는 내용. 개인적으로는 mock은 간단하게 구현 가능할 것 같은데 이미 같은 기능의 잘 만들어진 라이브러리들이 있으니까 아이디어 정도로 생각하면 될 것 같다.

addEventListener('fetch', e => { 
  // e.request
  // e.respondWith
})
#fetch#service-worker#mock#msw
#70

charles

fiddler

mitmproxy

Footnotes

  1. AutoResponder기능을 어떻게 활용 가능한지 알려주는 내용. delay 추가로 응답 시간 조절이 가능하므로 font, script 로딩 시간을 늘려서 시각적으로 확인이 가능하다. ↩

#local#charles#debug
#69

localtunnel은 쉽게 테스트하고 공유할 수 있도록 로컬 호스트를 공개합니다! 다른 사람들이 변경 사항을 테스트하도록 하기 위해 DNS를 엉망으로 만들거나 배포할 필요가 없습니다.

app.listen(PORT, async () => {
  const tunnel = await localtunnel({
    port: PORT,
    subdomain: name,
  })

하지만 너무 느려서 ngrok 쓰는게 현실적일수도 있겠다. -20220917

Footnotes

  1. 로컬 환경에서 웹훅 테스트를 위해, API 엔드포인트를 만들고 localtunnel이나 ngrok을 사용하기. ↩

#local#debug#tunneling#localtunnel#ngrok#cloudflared
#68
# 특정 패키지에 모듈을 설치해야한다면
yarn workspace <workspace_name> <command>
#node#monorepo#yarn
#66
// package.json 파일에 로컬 경로를 지정하는 방법. 파일 시스템에 있는 패키지 디렉터리를 사용할 수 있음.

{
  "dependencies": {
    "bar": "file:../foo/bar"
  }
}
#node#npm#package
#65
25 중 21페이지
이전 페이지다음 페이지