# mobx

18개의 포스트

바닐라 자바스크립트에서 mobx 사용하기

parcel-bundler 통해서 아주 쉽고 빠르게 웹 어플리케이션 프로젝트 구성 가능

2020년 7월 27일
·
0개의 댓글
post-thumbnail

Next.js + Mobx 템플릿(boilerplate) 공유합니다!

AlpoxDev/nextjs-boilerplate수많은 React.js 프로젝트를 생성하고 개발하면서, 어떻게 하면 좀 더 나은 설계와 쉽게 프로젝트를 짤 수 있을지 고민해왔습니다. 클린코드책과 클린 스트럭쳐의 책을 읽으면서 고민도 해왔습니다. 웹 프로젝트, 특히 리

2020년 7월 10일
·
0개의 댓글

[Front-end/React] Mobx vs Redux (Redux-toolkit)

기존에는 React와 함께 Redux를 사용해왔는데 이번에 새로운 프로젝트를 하게 되면서 리덕스를 계속 사용할 지, 아니면 새로운 라이브러리 Mobx를 도입할 지에 대해 고민하던 중 글을 작성하게 되었습니다.부족한 점이나 틀린 부분이 있으면 언제든 피드백 환영합니다 :

2020년 7월 8일
·
0개의 댓글
post-thumbnail

React에 Mobx 얹어서 로그인 구현해보기

아무래도 아직까지는 Mobx보다 Redux를 사용하는 사람들이 많아서 Mobx에 관한 자료가 적습니다.게다가 Mobx가 자유도가 높은 것인지 정형화 된 패턴이 보이지 않기도 하고, 리액트 Hook이 나오면서 클래스형 컴포넌트를 사용할 때와 Hook을 사용할 때 Stor

2020년 4월 27일
·
0개의 댓글

MobX store 값을 local값과 함께 사용기(3)

