React 상태를 위한 가벼운 결정 👋

1.34킬로바이트의 React용 반응 상태 관리자(reactive-box 기준).

Light , Fast , 그리고 프리티 룩 😘

Realar 깨끗한 코드, 최소한의 추상화, 최소한의 추가 기능, 모듈화 가능한 아키텍처 및 제공 시간 사용자 경험을 목표로 합니다.

두 가지 기능만 알고 개발을 시작할 수 있습니다 😉
box . 반응 값 마커. 각 반응 값은 변경할 수 없는 상태를 갖습니다. 불변 상태가 업데이트되면 It에 의존하는 모든 React 구성 요소가 새로 고쳐집니다.
shared . 애플리케이션에서 상태 관리자를 사용하는 주된 이유 중 하나는 흩어져 있는 React 구성 요소와 코드의 모든 위치 간에 공유 상태에 액세스하고 공유 논리를 사용하기 때문입니다.

import React from 'react';
import { box, shared } from 'realar';

class Counter {
  @box value = 0;

  inc = () => this.value += 1;
  dec = () => this.value -= 1;
}

const sharedCounter = () => shared(Counter);

const Count = () => {
  const { value } = sharedCounter();
  return <p>{value}</p>;
};

const Buttons = () => {
  const { inc, dec } = sharedCounter();
  return (
    <>
      <button onClick={inc}>+</button>
      <button onClick={dec}>-</button>
    </>
  );
};

const App = () => (
  <>
    <Count />
    <Buttons />
    <Count />
    <Buttons />
  </>
);

export default App;

최상의 가능성을 위해 realar babel plugin 을 사용하면 코드가 너무 아름답게 보일 것입니다. See wrapped version on CodeSandbox .

다음번의 가능성은 다음 글에서 밝히겠습니다!😌

Realar Github link .

저자로부터

저를 읽어주신 모든 분들 안녕하세요! 1년 전 저는 오픈 소스가 제 Ikigai의 필수 부분이라고 결정하고 그날까지 서비스를 제공합니다.

나는 React 애플리케이션 상태 관리에 대한 심도 있는 연구를 했고, 그 아래에서 1년 이상 코딩했고, 다양한 버전의 구문 구조가 있었습니다. 하지만 결과적으로, 저는 존재하는 것에서 가장 좋은 것을 취하고 최소한의 성능 코드로 압축했습니다 😊

도서관에 대한 여러분의 의견과 생각을 기꺼이 받아들이겠습니다! 사람들이 코드를 더 좋게 만드는 데 도움이 될 수 있다고 생각하십니까?