데스크탑에서 크롬이나 모바일 안드로이드 같은 경우 beforeinstallpropmt 이벤트를 사용해서 다운로드 버튼을 만들 수 있지만 ios는 작성일 기준까지도 불가능하다. 1. beforeinstallpropmt 이벤트 등록하기 import React, { useEffect, useRef } from "react"; ... let deferredPrompt = useRef(null); useEffect(() => { console.log("Listening for Install prompt"); window.addEventListener("beforeinstallprompt", (e) => { e.preventDefault(); deferredPrompt.current = e; }); //설치가 되어..
next js에 pwa 적용하기
next js에서 pwa를 적용하여 모바일에서 다운로드가 가능하게 만드는 튜토리얼 입니다 1. next js 설치 npx create-next-app next js를 설치한다 2. next-pwa 설치 npm install next-pwa next js 프로젝트 안에 next-pwa 패키지를 설치한다 3. next.config.js 파일을 생성한다 해당 파일 안에 아래와 같이 작성한다 const withPWA = require('next-pwa') module.exports = withPWA({ pwa: { dest: 'public' } }) 다른 웹팩에 관련된 패키지를 적용하려면 아래와 같이 한다. const withPlugins = require("next-compose-plugins"); const..