먼저 간단하게 MobX를 사용해서 어떻게 localstate 와 store state가 같도록 맞춰주는지 확인해보겠습니다.MobX 사용 순서 확인< localState / storeList >1\. localState === storeList (s

2020년 4월 23일
·
0개의 댓글

MobX에서 객체 배열 복사하기(2) - toJS

toJS(value, options?)MobX공식 홈페이지에 가서 보시게 되면 객체 , 배열을 (관측가능한) 자바스크립트 구조로 변경해준다는 내용을 찾아볼 수 있습니다.toJS는 이렇게 3개의 옵션을 허용해주는데요exportMapsAsObjects여부 (개체를 관찰지도

2020년 4월 23일
·
0개의 댓글
post-thumbnail

MobX

2020/04/10/금요일 (시작)MobX공부 시작 , 실제 회사 업무에서 MobX를 사용하기 때문에 더 열심히 , 더 실무에서 유용하도록 MobX를 공부하고 또한 정리하도록 하겠습니다.

2020년 4월 10일
·
0개의 댓글
post-thumbnail

class 형식으로 Mobx 사용해보기

👉 Mobx? 리엑트에서 state 관리를 위한 전략은 여러가지입니다. 가장 널리 알려진 redux, useState hooks를 이용한 각 컴포넌트 레벨에서의 관리, contextAPI 를 이용한 컴포넌트들 간의 state 관리, 그리고 mobx를 이용한 관리 등

2020년 4월 9일
·
1개의 댓글

[프로젝트-DediCats] Devlog-10

몇일 전, 포스트에서 mobx store 리팩토링 작업에 관한 포스트를 작성했었다. 2개의 스토어에서 총 6개의 스토어로 확장하였고 기능에 맞게 각 스토어로 이동시켰다.이 중 스토어 분할을 통해 리팩토링을 할 수 있었던 몇 가지 helper function 에 대해 적

2020년 2월 16일
·
0개의 댓글
post-thumbnail

MobX with React - 환경 구축과 적용

환경 구축에 앞서 MobX의 기능 중 하나인 데코레이터(@)를 이용해서 적용하는 코드는 create-react-app 에서 공식적으로 지원하는 메서드가 아니에요.

2020년 2월 12일
·
0개의 댓글
post-thumbnail

MobX with React - 개요

리액트에서는 화면 안에서 값이 변하는 값들이나, 변화를 유발하는 변수들을 class 컴포넌트의 경우 state로 관리합니다. 그러나 state관리가 굉장히 불편하고 오류도 많아 상태 관리 라이브러리들을 사용하곤 합니다. 저는 MobX를 선택했네요.

2020년 2월 11일
·
0개의 댓글
post-thumbnail

Custom Hooks - usePending

만들게 된 계기.... - 저는 회사에서 Mobx를 사용해 개발을 하면서 항상 Store에서 isLoading 이라고 변수를 하나 만들어 데이터 get, post 등 비동기 함수를 사용 할 때 썼습니다... 하지만 항상 이렇게 쓸 때 마다 너무 비효율적인거 같고 어쩔때는 작동을 하지 않은적도 꽤 있었습니다. 그래서 계속 고민하고.. 검색해보고.. 하다가 딱...

2019년 11월 12일
·
4개의 댓글
post-thumbnail

React - eject 없이 Mobx 데코레이터 사용하기

오늘 써볼 글은 React의 상태관리를 할 때 많이 사용하는 라이브러리인 Mobx의 데코레이터를 CRA에서 yarn eject 없이 사용하는 법을 알아보겠습니다 :) 보통은 Mobx 말고도 데코레이터를 사용할 수 있습니다. 하지만 Mobx를 사용하면서 데코레이터를 많이 사용하고 react에서 데코레이터를 사용할 때 여러가지 설정에 관한 문제를 겪었기 때...

2019년 10월 27일
·
1개의 댓글

MobX를 React Hooks (TypeScript) 와 함께 사용하는방법

MobX와 React Hooks를 조합하려고 하면 mobx-react-lite를 자연스럽게 접하게 됩니다. 그러나, 기존의 모든 기능이 구현되어 있지는 않아서 직접 구현을 하셔야 합니다. 예를 들면, 외부에 스토어를 생성하고 사용할때, 리액트에 안에서 사용할 수 있도록 해주는 inject나 Provider를 제공하지 않습니다. Hooks로 코드를 작성...

2019년 10월 6일
·
0개의 댓글
post-thumbnail

MobX (3) 심화적인 사용 및 최적화 방법

지난 포스트에서 MobX 의 기본적인 사용 방법과, 리액트에서는 어떻게 사용하는지 알아보았습니다. MobX 를 조금 더 복잡한 프로젝트에서 사용을 한다면 어떻게 해야 할까요? 추가적으로, 어떻게 해야 컴포넌트의 업데이트 성능을 최적화 하면서 프로젝트를 구성 할 수 있는

2018년 9월 8일
·
8개의 댓글
post-thumbnail

MobX (2) 리액트 프로젝트에서 MobX 사용하기

MobX 는 리액트 종속적이진 않지만, 리액트에서 쓰려고 만들어졌기 때문에 함께 사용하면 엄청난 시너지가 발생합니다. 더 쉬운 글로벌 상태 관리는 물론이고, setState 도 쓸 필요가 없게 됩니다. 2-1. MobX 가 리액트를 만나면 우리가 이전 섹션에서 decorator 문법을 통해서 더 편하게 MobX 를 사용하는 방법을 배웠었는데요, 우리가 ...

2018년 9월 8일
·
11개의 댓글
post-thumbnail

MobX (1) 시작하기

MobX 는 또 다른, 하나의 인기있는 리액트 상태 관리 라이브러리입니다. 저는 MobX 는, 사실상 라이브러리 그 이상의 가치를 하는, 리액트의 개발 흐름 자체를 많이 바꿔주는 강력한 도구라고 생각합니다. "MobX 는 최소한의 공수로 여러분들의 상태관리 시스템을 설계 할 수 있게 해줍니다." The curious case of mobx state tre...

2018년 9월 8일
·
7개의 댓글