총총
태그 목록
- 전체보기(71)
- TIL(29)
- code.camp(4)
- API(3)
- React(3)
- ESLint(2)
- 삼항연산자(2)
- Prettier(2)
- 프레임워크(2)
- emotion(2)
- node.js(2)
- 알고리즘(2)
- typescript(2)
- JSX(2)
- REST API(2)
- Optimistic UI(2)
- GRAPHQL-API(2)
- 프로그래머스(2)
- 라이브러리(2)
- Map(2)
- filter(2)
- 메소드(2)
- Husky(2)
- 퍼블리싱(2)
- 포트폴리오(2)
- Graphql-codegen(1)
- 무한스크롤(1)
- 조건부 렌더링(1)
- Utility Type(1)
- 쿠키(1)
- 옵셔널 체이닝(1)
- 객체(1)
- memoization(1)
- yarn(1)
- Index(1)
- 데이터통신(1)
- state prev(1)
- Class Component(1)
- 컴포넌트 재사용(1)
- 배열메소드(1)
- 스코프체인(1)
- kakaomap(1)
- 라우팅(1)
- 카카오지도(1)
- Recoil(1)
- async await(1)
- 비동기통신(1)
- parseInt(1)
- number(1)
- package.json(1)
- Presenter(1)
- XML(1)
- includes()(1)
- JavaScript(1)
- pagination(1)
- graphql 뮤테이션(1)
- observable(1)
- 레이아웃(1)
- login(1)
- unshift(1)
- React Component(1)
- 컴포넌트 폴더구조(1)
- 자바스크립트(1)
- 문자열(1)
- template literals(1)
- 라우터(1)
- 얕은복사(1)
- CSS in JS(1)
- async/await(1)
- key(1)
- fontawesome(1)
- local storage(1)
- 모달창(1)
- State(1)
- useRef(1)
- 간단한 게임(1)
- event bubbling(1)
- stste(1)
- Sass(1)
- styled components(1)
- shift(1)
- React-slick(1)
- 정규식(1)
- SSR(1)
- Pop(1)
- state 끌어올리기(1)
- HoF(1)
- 최소공배수(1)
- Unity(1)
- infinite scroll(1)
- 페이지네이션(1)
- if문 대체(1)
- gitignore(1)
- 템플릿 리터럴(1)
- JWT토큰(1)
- 코딩테스트 연습(1)
- HoC(1)
- 차이점(1)
- node_modules(1)
- seo(1)
- cookie(1)
- next.js(1)
- event delegation(1)
- try catch(1)
- CRUD(1)
- apolloClient(1)
- Props(1)
- 권한분기(1)
- 지도연결(1)
- 기록(1)
- commit수정(1)
- closure(1)
- session(1)
- container(1)
- state원리(1)
- 로그인(1)
- scss(1)
- object(1)
- mui(1)
- 동기/비동기(1)
- 깊은복사(1)
- npm(1)
- 타입스크립트 기초(1)
- indexOf(1)
- push(1)
- Visual Studio Code(1)
- http(1)
- MapAPI(1)
전체보기 (71)TIL(29)code.camp(4)API(3)React(3)ESLint(2)삼항연산자(2)Prettier(2)프레임워크(2)emotion(2)node.js(2)알고리즘(2)typescript(2)JSX(2)REST API(2)Optimistic UI(2)GRAPHQL-API(2)프로그래머스(2)라이브러리(2)Map(2)filter(2)메소드(2)Husky(2)퍼블리싱(2)포트폴리오(2)Graphql-codegen(1)무한스크롤(1)조건부 렌더링(1)Utility Type(1)쿠키(1)옵셔널 체이닝(1)객체(1)memoization(1)yarn(1)Index(1)데이터통신(1)state prev(1)Class Component(1)컴포넌트 재사용(1)배열메소드(1)스코프체인(1)kakaomap(1)라우팅(1)카카오지도(1)Recoil(1)async await(1)비동기통신(1)parseInt(1)number(1)package.json(1)Presenter(1)XML(1)includes()(1)JavaScript(1)pagination(1)graphql 뮤테이션(1)observable(1)레이아웃(1)login(1)unshift(1)React Component(1)컴포넌트 폴더구조(1)자바스크립트(1)문자열(1)template literals(1)라우터(1)얕은복사(1)CSS in JS(1)async/await(1)key(1)fontawesome(1)local storage(1)모달창(1)State(1)useRef(1)간단한 게임(1)event bubbling(1)stste(1)Sass(1)styled components(1)shift(1)React-slick(1)정규식(1)SSR(1)Pop(1)state 끌어올리기(1)HoF(1)최소공배수(1)Unity(1)infinite scroll(1)페이지네이션(1)if문 대체(1)gitignore(1)템플릿 리터럴(1)JWT토큰(1)코딩테스트 연습(1)HoC(1)차이점(1)node_modules(1)seo(1)cookie(1)next.js(1)event delegation(1)try catch(1)CRUD(1)apolloClient(1)Props(1)권한분기(1)지도연결(1)기록(1)commit수정(1)closure(1)session(1)container(1)state원리(1)로그인(1)scss(1)object(1)mui(1)동기/비동기(1)깊은복사(1)npm(1)타입스크립트 기초(1)indexOf(1)push(1)Visual Studio Code(1)http(1)MapAPI(1)
TIL[34일차]낙관적인 Optimistic-UI
좋아요를 클릭하면 원래는 많은 단계가 있지만 아폴로캐시에서 미리 다음 숫자를 생각해서 미리 보여주고 요청을 하고 데이터베이스에서 변경을 한다. 쉽게말해 좋아요가 8이 있다면 눌렀을때 9가 되겠지 하고 예상해서 누르면 9로 바뀌게 먼저 보여주는 것이다. 만약 백엔드나 디
2022년 12월 15일
·
0개의 댓글·
0
Optimistic-UI
Optimistic-UI란?낙관적 UI는 UI에 바쁜 스피너를 표시하지 않고 애플리케이션이 서버에서 데이터를 변경하는 사용자 상호 작용에 즉시 응답하는 것처럼 느끼게 하는 패턴입니다. 처리할 서버로 만드는 데 시간이 좀 걸리더라도 UI에 충분한 정보를 보내서 가짜로 보
2022년 12월 15일
·
0개의 댓글·
0