대기업을 향한 디벨롭 블로그

react-query라는 좋은 기술이 있다. react-query는 쉽게말해보겠다. 일단 리액트의 좋은장점인 데이터와 UI의 일치가 편리하다는점이있다. 데이터는 업데이트가이미 되었지만 UI에서는 업데이트되기전의 데이터가 나와있다는거다(새로고침하기전에). 서버와 클라이언트에서도 이런일이 번번히있다. 서버에서의 데이터와 클라이언트에서의 보이는 데이터가 다를거다. react-query는 그런문제점을 해결해준다. 예시) 암호화폐거래소가있다고 치자 , 이 암호화폐는 쉬도없이 값이바뀐다. 그럼 서버에서 그 바뀐값이 클라이언트에게 뿌려지는데 클라이언트는 쉴새없이 새로고침을 하여 서버에게 요청하기는 어렵다. react-query는 실시간으로 바뀌는 서버의값을 위해 알아서 요청을 보내고 , 클라이언트의 UI도 바꿔준다...

FileReader를 사용하여 이미지를 읽어와 미리보기를 띄어보겠다. https://mhypro.tistory.com/64 이미지 미리보기 - FileReader 객체 사용하기(공식문서 파헤치기) FileReader 객체는 파일을 읽어들어와주는 API이며 , 읽어드린파일 데이터는 개발자가 사용할 수 있다. 일단 공식문서를 토대로 정리할거니 공식문서를 올리겠다. https://developer.mozilla.org/ko/docs/Web/API mhypro.tistory.com 이 포스팅을 이어서 시작하겠다. 일단 전체소스코드 import React, { useState } from 'react'; function App() { let [newfile , setNewfile] = useState([]) co..

FileReader 객체는 파일을 읽어들어와주는 API이며 , 읽어드린파일 데이터는 개발자가 사용할 수 있다. 일단 공식문서를 토대로 정리할거니 공식문서를 올리겠다. https://developer.mozilla.org/ko/docs/Web/API/FileReader FileReader - Web API | MDN FileReader 객체는 웹 애플리케이션이 비동기적으로 데이터를 읽기 위하여 읽을 파일을 가리키는File 혹은 Blob 객체를 이용해 파일의 내용을(혹은 raw data버퍼로) 읽고 사용자의 컴퓨터에 저장하는 developer.mozilla.org 일단 파일을 넣어야되기때문에 웹에 input태그를 이용해서 띄어보겠다. {fileOn(e)}}/> input태그의 속성은 type은file , m..

참고용사이트 https://ko.javascript.info/localstorage localStorage와 sessionStorage ko.javascript.info 브라우저에 데이터를 저장할 수 있는 LocalStorage를 알아보겠습니다. 브라우저에 데이터를 저장할 수 있는 객체는 2가지가있는데 하나는 sessionStorage와 우리가 배워볼 localStorage가 있다. 이 두가지를 웹 스토리지 객체라고 부른다. 먼저 localStorae의 특징을 알아보자. 데이터를 저장할때의 자료형은 '문자열'데이터만 저장할 수 있다. 데이터를 새로고침하여도 데이터가 남아있다. (브라우저를 닫았다 열어도 없어지지않음) 웹 스토리지객체는 네트워크 요청시 서버로 전송되지않는다. 최소 2MB이상의 객체를 저장할..