bhanwari devi下载-Bhanwari bhanwari devi源代码下载

Bhanwari Devi

Bhanwari Devi是一位被压迫的妇女，她敢于与拉贾斯坦邦农村的封建，种姓和父权制结构作斗争。她最初是一名社会工作者，是政府经营的妇女发展项目的一部分。 1992年，她参与了针对童婚的具体运动。她向妇女咨询了计划生育，女孩教育，针对女性杀人，嫁妆和童婚。由于她的行动主义，她和她的家人已经受到了村庄中主导的种姓男人的不断威胁和恐吓。

一旦她干预以停止从一个占主导地位的种姓家族的一个九个月大的婴儿的婚姻。这激怒了村里的主要种姓男人。尽管知道可能的后果，但她敢于继续反抗他们并代表正确的事物。同年，在一次报复行动中，她在野外工作时被绑架，丈夫在殴打。

在随后的正义追求中，她面临巨大障碍的途中的每一步。在派出所，初级卫生保健中心和司法机构。在这里阅读有关她的更多信息。

让我们编码并一起建造一些美丽的东西

我们欢迎大家。？

入门和贡献指南

请参阅我们的贡献指南。

发展精神

可以打破开发方面的东西。拿所有权并发送修复程序。
在审查PR时帮助其他人。如果有人需要改进其代码，请尊重。目标是一起工作并获得一些乐趣。
如果可以的话，请在查看PR或回复PR中的评论时使用大量的表情符号。
不要回避发送PR，我们很乐意为您提供帮助。

代码结构

代码构成的理念使事情尽可能小。保持功能较小，组件较小，并且文件较小。基本上使一切尽可能小。像奴才一样，我们喜欢奴才。谁没有。

让我们现在看看文件结构。

文件结构看起来像这样。

    ├── src                     # Source files
        ├──asset                # assets that belongs commonly in all components.
        ├──components           # Components and their child components. 
           ├──Course            # Course component and it's child components
              ├──index.js
              ├──styles.scss
              ├──constants.js
              ├──CreateCourse   #Course realted child component
                 ├──CourseForm  
                 ├──index.js
                 ├──styles.scss
              ├──CourseList
              ├──redux          # all the redux and api related things to Course, we will do under redux directory.
                ├──action.js    # We will define redux actions here
                ├──api.js       # All the course related APIs(axios requests) will happen here
                ├──reducer.js   # All the course related state management will happen here
                ├──saga.js      # All the middlewares for redux state management or api calls we will put here
                ├──util.js      # Mapper functions or any utility function for data manipulation
           ├──common            # All the common components which might be used anywhere in the app.
              ├──Notification
                 ├──index.js
                 ├──styles.scss
              ├──Spinner
                 ├──index.js
                 ├──styles.scss
          ├──pages              # root level containers for each page(Individual component wrapper for different url rotue)
            ├──CourseList       # these are basically wrappers, they should't me more than 30-40 lines.
               ├──index.js
               ├──styles.scss
          ├──routing           # Creating public and private routes for different pages.
          ├──services          # Tools and utilities for date, time, string and numbmers
          ├──sass              # app color css reference and mixins.
    ├──docs                    # Some documentation about code and other things.
    ├──.env.development        # development environment variables.
    ├──package.json
    ├──package-lock.json
    ├── README.md

请不要混淆并逃跑。我们知道上述结构有点长。但是您必须同意它是详细的，如果您仔细观察，它实际上很简单。

例如，我们的组件目录称为Course 。与课程实体直接相关的所有API，REDUX，REDUX-SAGA和常数都将进入Course组件目录。因此，如果有人使用与课程相关的东西，我们希望他们始终留在Course目录中。基本上是在下面的文件结构中。


 ├──components           
    ├──Course            
      ├──index.js
      ├──styles.scss
      ├──constants.js
      ├──ChildComponent
      ├──CourseList 
      ├──redux          
        ├──action.js    
        ├──api.js       
        ├──reducer.js   
        ├──saga.js      
        ├──util.js
      ├──AnotherChildComponent

注意：全局常数将进入全局src/constant.js文件。

了解代码库的几部分

技术堆栈

反应
redux（如果您是Redux的新手，您可以在这里学到一些信息。）
Redux-Saga（我们喜欢Redux-Saga，不知道Redux-Saga，不要为您服务。您可以在这里了解一些。）

注意：我们可以引导您了解如何使用Redux和Redux-Saga。请取得联系，我们可以为您提供Redux和Redux-Saga的简短简介。

如何进行API呼叫和管理状态

我们将Redux和Redux-Saga进行API调用并处理其响应。它使零件的寿命变得容易，并使它们保持较小且不复杂。

使用Redux的全部要点是以更轻松的方式处理应用程序状态管理。新的Redux在这里学习
通过使用Redux-Saga，我们移开了进行API调用的复杂性，并将响应递给特定文件（即saga.js ）中的响应远离UI逻辑。新的Redux，从这里开始学习

