help you build powerful apps like never before)

博客Markdown编辑器上线啦那些年我们追过的Wrox精品红皮计算机图书PMBOK第五版精讲视频教程火星人敏捷开发1001问

Reapp 混合应用 – 帮助构建不曾有过的强大应用(Reapp Hybrid apps – help you build powerful apps like never before)

分类:

否则,,出自本博客的文章拒绝转载或再转载,谢谢合作。

Kitchen SinkHacker News

Try it live

What is it?

React UI Kit

npm Modules

Webpack Build System

Easy CLI

ReappIonicTouchstoneSupersonic

PlatformReactAngularReactAngular

Routingreact-routerAngularAngular

CLI

Docs

AnimationsInteractive JSCSSCSSCSS

Build SystemWebpackGulpGulp

Hot Reload

ThemesCustomizable JSCSSCSSCSS

LayoutFlexboxBlockFlexboxBlock

IconsSVGIcon FontIcon FontIcon Font

ViewsViewsViewsViews

Interactive

Customizable

The UI KitDottedViewListReactDottedViewListList wrapa ListViewpViewDottedViewList

DottedViewLists show Views side-by-side with a dot indicator, just like the Twitter app.

Reapp has NestedViewList and DottedViewList, but you can use the ViewListMixin to make your own.

Lists can automatically wrap an array of items with ListItem components using the wrap property.

What is it?

Reapp is everything you need to build amazing hybrid apps with React: a collection of modules that work together, a UI kit, and our CLI that bootstraps your app and has a pre-configured build server.

Help

Examples

We have two example apps you can check the source to:

Kitchen Sink(demo)Hacker News Reader(demo)Installation

Installation is done through npm, though you can pick and choose any pieces you’d like and roll your own stack. To get the reapp CLI:

npm install -g reapp

Once that’s done you can generate a new base reapp stack with:

reapp new [name]

Where [name] is the name you’d like to give your new stack.

CLI

The CLI has two main functions that it helps you with. The first is creating new apps. For now, it simply makes a bare clone of a repo we keep updated with the current best-practice. The goal is eventually to have a variety of baseline repo’s to choose from.

It also lets you run your app, usingreapp-server, a simple express server that works well with the default app structure.

CLI Usage:

Usage: reapp [options] [command]Commands: new [name] creates a directory with a new reapp-starter scaffold runruns a reapp application with express/webpack-dev-server buildbuilds a reapp application to a bundle in ./build debuguse this to for opening issues! help [cmd] display help for [cmd]Running & Building Reapp

Theruncommand has a few options to help you out. You can do:

Thebuildcommand is used once you’re ready to deploy your app (to either the web or to cordova). For now, we provide two types of builds:

reapp buildtargets the web for mobile sites.reapp build iostargets cordova ios devices.

You also have the same flags available as the run commands, to adjust tools and envs.

When you runreapp buildyou’ll notice a new./buildfolder where your assets have been copied to. We’re working on adding more documentation soon on how to get those assets into a Cordova/Phonegap app.

Structure of your applications

You can see the exact app that’s generated through thereapp-starter repo. Only the/app/app.jsentrypoint and/assets/layout.htmlis "necessary". In the future, we could have a config file to make this completely custom. For now, it’s very simple:

/app /components /theme app.js routes.js/assets layout.html/config (optional)

/app/app.jsis your entry point. Everything in the app folder should be pretty self-explanatory./assetscontains static assets, with alayout.htmlthat is used to serve your app within. In general, you should’t have to touch the layout, even for adding styles.

The/themefolder is(UI Kit)

The next theme we require is the./app/theme.jsfile. reapp-ui has it’s own documentation, but themes are the core of reapp-ui. They have three things they need: constants, styles, and animations. You can just use the included iOS theme, but we’ve included the./app/themefolder as an example of how you can easily customize themes.

而做人的能力则会给你一百种机会。

help you build powerful apps like never before)

相关文章:

你感兴趣的文章:

标签云: