CountDown

个人倒计时项目：使用 RN 开发可以同时运行在 iOS 及 Android 上，供大家学习交流

1. 个人开发工具

Macbook Pro + WebStorm + iphone模拟器 + android

2. 如何运行

1. 安装node

    brew install node

    安装完node后建议设置npm镜像以加速后面的过程（或使用科学上网工具）。

    npm config set registry https://registry.npm.taobao.org --global

    npm config set disturl https://npm.taobao.org/dist --global

   

2. 安装React Native的命令行工具（react-native-cli）

    React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务（packager）等任务。

    npm install -g react-native-cli

    

3. 拉取代码

   

4. 运行ios

    在代码根目录下运行:

    npm install

    react-native run-ios

   

5. 运行android

    在代码根目录下运行:

    npm install

    react-native run-android

3. 目录结构

CountDown

    |

    |--android  android工程

    |--ios      ios工程

    |--res           图片等资源文件

    |--node_modules  引用的三方库

    |--package.json  包管理文件

    |--.sketch       sketch设计文件

    |

    |--js

        |--common   通用操作, 配置主题,常量,全局操作

        |--component 组件

        |--net      网络请求(尚未有网络模块)

        |   |--bmob 比目云

        |--routers  路由表

        |--scene    页面文件

        |--startup  启动入口

        |--stores   数据存储类

        |--util     工具类

4. 引用三方组件:

    react-navigation: 导航

    react-native-modal-datetime-picker: 选择时间组件

    react-native-simple-dialogs: dialog组件

    mobx:  简单、可扩展的状态管理

    react-native-root-toast: toast

    react-native-root-siblings: 从根布局添加视图

5. 数据结构

{

    "id": "afasfdascvdf",       // 16位id标示

    "name": 'new year',       //string

    "timestamp": '1516322747974',  //number

    "repeat": 'once',         //enum{'once','everyDay','everyWeek','everyMouth','everyYear'}

    "top": false,           //boolean

    "color":"#000000"         //string

}