React(15) 모바일앱인척 발행하기
목차 PWA에 대해 PWA 세팅방법 PWA에 대해 리액트로 웹사이트를 근사하게 만들었다면, PWA로 발행하여 앱인 것 처럼 사기(?)를 쳐서 발행할 수 있다. PWA란 PWA는 프로그레시브 웹 앱(progressive web app)의 줄임말으로, HTML, CSS, 자바스크립트(JavaScript)와 같은 웹 기술로 만드는 앱이다. 트위터, 핀터레스트, 스타벅스, 워싱턴포스트, 우버 등 여러 기업에서 UX를 제공하고 있다. 장점으로는, 앱스토어에 출시하면 별도의 프로세스를 거쳐야하고, 수수료도 빼앗기게 되지만, PWA를 이용한다면 이러한 마케팅 비용을 절약 할 수있다. 또한, 검색 엔진을 통해서 서비스를 찾을 수 있는 점으로, 높은 참여를 이끌어낼 수 있다. 푸쉬 알림을 통해서 사용자들의 관심을 끌수 ..
2023. 8. 19.
React(14) 성능을 개선하는 요소들
목차 memo Lazy import Suspense useTransition, useDeferredValue 부모가 렌더링될 때, 자식은 필요할때만 렌더링 하고싶을 때 : memo 부모 컴포넌트 안에, 자식 컴포넌트가 있다고 가정하자, 이 때, 부모에 있는 state가 변경되었을 때, 부모 컴포넌트와, 자식 컴포넌트도 덩달아 재렌더링이 된다. 자식 컴포넌트가 굉장히 많은 연산을 해야하는 컴포넌트일 경우, 자식컴포넌트는 렌더링이 안되고, 필요할때만 렌더링 하고 싶을 때 사용하는 memo에 대해 알아보자. 사용방법은, import { memo } from "react"로 import 하고, 재렌더링 되기 싫은 자식 컴포넌트에다가 적용시키면 된다. 자식 컴포넌트가 재렌더링 안되는 모습을 볼 수 있다. 필요할 ..
2023. 8. 19.