Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: latest site updates #2126

Merged
merged 1 commit into from
Apr 20, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 14 additions & 15 deletions docs/installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ If you're new to Javascript or just want a very simple setup to get your feet we
### NPM

```bash
$> npm install mithril --save
$ npm install mithril --save
```

---
Expand All @@ -27,46 +27,45 @@ $> npm install mithril --save

1. Initialize the directory as an npm package
```bash
$> npm init --yes
$ npm init --yes
```

2. install required tools
```bash
$> npm install mithril --save
$> npm install webpack webpack-cli --save-dev
$ npm install mithril --save
$ npm install webpack webpack-cli --save-dev
```

3. Add a "start" entry to the scripts section in `package.json`.
```js
{
// ...
"scripts": {
"start": "webpack src/index.js --output bin/app.js -d --watch"
}
// ...
"scripts": {
"start": "webpack src/index.js --output bin/app.js -d --watch"
}
}
```

3. Create `src/index.js`
4. Create `src/index.js` file.
```js
import m from "mithril";

m.render(document.body, "hello world");
```

4. create `index.html`
5. create `index.html`
```html
<!DOCTYPE html>
<body>
<script src="bin/app.js"></script>
</body>
```

5. run bundler
6. run bundler
```bash
$> npm start
$ npm start
```

6. open `index.html` in a browser
7. open `index.html` in a browser

#### Step by step

Expand Down Expand Up @@ -268,7 +267,7 @@ m.render(document.body, "hello world")
TypeScript type definitions are available from DefinitelyTyped. They can be installed with:

```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
10 changes: 5 additions & 5 deletions docs/integrating-libs.md
Original file line number Diff line number Diff line change
@@ -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).

- [Usage](#usage)
## Example

### Usage
```javascript
var FullCalendar = {

Expand All @@ -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).
// 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
// before applying DOM updates.
// before applying DOM updates.
view: function (vnode) {
return m('div')
},
Expand Down Expand Up @@ -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 changes: 1 addition & 1 deletion docs/learning-mithril.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Learning Mithril
# Learning Resources

Links to Mithril learning content:

Expand Down
9 changes: 5 additions & 4 deletions docs/nav-guides.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,17 @@
- Tutorials
- [Installation](installation.md)
- Getting Started
- [Introduction](index.md)
- [Installation](installation.md)
- [Tutorial](simple-application.md)
- [Learning Resources](learning-mithril.md)
- [Getting Help](support.md)
- Resources
- [JSX](jsx.md)
- [ES6](es6.md)
- [CSS](css.md)
- [Animation](animation.md)
- [Testing](testing.md)
- [Examples](examples.md)
- [Integrating with Other Libraries](integrating-libs.md)
- [Learning Mithril](learning-mithril.md)
- [3rd Party Integration](integrating-libs.md)
- Key concepts
- [Vnodes](vnodes.md)
- [Components](components.md)
Expand Down
2 changes: 1 addition & 1 deletion docs/route.md
Original file line number Diff line number Diff line change
Expand Up @@ -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:

Expand Down
2 changes: 1 addition & 1 deletion docs/support.md
Original file line number Diff line number Diff line change
@@ -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.