Network Performance Monitor

    react-chopper

    1.1.9 • Public • Published

    react-chopper

    Create Datamodels in react

    Code without setState

    No need to remember this.setState()

    No need to manage state in redux(use only for global data like global user info , global ui loader)

    No need to use other libraries for state management

    Unidirectional Flow under the hood

    Use reactjs almost like angular

    CircleCI status Coverage Status

    Example Live , Complex example, Super complex example

    Below code does not contains this.setState

    import React, { Component } from 'react';
    import { render } from 'react-dom';
    import ReactChopper from 'react-chopper';
     
    class App extends Component {
      constructor(props) {
        super(props);
        this.state = {
          name: 'React'
        };
        this.modal = ReactChopper(this.state, this);
      }
      render() {
        return (
          <div>
            <input
              name={this.modal.name}
              onChange={e => this.modal.name = e.target.value} />
            <p>
              Bang Bang {this.modal.name}
            </p>
          </div>
        );
      }
    }
     
    render(<App />, document.getElementById('root'));
     
    //Note : after using this.modal you should not use this.state

    Medium Article - two way binding in reactjs

    Aim

    Not to develop insecurity by making it higherorder component and wrapping whole react component like other libraries.

    Make every develop know whats under the hood its Javascript Proxies.

    It will be doing one task only , is to watch any changes on target object and do setState underthehood.

    This lib won't be doing multiple task like other react libs do Eg : redux-form , react-form , react-validation ect .. developers pickup these libs for validation and land up doing state management , which is filled up with its limitations and ultimately creating spagetti code.

    TODO

    • Write initial testcases
    • Integrate with circleci
    • Add coveralls support
    • A Simple demo sandbox app made from react-chopper
    • A Complex computation demo sandbox app made from react-chopper
    • A Super complex computation demo sandbox app made from react-chopper
    • Documentation about
    • Testcase that uses react-chopper lib from npm
    • Write some more Complex testcase scenarios for testing
    • Use rollupjs instead of webpack
    • Create seperate develop for all developer experiments
    • Setup mechanism to push tested code to master branch
    • Deploy package on npm from circleci from master branch
    • Add debug mode for debuging , watch changes purpose

    Install

    npm i react-chopper

    DownloadsWeekly Downloads

    33

    Version

    1.1.9

    License

    MIT

    Unpacked Size

    12.8 kB

    Total Files

    18

    Last publish

    Collaborators

    • vijay777pawar