• 基于create-react-app手脚架创建的项目,使用React.js进行开发App管理平台系统Web前端工程。 做了2年的Android开发,第一次使用react去折腾一个前端项目,如有做得不好的地方,还望纠正。 为什么做一个App管理...
    ## 简介
    > 基于create-react-app手脚架创建的项目,使用React.js进行开发的App管理平台系统Web前端工程。
    
    做了2年的Android开发,第一次使用react去折腾一个前端项目,如有做得不好的地方,还望纠正。
    
    为什么做一个App管理平台系统?因为每次发布App的时候都是用公司N年前开发的一个发布系统,界面难看且落后。所以抽时间想自己也搞一个出来,折腾新的技术也是挺有趣的。
    
    为什么选择React?因为之前我用过纯React Native和干货集中营开放的API开发过一个App应用[GankAndPanyz](https://github.com/panyz/GankAndPanyz),所以还算是熟悉React的语法。
    
    第一次跨岗去尝试前后端分离,嗯!服务端代码也是自己来搞(使用的是Spring+SpringMVC+MyBatis)和MySQL数据库,虽然对一些原理还不是很深入,但是能把系统做了出来,收获还是挺大的。从移动端->前端->后端->全栈工程师,挺进!
    
    [项目源码Github地址](https://github.com/panyz/AppManagerSystem_React)
    
    ## 功能
    1. **登录功能**
    2. **数据统计功能**:App登录统计、App下载统计
    3. **项目管理功能**:项目的添加、编辑、删除、整合了Android、iOS下载二维码
    4. **App管理功能(Android、iOS)**:根据场景App分为正式环境和测试环境进行展示每个App的本地链接下载和二维码下载
    5. **版本发布功能**:根据对应的手机系统上传安装包和相应的信息进行版本发布
    
    ## 使用到的第三方框架
    - ant design of react:UI框架
    - react-router:路由框架
    - fetch: 网络请求框架
    - moment:日期处理框架
    - rechart:图表框架
    - qrcode.react 二维码框架
    - crypto-js:加密解密框架
    
    ## 截图
    ![login](https://upload-images.jianshu.io/upload_images/2355123-de190f26d93b8217.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    
    ![datastatistics1](https://upload-images.jianshu.io/upload_images/2355123-aff1a91cb3da2dfe.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    
    ![datastatistics2](https://upload-images.jianshu.io/upload_images/2355123-a78ec17af295b6e6.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    
    ![projectlist](https://upload-images.jianshu.io/upload_images/2355123-3f67216176c47a8c.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    
    ![appmanager](https://upload-images.jianshu.io/upload_images/2355123-cf3ea9351db97b45.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    
    ![version](https://upload-images.jianshu.io/upload_images/2355123-54d434aa04cc5cfe.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    
    
    
    
    
    展开全文
  • React Native 开发APP(一) 2018-08-08 15:49:54
    等等,在这里我必须强调,RN开发有两种模式,一是原生Android/IOS混合起来的开发(这种开发目前在国内,从事的比较多),二是CRNA(create react native app)模式开发,也就是利用脚手架生产项目模板。【国内市场对...
  • React-混合移动App开发介绍 2020-04-15 16:23:35
    了解混合移动App开发的相关背景 了解项目开发流程 了解三大框架 什么是混合移动App开发? 苹果系统中的软件是如何被开发出来的:使用OC或者swift。 安卓平台中的软件是如何被开发出来的:使用安卓相关的...
  • 简介:Hybrid App(混合模式移动应用)开发是指介于Web-app、Native-App这...很多人都知道,React Native 是 Facebook 开源的框架,可以直接 Javascript 开发原生的APP,本文则会围绕开发中的具体实践问题进行讨论。
  • 目录 1. React Native简介 ... 1.2 为什么要使用React Native开发  1.3 环境搭建  1.4 基础开发工具与调试 2. React Native 开发基础  2.1 flexbox 布局基础知识  2.2.JaveScript 语法基础  2.3 Re
  • 所以,facebook专门出了create-react-app命令,用于react项目开发环境的构建! create-react-app是基于webpack+ES6创建的。 2、如何使用。 依次在命令行执行以下命令就能完成项目的构建。 cnpm install -g ...
  • react native 开发app视频教 2020-07-08 23:30:56
    react native 开发app视频教
  • React Nactive混合APP开发 2018-11-08 16:15:11
    React Nactive混合APP开发教程,该课程主要教大家如何利用react Nactive 构建一个APP,详细介绍各个APP中各个组件的用法及使用
  • 本笔记主要记录使用create-react-app一步步完善react移动端框架的过程,包括引入react-router、redux、redux、less、antd等。点项目源码查看具体细节。 1、项目初始化: npm install -g create-react-app // ...
  • React开发过程中会使用大量node.js提供的各种库(就像Java开发需要使用大量的jar包一样),我们在开发Java程序时使用Maven来管理开发过程中使用的jar包,相应的在开发React程序时我们需要使用npm (这里给个npm的全称...
  • React Native 充分利用了 Facebook 的现有轮子,是一个很优秀的集成作品,使用 RN 即可做到无需编译就能远程热更新 App,再加上友好的开发方式、快到爆炸的开发效率、RN 已经完爆了其他的 App 开发方式,即使是一个...
  • 如何使用 create-react-app 快速构建 React 开发环境 create-react-app 是来自于 Facebook,通过该命令我们无需配置就能快速构建 React 开发环境。 create-react-app 自动创建的项目是基于 Webpack + ES6 。 执行...
  • 在create-react-app这个脚手架出来之前,大家都是webpack + es6来结合react来开发项目的,不过这样需要自己配置一大堆东西,对刚接触react的同学比较麻烦,有了create-react-app之后再进行react开发就变得非常方便...
  • create-react-app:来自 Facebook官方的零配置命令行工具 create-react-app 是来自于 Facebook 出品的零配置命令行工具,...安装 create-react-app 的方式也非常简单,可以直接使用npm命令进行全局安装。 npm install -g
  • 1.什么是React.js React.js 是 Facebook 推出的一个用来构建用户界面的 JavaScript 库。 React 中,把一切东西都看成组件,而且所有组件有其状态。什么是状态?简单来说,一个组件有多种有限的状态,但同时只能是...
  • (1)npm命令进行全局安装create-react-app npm install -g create-react-app (2)创建react项目 create-react-app my-app cd my-app 生成my-app项目的目录结构 my-app/   README.md   ...
  • Create React App npx create-react-app my-react-app npx on the first line is not a typo — it’s a package runner tool that comes with npm 5.2+. 国内下载太慢,也可以使用淘宝定制的 cnpm 进行安装。 ...
  • 大家都是webpack + es6来结合react开发前端应用。 这个时候,我们可以手动使用npm来安装各种插件,来从头到尾自己搭建环境。 比如: npm install react react-dom --save npm install babel babel-loa...
  • 黄豆仔短视频APP-一个由react native 开发app
1 2 3 4 5 ... 20
收藏数 44,262
精华内容 17,704