mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[DOC] readme: add a tag line, improve readme
This commit is contained in:
@@ -1,31 +1,34 @@
|
|||||||
<h1 align="center">🦉 <a href="https://odoo.github.io/owl/">Odoo Web Library</a> 🦉</h1>
|
<h1 align="center">🦉 <a href="https://odoo.github.io/owl/">Odoo Web Library</a> 🦉</h1>
|
||||||
|
|
||||||
|
_A web framework for structured, dynamic and maintainable applications_
|
||||||
|
|
||||||
## Project Overview
|
## Project Overview
|
||||||
|
|
||||||
The Odoo Web Library (OWL) is a small
|
The Odoo Web Library (OWL) is a small
|
||||||
UI framework intended to be the basis for the [Odoo](https://www.odoo.com/) Web Client, and hopefully many
|
UI framework intended to be the basis for the [Odoo](https://www.odoo.com/) Web Client, and hopefully many
|
||||||
other Odoo related projects. OWL's main feature is a _declarative component system_, with QWeb as a template engine, asynchronous rendering, and an underlying virtual dom.
|
other Odoo related projects. OWL's main feature is a _declarative component system_, with QWeb as a template engine, asynchronous rendering, and an underlying virtual dom.
|
||||||
|
|
||||||
If you are interested, you can find a discussion on what makes OWL different
|
**Try it online!** An online playground is available at [https://odoo.github.io/owl/playground](https://odoo.github.io/owl/playground) to let you experiment with the OWL framework.
|
||||||
from React and Vue [here](doc/comparison.md)
|
|
||||||
|
|
||||||
## What makes OWL different
|
## OWL's design principles
|
||||||
|
|
||||||
|
OWL is designed to be used in highly dynamic applications where changing
|
||||||
|
requirements are common, code needs to be maintained by large teams.
|
||||||
|
|
||||||
- **XML based**: templates are based on the XML format, which allows interesting
|
- **XML based**: templates are based on the XML format, which allows interesting
|
||||||
applications. For example, they could be stored in a database and modified
|
applications. For example, they could be stored in a database and modified
|
||||||
dynamically with `xpaths`.
|
dynamically with `xpaths`.
|
||||||
- **templates compilation in the browser**: this may not be a good fit for all
|
- **templates compilation in the browser**: this may not be a good fit for all
|
||||||
applications, but if you need to generate dynamically user interfaces in the
|
applications, but if you need to generate dynamically user interfaces in the
|
||||||
browser, this is very powerful. For example, a generic form view component
|
browser, this is very powerful. For example, a generic form view component
|
||||||
could generate a specific form user interface for each various models, from a XML view.
|
could generate a specific form user interface for each various models, from a XML view.
|
||||||
- **no toolchain required**: this is extremely useful for some applications, if,
|
- **no toolchain required**: this is extremely useful for some applications, if,
|
||||||
for various reasons (security/deployment/dynamic modules/specific assets tools),
|
for various reasons (security/deployment/dynamic modules/specific assets tools),
|
||||||
it is not ok to use standard web tools based on `npm`.
|
it is not ok to use standard web tools based on `npm`.
|
||||||
|
|
||||||
|
Owl is not designed to be fast or small (even though it is quite good on those
|
||||||
## Try it online!
|
two topics). If you are interested in a comparison with React or Vue, you will
|
||||||
|
find some more information [here](doc/comparison.md).
|
||||||
An online playground is available at [https://odoo.github.io/owl/playground](https://odoo.github.io/owl/playground) to let you experiment with the OWL framework.
|
|
||||||
|
|
||||||
# Example
|
# Example
|
||||||
|
|
||||||
@@ -46,7 +49,7 @@ class ClickCounter extends owl.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const qweb = new owl.QWeb();
|
const qweb = new owl.QWeb();
|
||||||
const counter = new ClickCounter({qweb});
|
const counter = new ClickCounter({ qweb });
|
||||||
counter.mount(document.body);
|
counter.mount(document.body);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user