Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

Version 1 Current »

This file was copied from the packages/webapp/src/stories/docs folder. Its accuracy as of August 8, 2024 has not been verified

Data flow

How data is stored on the backend

** Postgres:**

How data is stored on the frontend

** Redux store fieldReducer:**

const fieldReducer = {
  fieldReducer: {
    ids: [
      'b33c566e-ad15-11eb-945a-0242ac120002'
    ],
    entities: {
      'b33c566e-ad15-11eb-945a-0242ac120002': {
        farm_id: '9fd12c8a-ad15-11eb-80bb-0242ac120002',
        name: 'Field',
        notes: '',
        location_id: 'b33c566e-ad15-11eb-945a-0242ac120002',
        figure_id: 'b33d349e-ad15-11eb-945a-0242ac120002',
        type: 'field',
        total_area: 66601,
        total_area_unit: 'ha',
        grid_points: [
          {
            lat: 49.26654453351959,
            lng: -123.17612132540896
          },
          {
            lat: 49.26500428835197,
            lng: -123.17689380160525
          },
          {
            lat: 49.26500428835197,
            lng: -123.17187270632937
          },
          {
            lat: 49.26665654947446,
            lng: -123.17075690737917
          }
        ],
        perimeter: 1136,
        perimeter_unit: 'km',
        organic_status: 'Non-Organic',
        station_id: null,
        transition_date: null
      }
    },
    loading: false,
    loaded: true,
    error: null
  }
}

Copy

Steps for a backend - frontend story from a data flow perspective

  • Create knex migration to create/modify tables in database

  • Create objection models

  • Endpoints and empty controllers

  • Backend jest unit testing

  • Implement controllers

  • Create authorization/validation middlewares

  • Run tests and make sure everything passes

  • Create pure frontend components in storybook

  • res.data normalizer, redux slice, redux selectors to hold and access the data

  • Redux saga for get/post/put/patch request

  • Container component to connect saga actions/selector with pure components

  • Connect Route component with container components with react router

  • Manual testing

  • No labels