React Native Redux Crypto Tracker 项目教程

React Native Redux Crypto Tracker 项目教程

react-native-redux-crypto-tracker💎 Learn how to build a Redux + React Native cryptocurrency app项目地址:https://gitcode.com/gh_mirrors/re/react-native-redux-crypto-tracker

1. 项目的目录结构及介绍

react-native-redux-crypto-tracker/
├── src/
│   ├── actions/
│   ├── components/
│   ├── reducers/
│   ├── store/
│   ├── api.js
│   ├── App.js
├── App.js
├── index.js
├── package.json
├── README.md

• src/：项目的源代码目录。
  • actions/：存放 Redux 的 action 文件。
  • components/：存放 React 组件文件。
  • reducers/：存放 Redux 的 reducer 文件。
  • store/：存放 Redux 的 store 配置文件。
  • api.js：用于与 CoinMarketCap API 进行交互的文件。
  • App.js：主应用组件。
• App.js：React Native 应用的入口文件。
• index.js：React Native 应用的启动文件。
• package.json：项目的依赖和脚本配置文件。
• README.md：项目的说明文档。

2. 项目的启动文件介绍

index.js

import { AppRegistry } from 'react-native';
import App from './App';
import { name as appName } from './app.json';

AppRegistry.registerComponent(appName, () => App);

• index.js 是 React Native 应用的启动文件。
• 它导入 AppRegistry 和主应用组件 App。
• 使用 AppRegistry.registerComponent 方法注册应用组件。

App.js

import React from 'react';
import { Provider } from 'react-redux';
import store from './src/store';
import Main from './src/Main';

const App = () => (
  <Provider store={store}>
    <Main />
  </Provider>
);

export default App;

• App.js 是主应用组件。
• 它使用 Provider 组件将 Redux store 提供给整个应用。
• Main 组件是应用的主要界面。

3. 项目的配置文件介绍

package.json

{
  "name": "react-native-redux-crypto-tracker",
  "version": "1.0.0",
  "scripts": {
    "start": "react-native start",
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "test": "jest"
  },
  "dependencies": {
    "axios": "^0.21.1",
    "react": "17.0.2",
    "react-native": "0.64.2",
    "react-native-vector-icons": "^8.1.0",
    "react-redux": "^7.2.4",
    "redux": "^4.1.0"
  },
  "devDependencies": {
    "jest": "^27.0.6",
    "react-test-renderer": "17.0.2"
  }
}

• package.json 包含了项目的名称、版本、脚本和依赖。
• scripts 部分定义了启动、运行 Android 和 iOS 应用的命令。
• dependencies 部分列出了项目运行所需的依赖包。
• devDependencies 部分列出了开发环境所需的依赖包。

以上是 React Native Redux Crypto Tracker 项目的目录结构、启动文件和配置文件的介绍。希望对你理解和使用该项目有所帮助。

react-native-redux-crypto-tracker💎 Learn how to build a Redux + React Native cryptocurrency app项目地址:https://gitcode.com/gh_mirrors/re/react-native-redux-crypto-tracker