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)
}