This is an automated email from the ASF dual-hosted git repository.
zshshr pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-weex-site.git
The following commit(s) were added to refs/heads/master by this push:
new 278ff3b improve grammar and sentence mechanics/structure in the guide
new c1731c6 Merge pull request #312 from
kjleitz/improve-grammatical-mechanics-in-readme
278ff3b is described below
commit 278ff3b461a3c2d8aacdf0f808310656107512e8
Author: Keegan Leitz <[email protected]>
AuthorDate: Sat Jan 26 00:18:54 2019 -0500
improve grammar and sentence mechanics/structure in the guide
---
source/guide/index.md | 66 +++++++++++++++++++++++++--------------------------
1 file changed, 33 insertions(+), 33 deletions(-)
diff --git a/source/guide/index.md b/source/guide/index.md
index 9a97874..7dab9aa 100644
--- a/source/guide/index.md
+++ b/source/guide/index.md
@@ -12,27 +12,27 @@ version: 2.1
> **Weex is a framework for building high-performance mobile applications with
> a modern web development experience.**
-Weex enables developers to use modern web development experience to build
Android, iOS, and web apps with a single codebase. In practice, you can use
JavaScript and modern front-end frameworks to develop mobile apps after
integrating the WeexSDK.
+Weex enables developers to use a modern web development experience to build
Android, iOS, and web apps with a single codebase. In practice, you can use
JavaScript and modern front-end frameworks to develop mobile apps after
integrating the WeexSDK.
-The structure of Weex is decoupled: the render engines are separated from the
syntax layer. Weex does not rely on any specific front-end framework; however,
Weex mainly supports [Vue.js](https://vuejs.org/) and
[Rax](https://alibaba.github.io/rax/).
+The structure of Weex is decoupled; the render engines are separated from the
syntax layer. Weex does not rely on any specific front-end framework, but it
does mainly support [Vue.js](https://vuejs.org/) and
[Rax](https://alibaba.github.io/rax/).
-Another primary goal of Weex is to keep up with modern development
technologies and platform capabilities both for web and native. Productivity
and performance can coexist in Weex. Writing Weex pages feels the same as
writing web pages. In fact, rendering Weex pages is the same as rendering
native pages.
+A primary goal of Weex is to keep up with modern development technologies and
platform capabilities, both for web and native applications. Productivity and
performance can coexist in Weex. Writing Weex pages feels the same as writing
web pages. In fact, rendering Weex pages is the same as rendering native pages.
## Overview
-If you just want to try Weex, you do not need to install anything. There is an
[online playground](http://dotwe.org/vue/) for Weex wherein you can write
single page examples without any installation or configuration. The source code
should be written in Vue.js [single file
component](https://vuejs.org/v2/guide/single-file-components.html) syntax (also
known as the `*.vue` files), and the rendered result from editor pane will be
displayed in a mock phone shell.
+If you just want to try Weex, you do not need to install anything. There is an
[online playground](http://dotwe.org/vue/) for Weex wherein you can write
single page examples without any installation or configuration. The source code
should be written in Vue.js [single file
component](https://vuejs.org/v2/guide/single-file-components.html) syntax (also
known as `*.vue` files), and the rendered result from editor pane will be
displayed in a mock phone shell.
Here is an [example](http://dotwe.org/vue/8da01827631b21150a12dd54d7114380)
written in Weex and Vue.js:
-This example renders a word "Yo" in the center of the screen. If you want to
preview the rendered result on a mobile device, you need to install the [Weex
playground app](/tools/playground.html), or integrate Weex SDK into your own
app and scan your page's QR code with your playground app or your own app (with
the QR scan feature to load scanned URL with Weex SDK). Thereafter, you will
see the rendered result on your device.
+This example renders the word "Yo" in the center of the screen. If you want to
preview the rendered result on a mobile device, either install the [Weex
playground app](/tools/playground.html) or integrate the Weex SDK into your own
app, then scan your page's QR code with the app. This will load the URL with
the Weex SDK.
-Within the `<template>` of the source code, you will notice the `<div>`
element, which is widely used on the web, and is also the generic container in
Weex. The `<text>` component, however, is provided by Weex and is a block-level
text container.
+Within the `<template>` node in the source code, you will notice the `<div>`
element—this generic HTML element also serves as the generic "container"
element in Weex. The `<text>` component, however, is provided by Weex and is a
block-level text container.
-> The raw text node can only be placed in the `<text>` component, otherwise,
it will be ignored.
+> A raw text node can only be placed in a `<text>` component. Otherwise, it
will be ignored.
-Within the `<style>` tag, you can write CSS to describe the styles of a
component, and those styles are
[**scoped**](https://vue-loader.vuejs.org/en/features/scoped-css.html) forcibly
in Weex.
+Within the `<style>` tag, you can write CSS to describe the styles of a
component. Those styles are
[**scoped**](https://vue-loader.vuejs.org/en/features/scoped-css.html) forcibly
in Weex.
### Native Components
@@ -40,9 +40,9 @@ In the example above, the `<div>` and the `<text>` elements
are rendered into co
-Weex implements render engines both on iOS and Android and provides a group of
[built-in components](../references/components/) for basic usage. Based on
these components, you can compose and wrap more custom components.
+Weex implements render engines both on iOS and Android. It also provides a
group of [built-in components](../references/components/) for basic usage. You
can compose and wrap custom components using these basic components.
-Although the components in Weex look like HTML tags, you are not able to use
all of them, instead, you can only use the built-in components and your custom
components.
+**Note:** Although the components in Weex may **look** like HTML tags, you are
not able to use the full suite of HTML elements; you are restricted to built-in
components and your custom components.
Behind the scenes, Weex uses native widgets. Although Weex emphasizes
consistency on each mobile platform, we still embrace the platform's own
behavior and UI differences. For example, [the `<switch>`
component](http://dotwe.org/vue/d96943452b6708422197c47920903823) may look
different on Android and iOS (the appearance on the web simulates iOS).
@@ -52,9 +52,9 @@ If you want to use additional native components, other than
the built-in compone
### Native Modules
-For those features that do not rely on the UI, Weex wraps them into
**modules**. You can use `weex.requireModule('xxx')` to require them. Weex
modules provide easy access to native capabilities in JavaScript, such as
network, storage, clipboard, and navigator. For example, you can [use `stream`
module to fetch the star count of
Vue.js](http://dotwe.org/vue/2ae062b6a04124a35bbe2da3b1e5c07b).
+For those features that do not rely on the UI, Weex wraps them into
**modules**. You can use `weex.requireModule('xxx')` to require them. Weex
modules provide easy access to native capabilities in JavaScript, such as
network, storage, clipboard, and navigator. For example, you can [use the
`stream` module to fetch the star count of
Vue.js](http://dotwe.org/vue/2ae062b6a04124a35bbe2da3b1e5c07b).
-Similarly, Weex provides a group of [built-in modules](../references/modules/)
for basic usage, and supports the integration of the existing native modules
into the Weex platform.
+Similarly, Weex provides a group of [built-in modules](../references/modules/)
for basic usage, and supports the integration of existing native modules into
the Weex platform.
Here are some documents about how to extend native components and native
modules for Weex:
@@ -66,15 +66,15 @@ Here are some documents about how to extend native
components and native modules
Yes, Weex can build for Android, iOS, and Web apps from a single codebase.
-Using the same source code across different platforms can dramatically
increase development productivity and simplify the testing, building, and
publishing processes. On this basis, Weex can combine the front-end's packaging
and testing process with the mobile's publishing and monitoring system to
improve development efficiency.
+Using the same source code across different platforms improves development
productivity, simplifies testing, and streamlines building and publishing. Weex
combines front-end packaging and testing processes with those of mobile
publishing and monitoring, dramatically improving development efficiency.
> You can read _[How it works](../wiki/index.html)_ and _[Design
> Principles](../wiki/design-principles.html)_ to know more about the
> technologies and ideas behind Weex.
-Although Weex uses a single codebase, you can still write platform specific
code. Weex provides `weex.config.env` and `WXEnvironment` (they are strictly
equal) to get the current runtime environment. You can use
`WXEnvironment.platform` to determine which platform the code is running on.
Except for the _platform_, `WXEnvironment` contains other information
pertaining to environment, such as _osVersion_ and _deviceModel_. Refer to
_[Weex variable](../references/weex-variable.html)_ for th [...]
+Although Weex uses a single codebase, you can still write platform specific
code. Weex provides `weex.config.env` and `WXEnvironment` (they are strictly
equal) to get the current runtime environment. You can use
`WXEnvironment.platform` to determine which platform the code is running on.
Apart from the _platform,_ `WXEnvironment` contains other information
pertaining to environment, such as _osVersion_ and _deviceModel_. Refer to
_[Weex variable](../references/weex-variable.html)_ for th [...]
## Support For Multiple Front-End Frameworks
-Front-end frameworks are the syntax layer of Weex; therefore, they are
decoupled from native render engines. Weex does not bind with any specific
front-end frameworks, instead, Weex brings native capabilities to the front-end.
+Front-end frameworks are the syntax layer of Weex; therefore, they are
decoupled from native render engines. Weex does not bind with any specific
front-end frameworks. Instead, Weex brings native capabilities to the front-end.
Weex supports [Vue.js](https://vuejs.org/) and
[Rax](https://alibaba.github.io/rax/) as its internal front-end frameworks.
@@ -83,21 +83,21 @@ Weex supports [Vue.js](https://vuejs.org/) and
[Rax](https://alibaba.github.io/r
- **Vue.js** is a progressive front-end framework for building user interfaces.
- **Rax** is a front-end framework with React-compatible APIs.
-> Vue.js and Rax are already integrated into Weex SDK, you don't need to
require them manually.
+> Vue.js and Rax are already integrated into Weex SDK, so you don't need to
require them manually.
-However, Vue and Rax are not the only options. It is entirely possible to
integrate your favorite front-end framework into Weex! There is a document
_[Extend JS Framework](./extend-js-framework.html)_ that describes how to
integrate a different front-end framework, the process, however, is still
complicated and tricky. You need to understand many underlying details about
the js-native bridge and native render engines in order to successfully
integrate an alternate front-end framework.
+However, Vue and Rax are not the only options. It is entirely possible to
integrate your favorite front-end framework into Weex! The document _[Extend JS
Framework](./extend-js-framework.html)_ describes how to integrate a different
front-end framework. The process, however, is still complicated. You need to
understand many underlying details about the js-native bridge and native render
engines in order to successfully integrate an alternate front-end framework.
-You can read _[Front-End Frameworks](./front-end-frameworks.html)_ for more
details.
+Read _[Front-End Frameworks](./front-end-frameworks.html)_ for more details.
## Create Your Own App
-> The following steps assume basic knowledge of Node.js and npm. If you are
not familiar with them, you can visit
[https://docs.npmjs.com/](https://docs.npmjs.com/) to learn more about npm, and
[https://nodejs.org/en/docs/](https://nodejs.org/en/docs/) to learn more about
Node.js.
+> The following steps assume basic knowledge of Node.js and npm. If you are
not familiar, you can visit [https://docs.npmjs.com/](https://docs.npmjs.com/)
to learn more about npm, and
[https://nodejs.org/en/docs/](https://nodejs.org/en/docs/) to learn more about
Node.js.
-Weex provides a command line tool, the [weex-toolkit](/tools/toolkit.html), to
help developers get start easily. The CLI can help you create a starter
project, setup iOS and Android development environments, debug, install
plugins, and so on.
+Weex provides a command line tool, the [weex-toolkit](/tools/toolkit.html), to
help developers get started more easily. The CLI can help you create a starter
project, set up iOS and Android development environments, debug, install
plugins, and so on.
-Currently, the `weex-toolkit` only supports the creation of Vue.js project.
The `rax-cli` may be helpful if you want to use Rax. Please visit [Rax's
official website](https://alibaba.github.io/rax/) for more details.
+Currently, `weex-toolkit` only supports the creation of Vue.js projects. The
`rax-cli` may be helpful if you want to use Rax. Please visit [Rax's official
website](https://alibaba.github.io/rax/) for more details.
-### Set up
+### Setup
With [Node.js](https://nodejs.org/) installed, install `weex-toolkit` CLI
globally.
@@ -124,24 +124,24 @@ npm install
npm start
```
-`npm start` will start a web server on port `8081`. Open
`http://localhost:8081` in your browser of choice to see the rendered result of
your Weex app. The source code is located in `src/` folder. You can develop it
as a normal Vue.js project.
+`npm start` will start a web server on port `8081`. Open
`http://localhost:8081` in your browser of choice to see the rendered result of
your Weex app. The source code is located in the `src/` directory. You can
develop it as a normal Vue.js project.
-Additionally, you can open `http://localhost:8081/web/preview.html` to preview
the rendered result on the web in an iframe. You can also scan the QR code
generated on the right using the [Weex playground app](/tools/playground.html)
to see the rendered result on the mobile device.
+Additionally, you can open `http://localhost:8081/web/preview.html` to preview
the rendered result on the web in an iframe. You can also scan the QR code
generated on the right using the [Weex playground app](/tools/playground.html)
to see the rendered result on a mobile device.
### Build and Run
-By default, the `weex create` command doesn't create the iOS and Android
project, but you can use `weex platform add` to add them.
+By default, the `weex create` command doesn't create an iOS or Android
project, but you can use `weex platform add` to add them.
```bash
-weex platform add ios
-weex platform add android
+weex platform add ios # for iOS
+weex platform add android # for Android
```
Depending on your network environment, it may take a while to add them. Please
be patient.
-In order to develop the app on your local machine, you need to set up a mobile
development environment. For iOS, you should install
[Xcode](https://developer.apple.com/xcode/). For Android, you should install
[Android Studio](https://developer.android.com/studio/index.html). When the
development environment is ready, run the commands below to launch your app on
the simulator or the device.
+In order to develop the app on your local machine, you need to set up a mobile
development environment. For iOS, you should install
[Xcode](https://developer.apple.com/xcode/). For Android, you should install
[Android Studio](https://developer.android.com/studio/index.html). When the
development environment is ready, run the commands below to launch your app on
the simulator or on the device.
```bash
weex run ios
@@ -151,25 +151,25 @@ weex run web
### Debug
-The `weex-toolkit` can also be used to debug your mobile apps. Just run:
+`weex-toolkit` can also be used to debug your mobile apps. Just run:
```bash
weex debug
```
-`weex debug` will start a debug server and open a web page in Chrome (only
support V8 engine). For more technical details of `weex-toolkit`, please refer
to the [toolkit document](../tools/toolkit.html).
+Running `weex debug` will start a debug server and open a web page in Chrome
(only supports the V8 engine). For technical details on `weex-toolkit`, please
refer to the _[toolkit document](../tools/toolkit.html)_.
## Next Steps
At this point, you should have a general understanding of Weex. The next step
is to explore and try the advanced features of Weex.
-If you want to use weex right now:
+If you want to use Weex right now:
- [Integrate Weex to Your Existing App](./integrate-to-your-app.html)
- [Set up Development Environment](./set-up-env.html)
- [References](../references/)
-If you want to know the technologies and ideas behind Weex:
+If you want to know more about the technologies and ideas behind Weex:
- [How it Works](../wiki/index.html)
- [Design Principles](../wiki/design-principles.html)
@@ -180,4 +180,4 @@ After getting acquainted with Weex, if you want to
contribute to make it even be
- [Development Process](../development-process.html)
- [How to Contribute](../contributing.html)
-Considering that Weex is a cross-stack technology, fundamental knowledge of
front-end development, Vue.js, iOS, and Android would be especially helpful.
+Considering that Weex is a cross-stack technology, fundamental knowledge of
front-end development, Vue.js, iOS, and Android will be especially helpful when
contributing.
