vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

docs: latest site updates (#2126)

Browse source
This commit is contained in:
Pat Cavit 2018-04-20 08:36:08 -07:00 • committed by GitHub
parent 6fb77b7771
commit c335aa70ca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 27 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

29
docs/installation.md
View file

@ -18,7 +18,7 @@ If you're new to Javascript or just want a very simple setup to get your feet we
### NPM ### NPM
```bash ```bash
$> npm install mithril --save $ npm install mithril --save
``` ```
--- ---
@ -27,33 +27,32 @@ $> npm install mithril --save
1. Initialize the directory as an npm package 1. Initialize the directory as an npm package
```bash ```bash
$> npm init --yes $ npm init --yes
``` ```
2. install required tools 2. install required tools
```bash ```bash
$> npm install mithril --save $ npm install mithril --save
$> npm install webpack webpack-cli --save-dev $ npm install webpack webpack-cli --save-dev
``` ```
3. Add a "start" entry to the scripts section in `package.json`. 3. Add a "start" entry to the scripts section in `package.json`.
```js ```js
{ {
// ... // ...
"scripts": { "scripts": {
"start": "webpack src/index.js --output bin/app.js -d --watch" "start": "webpack src/index.js --output bin/app.js -d --watch"
} }
} }
``` ```
3. Create `src/index.js` 4. Create `src/index.js` file.
```js ```js
import m from "mithril"; import m from "mithril";
m.render(document.body, "hello world"); m.render(document.body, "hello world");
``` ```
4. create `index.html` 5. create `index.html`
```html ```html
<!DOCTYPE html> <!DOCTYPE html>
<body> <body>
@ -61,12 +60,12 @@ m.render(document.body, "hello world");
</body> </body>
``` ```
5. run bundler 6. run bundler
```bash ```bash
$> npm start $ npm start
``` ```
6. open `index.html` in a browser 7. open `index.html` in a browser
#### Step by step #### Step by step
@ -268,7 +267,7 @@ m.render(document.body, "hello world")
TypeScript type definitions are available from DefinitelyTyped. They can be installed with: TypeScript type definitions are available from DefinitelyTyped. They can be installed with:
```bash ```bash
$> npm install @types/mithril --save-dev $ npm install @types/mithril --save-dev
``` ```
For example usage, to file issues or to discuss TypeScript related topics visit: https://github.com/MithrilJS/mithril.d.ts For example usage, to file issues or to discuss TypeScript related topics visit: https://github.com/MithrilJS/mithril.d.ts

10
docs/integrating-libs.md
View file

@ -1,9 +1,9 @@
# Integrating with Other Libraries # 3rd Party Integration
Integration with third party libraries or vanilla javascript code can be achieved via [lifecycle methods](lifecycle-methods.md). Integration with third party libraries or vanilla javascript code can be achieved via [lifecycle methods](lifecycle-methods.md).
- [Usage](#usage) ## Example
### Usage
```javascript ```javascript
var FullCalendar = { var FullCalendar = {
@ -19,7 +19,7 @@ var FullCalendar = {
// Consider that the lib will modify this parent element in the DOM (e.g. add dependent class attribute and values). // Consider that the lib will modify this parent element in the DOM (e.g. add dependent class attribute and values).
// As long as you return the same view results here, mithril will not // As long as you return the same view results here, mithril will not
// overwrite the actual DOM because it's always comparing old and new VDOM // overwrite the actual DOM because it's always comparing old and new VDOM
// before applying DOM updates. // before applying DOM updates.
view: function (vnode) { view: function (vnode) {
return m('div') return m('div')
}, },
@ -54,4 +54,4 @@ m.mount(document.body, {
``` ```
Running example [flems: FullCalendar](https://flems.io/#0=N4IgZglgNgpgziAXAbVAOwIYFsZJAOgAsAXLKEAGhAGMB7NYmBvAHigjQGsACAJxigBeADog4xAJ6w4hGDGKjuhfmBEgSxAA5xEAel3UAJmgBWcfNSi0ArobBQM-C7Sy6MJjAA9d7AEZxdMGsoKGoMWDRDR10AZnwAdnwABkDg0PCmKN58LA4LODhRAD4QAF8KdGxcRAIzShp6RmYagDdHbgAxNIBhDMj2wW5gYTQR4WJ6an4MRkRuILRqYgh6bgAKFrRaQxgASiGxhWI6NDhaWHwrAHM1gHIukN6oft5EREnpxlvdw-GAEg2Wx2+EMLl2+CCjz6WTWw1GR3G+m4mmsxG4EhsvG4HAgy3C3FommW9Dg3AwkW4YRCvgw1E4pNk-F+xFKP1G8PGAHlfCYYEt8BgChArmhAdsYALiMReOZNI4mMQAMrEGYwChDSFQJ6ZRwAUSgc024pBLlZh3KY3hLQgMAA7nMFksVmh1kadvs4eNxvxiNZeC6sHdDBAWt9zRRLeN6L4YGBaPx+FhaC0YA7rItiS6xe6DhziEiAErpsloCTcHbiXi0Mu6SmwcnWTTcHDEQjbBkwJzM-QAt0S8SqiE9aF6qDgzXal5B+DS6th+GlEaL9lYHI2BhrUHUaw4Bj4XzbCTqz3Ea12tMZ52uoF7XNe6XyP0u5DM8aB26EACMt3Vt0nWW+CM8zfNYHi1EdeGPOV+AYZVVUNG98AHRhWSA+8QNuXxUQmNAfzvBEjkmdg6TmTR+BaV8WV-ABZXFlGgbgACFsNWABaQDKPfLCpXoPCT3QnDLAgEjuDQGBPAUYCqO4W5aNbXgGOYniXQAannZkAF1IyOR1M1E8TiDWD1KN7RDkIlCcIP1cdhwiGFbjEiT1KOZdmV0q8yJgFojPw+9TONcyhyhOzRxs4KdV4O5PNDNl71chdLVZMoKhATAcDwfIECoE4mmIPAyg0qh2C4BAUEqdKalyeToHqP1yBqDRtD0XR000TgrmcVwqvoqAAAFP3wAaAFZdG6hSoHwOoqEkTRqhAOpynKuak13PKqDqvBGp0fRWvazrRpcBVeoAJkGgBOfBjoO1bJqykAZrmhaUrSx6AEdrE7CRat4er1ClJqdrQNqOroVwTHez7eriU7P10YNxF0cGPt4CRbvqB68Cepa8E1KkIu+36tua3aQZcVIQjxl4oYSZI4YgBHcYgtHpokWbMYQUoNNKIA) Running example [flems: FullCalendar](https://flems.io/#0=N4IgZglgNgpgziAXAbVAOwIYFsZJAOgAsAXLKEAGhAGMB7NYmBvAHigjQGsACAJxigBeADog4xAJ6w4hGDGKjuhfmBEgSxAA5xEAel3UAJmgBWcfNSi0ArobBQM-C7Sy6MJjAA9d7AEZxdMGsoKGoMWDRDR10AZnwAdnwABkDg0PCmKN58LA4LODhRAD4QAF8KdGxcRAIzShp6RmYagDdHbgAxNIBhDMj2wW5gYTQR4WJ6an4MRkRuILRqYgh6bgAKFrRaQxgASiGxhWI6NDhaWHwrAHM1gHIukN6oft5EREnpxlvdw-GAEg2Wx2+EMLl2+CCjz6WTWw1GR3G+m4mmsxG4EhsvG4HAgy3C3FommW9Dg3AwkW4YRCvgw1E4pNk-F+xFKP1G8PGAHlfCYYEt8BgChArmhAdsYALiMReOZNI4mMQAMrEGYwChDSFQJ6ZRwAUSgc024pBLlZh3KY3hLQgMAA7nMFksVmh1kadvs4eNxvxiNZeC6sHdDBAWt9zRRLeN6L4YGBaPx+FhaC0YA7rItiS6xe6DhziEiAErpsloCTcHbiXi0Mu6SmwcnWTTcHDEQjbBkwJzM-QAt0S8SqiE9aF6qDgzXal5B+DS6th+GlEaL9lYHI2BhrUHUaw4Bj4XzbCTqz3Ea12tMZ52uoF7XNe6XyP0u5DM8aB26EACMt3Vt0nWW+CM8zfNYHi1EdeGPOV+AYZVVUNG98AHRhWSA+8QNuXxUQmNAfzvBEjkmdg6TmTR+BaV8WV-ABZXFlGgbgACFsNWABaQDKPfLCpXoPCT3QnDLAgEjuDQGBPAUYCqO4W5aNbXgGOYniXQAannZkAF1IyOR1M1E8TiDWD1KN7RDkIlCcIP1cdhwiGFbjEiT1KOZdmV0q8yJgFojPw+9TONcyhyhOzRxs4KdV4O5PNDNl71chdLVZMoKhATAcDwfIECoE4mmIPAyg0qh2C4BAUEqdKalyeToHqP1yBqDRtD0XR000TgrmcVwqvoqAAAFP3wAaAFZdG6hSoHwOoqEkTRqhAOpynKuak13PKqDqvBGp0fRWvazrRpcBVeoAJkGgBOfBjoO1bJqykAZrmhaUrSx6AEdrE7CRat4er1ClJqdrQNqOroVwTHez7eriU7P10YNxF0cGPt4CRbvqB68Cepa8E1KkIu+36tua3aQZcVIQjxl4oYSZI4YgBHcYgtHpokWbMYQUoNNKIA)

2
docs/learning-mithril.md
View file

@ -1,4 +1,4 @@
# Learning Mithril # Learning Resources
Links to Mithril learning content: Links to Mithril learning content:

9
docs/nav-guides.md
View file

@ -1,7 +1,9 @@
- Tutorials - Getting Started
- [Installation](installation.md)
- [Introduction](index.md) - [Introduction](index.md)
- [Installation](installation.md)
- [Tutorial](simple-application.md) - [Tutorial](simple-application.md)
- [Learning Resources](learning-mithril.md)
- [Getting Help](support.md)
- Resources - Resources
- [JSX](jsx.md) - [JSX](jsx.md)
- [ES6](es6.md) - [ES6](es6.md)
@ -9,8 +11,7 @@
- [Animation](animation.md) - [Animation](animation.md)
- [Testing](testing.md) - [Testing](testing.md)
- [Examples](examples.md) - [Examples](examples.md)
- [Integrating with Other Libraries](integrating-libs.md) - [3rd Party Integration](integrating-libs.md)
- [Learning Mithril](learning-mithril.md)
- Key concepts - Key concepts
- [Vnodes](vnodes.md) - [Vnodes](vnodes.md)
- [Components](components.md) - [Components](components.md)

2
docs/route.md
View file

@ -475,7 +475,7 @@ m.route(document.body, "/", {
}) })
``` ```
Note that in this case, if the Layout component the `oninit` and `oncreate` lifecycle methods would only fire on the Layout component on the first route change (assuming all routes use the same layout). Note that in this case, if the Layout component has `oninit` and `oncreate` lifecycle methods, they would only fire on the first route change (assuming all routes use the same layout).
To clarify the difference between the two examples, example 1 is equivalent to this code: To clarify the difference between the two examples, example 1 is equivalent to this code:

2
docs/support.md
View file

@ -1,3 +1,3 @@
## Getting Help # Getting Help
Mithril has an active & welcoming community on [Gitter](https://gitter.im/mithriljs/mithril.js), or feel free to ask questions on [Stack Overflow](https://stackoverflow.com/questions/tagged/mithril.js) using the `mithril.js` tag. Mithril has an active & welcoming community on [Gitter](https://gitter.im/mithriljs/mithril.js), or feel free to ask questions on [Stack Overflow](https://stackoverflow.com/questions/tagged/mithril.js) using the `mithril.js` tag.