有四个文件/概念我们需要更新或更改以进行API调用。

动作（又称action.js ）
redux state（又称reduceer.js ）
API使用Axios（又称api.js ）调用[注意：使用本地存储做某事时不适用。]
Redux Middlewares（又名saga.js ）

TODO：添加视觉图像如何相互作用。

当您实现API调用时，您可以想到此流程。： - >

Create actions

↓

Create redux state

↓

Create the API function

↓

Create middlewares(saga)

创建Redux操作

操作是告诉Redux要更新哪个事件的一种方式。基本上它们有一个结构，如下。


 { type: 'INCREASE_COUNT', data: 5}

This above object will passed to redux through some function/API(aka Disptacher), 
and the intuitive behaviour of this `action` should be that it increments `counter` variable in redux by 5.

当我们进行API调用时，通常会处理三种操作。

当我们称为API端点时该怎么办。
当我们从API端点获得成功响应时该怎么办。
当我们从API端点获得失败的响应时该怎么办。我们将操作定义为相应的主组件Redux目录。文件路径看起来像这样的src/components/componentName/redux/action.js文件。让我们以获取用户信息的示例。以及我们如何定义获取用户信息的操作。动作应该看起来像这样。

 export const types = {
  GET_USER_INTENT: 'GET_USER_INTENT',
  GET_USER_INTENT_RESOLVED: 'GET_USER_INTENT_RESOLVED',
  GET_USER_INTENT_REJECTED: 'GET_USER_INTENT_REJECTED',
}

export const actions = {
  getUser(data) {
    return {
      type: types.GET_USER_INTENT,
      data,
    }
  },
  getUserResolved(data) {
    return {
      type: types.GET_USER_INTENT_RESOLVED,
      data,
    }
  },
  getUserRejected(error) {
    return {
      type: types.GET_USER_INTENT_REJECTED,
      error,
    }
  },
}

创建redux状态（又称还原器）

对于与状态相关的事物（保持API Rensponse数据和错误引用），我们在src/components/componentName/redux/reducer.js中创建和管理状态。代码看起来像这样。？

 import { types } from './action'

const initialState = {
  loading: false,
  error: false,
  data: null,
}

export default (state = initialState, action) => {
  switch (action.type) {
    case types.GET_USER_INTENT:
      return {
        ...state,
        loading: true,
        error: false,
        data: null,
      }
    case types.GET_USER_INTENT_RESOLVED:
      return {
        ...state,
        loading: false,
        error: false,
        data: action.data, // mapped user data.
      }

    case types.GET_USER_INTENT_REJECTED:
      return {
        ...state,
        loading: false,
        error: action.error, // keeping reference of the error, When API call fails.
        data: null,
      }

    default:
      return state
  }
}

创建API功能

为了从服务器获取数据，我们在此处创建API调用。通常，我们使用axios库。创建API的文件路径看起来像src/components/componentName/redux/api.js 。 API呼叫看起来像这样。？

 import axios from 'axios'
import { METHODS, HeaderFactory } from '../../../services/api'

/**
 * gets user data from the server.
 *
 * @param {opts} 
 * @param {object} opts
 * @returns {Promise}
 */
export const getUserData = (opts, tokens) => {
  return axios({
    url: `${process.env.REACT_APP_MERAKI_URL}/users/${opts.userId}`,
    method: METHODS.GET,
    headers: HeaderFactory(tokens)
  })
}

Redux Middlewars（又名Redux-Saga）

当我们谈论处理异步/API调用时，Middlewares非常有用。我们将SAGA MiddleWares放入src/components/componentName/redux/saga.js文件中。它使处理REDUX状态变得容易且直接。首先，它看起来可能有点麻烦或长。但是，在创建了两个或三个API呼叫之后，您将掌握它。这就是我们如何通过Redux Saga中间件来处理用户数据的方式。

 import { takeLatest, put, call } from 'redux-saga/effects'

import { types, actions } from './action'
import { authorizeRequest, httpStatuses } from '../../../services/auth'
import { getUserData } from './api'

/**
 * This handles gets user data from the server
 * @param {object} data user information
 * @param {object} data.userId user id which will be used to get user information
*/
function* handleGetUserData({ data }) {
  const res = yield call(authorizeRequest, getUserData, data)
  if(httpStatuses.SUCCESS.includes(res.status)) {
    // if the api call was succesful, let's change the status according // to that. also setting `loading` as false. 
    yield put(actions.getUserResolved(res.data))
  } else {
    // if the api call wasn't successful, let's set the error in redux /// for refernce.also setting `loading` as false. 
    yield put(actions.getUserRejected(res))
  } 
}

export default function* () {
  // This action `types.GET_USER_INTENT` is also handled in the redux
  // it sets `loading` as true. so we can show some loader when the API call
  // is happening.
  yield takeLatest(types.GET_USER_INTENT, handleGetUserData)
}