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

rename suffixes from .mdx to .md #2353

Closed
wants to merge 3 commits into from
Closed
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
2 changes: 1 addition & 1 deletion tools/website-test/build.rs
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ struct Level {

fn main() {
let home = env::var("CARGO_MANIFEST_DIR").unwrap();
let pattern = format!("{}/../../website/docs/**/*.mdx", home);
let pattern = format!("{}/../../website/docs/**/*.md", home);
let base = format!("{}/../../website", home);
let base = Path::new(&base).canonicalize().unwrap();
let dir_pattern = format!("{}/../../website/docs/**", home);
Expand Down
16 changes: 14 additions & 2 deletions website/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,20 @@ This command starts a local development server and opens up a browser window. Mo
without having to restart the server.
Note this only builds for English locale unlike a production build.

> Documentation is written in `mdx`, markdown empowered with jsx.
> JetBrains and VSCode both provide MDX plugins.
Documentation is written in `mdx`, a superset of markdown empowered with jsx.
JetBrains and VSCode both provide MDX plugins.

However, we name all our documentation with the `.md` suffix
because our localization tool GitLocalize doesn't support the `.mdx` file extension.
You can still enable `mdx` IDE support by associating the suffix `.md` with mdx
and deleting the original markdown association.

Here's where you can find the settings in JetBrains:

![mdx association in jetbrains](mdx-jetbrains.jpg)

Since mdx is a superset of md, other markdown files will have the correct syntax highlighting, hotkeys, etc.
The only downside is there will be no more live preview of other markdown files.

## Production Build

Expand Down
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -250,3 +250,7 @@ pub fn render_page(with_sidebar: bool) -> Html {
}
}
```
:::note Extra Braces Required
`sidebar = {{html_nested!{...}}}` appears to require one extra set of braces.
This is unintuitive, and we will fix the behavior in a later release. [related issue](https://github.com/yewstack/yew/issues/2267)
:::
Original file line number Diff line number Diff line change
Expand Up @@ -146,4 +146,4 @@ impl Component for ContextDemo {
#### Function components

`use_context` hook is used to consume contexts in function components.
See [docs for use_context](function-components/pre-defined-hooks.mdx#use_context) to learn more.
See [docs for use_context](function-components/pre-defined-hooks.md#use_context) to learn more.
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ implement the `Component` trait.

## Creating function components

The easiest way to create a function component is to add the [`#[function_component]`](./../function-components/attribute.mdx) attribute to a function.
The easiest way to create a function component is to add the [`#[function_component]`](./../function-components/attribute.md) attribute to a function.

```rust
use yew::{function_component, html, Html};
Expand Down Expand Up @@ -43,21 +43,21 @@ actions. Yew comes with a few pre-defined Hooks. You can also create your own.
#### Pre-defined Hooks

Yew comes with the following predefined Hooks:
- [`use_state`](./../function-components/pre-defined-hooks.mdx#use_state)
- [`use_state_eq`](./../function-components/pre-defined-hooks.mdx#use_state_eq)
- [`use_ref`](./../function-components/pre-defined-hooks.mdx#use_ref)
- [`use_mut_ref`](./../function-components/pre-defined-hooks.mdx#use_mut_ref)
- [`use_node_ref`](./../function-components/pre-defined-hooks.mdx#use_node_ref)
- [`use_reducer`](./../function-components/pre-defined-hooks.mdx#use_reducer)
- [`use_reducer_eq`](./../function-components/pre-defined-hooks.mdx#use_reducer_eq)
- [`use_effect`](./../function-components/pre-defined-hooks.mdx#use_effect)
- [`use_effect_with_deps`](./../function-components/pre-defined-hooks.mdx#use_effect_with_deps)
- [`use_context`](./../function-components/pre-defined-hooks.mdx#use_context)
- [`use_state`](./../function-components/pre-defined-hooks.md#use_state)
- [`use_state_eq`](./../function-components/pre-defined-hooks.md#use_state_eq)
- [`use_ref`](./../function-components/pre-defined-hooks.md#use_ref)
- [`use_mut_ref`](./../function-components/pre-defined-hooks.md#use_mut_ref)
- [`use_node_ref`](./../function-components/pre-defined-hooks.md#use_node_ref)
- [`use_reducer`](./../function-components/pre-defined-hooks.md#use_reducer)
- [`use_reducer_eq`](./../function-components/pre-defined-hooks.md#use_reducer_eq)
- [`use_effect`](./../function-components/pre-defined-hooks.md#use_effect)
- [`use_effect_with_deps`](./../function-components/pre-defined-hooks.md#use_effect_with_deps)
- [`use_context`](./../function-components/pre-defined-hooks.md#use_context)

#### Custom Hooks

There are cases where you want to define your own Hooks for reasons. Yew allows you to define your own Hooks which lets you extract your potentially stateful logic from the component into reusable functions.
See the [Defining custom hooks](./../function-components/custom-hooks.mdx#defining-custom-hooks) section for more information.
See the [Defining custom hooks](./../function-components/custom-hooks.md#defining-custom-hooks) section for more information.

## Further reading

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -343,7 +343,7 @@ use_effect_with_deps(

## `use_context`

`use_context` is used for consuming [contexts](../contexts.mdx) in function components.
`use_context` is used for consuming [contexts](../contexts.md) in function components.


### Example
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ Yew integrates with the [`web-sys`](https://rustwasm.github.io/wasm-bindgen/api/
uses the events from that crate. The [table below](#event-types) lists all of the `web-sys`
events that are accepted in the `html!` macro.

You can still add a [`Callback`](../components/callbacks.mdx) for an event that is not listed in the table
You can still add a [`Callback`](../components/callbacks.md) for an event that is not listed in the table
below, see [Manual event listener](#manual-event-listener).

## Event Types
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ The `html!` macro allows you to write HTML and SVG code declaratively. It is sim
**Important notes**

1. The `html!` macro only accepts one root html node (you can counteract this by using
[fragments](./fragments.mdx) or [iterators](./../html/lists.mdx))
[fragments](./fragments.md) or [iterators](./../html/lists.md))
2. An empty `html! {}` invocation is valid and will not render anything
3. Literals must always be quoted and wrapped in braces: `html! { <p>{ "Hello, World" }</p> }`

Expand Down
File renamed without changes.
2 changes: 1 addition & 1 deletion website/docs/concepts/suspense.md
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ fn load_user() -> Option<User> {
todo!() // implementation omitted.
}

fn on_load_user_complete<F: Fn()>(_fn: F) {
fn on_load_user_complete<F: FnOnce()>(_fn: F) {
todo!() // implementation omitted.
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ _[Inheritance in `web-sys` in The `wasm-bindgen` Guide](https://rustwasm.github.
## The `Node` in `NodeRef`

Yew uses a [`NodeRef`](../components/refs) in order to provide a way for keeping a reference to
a `Node` made by the [`html!`](../html/introduction.mdx) macro. The `Node` part of `NodeRef` is referring to
a `Node` made by the [`html!`](../html/introduction.md) macro. The `Node` part of `NodeRef` is referring to
[`web_sys::Node`](https://rustwasm.github.io/wasm-bindgen/api/web_sys/struct.Node.html). The
`NodeRef::get` method will return a `Option<Node>` value, however, most of the time in Yew you want
to cast this value to a specific element so you can use it's specific methods. This casting
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -58,12 +58,12 @@ yew = "0.19"

#### Update main.rs

We need to generate a template which sets up a root Component called `App` which renders a button that updates its value when clicked.
We need to generate a template which sets up a root Component called `Model` which renders a button that updates its value when clicked.
Replace the contents of `src/main.rs` with the following code.

:::note
The line `yew::start_app::<App>()` inside `main()` starts your application and mounts it to the page's `<body>` tag.
If you would like to start your application with any dynamic properties, you can instead use `yew::start_app_with_props::<App>(..)`.
The line `yew::start_app::<Model>()` inside `main()` starts your application and mounts it to the page's `<body>` tag.
If you would like to start your application with any dynamic properties, you can instead use `yew::start_app_with_props::<Model>(..)`.
:::

```rust ,no_run, title=main.rs
Expand Down Expand Up @@ -121,4 +121,4 @@ Trunk will helpfully rebuild your application if you modify any of its files.

You have now successfully setup your Yew development environment, and built your first web application.

Experiment with this application and review the [examples](./examples.mdx) to further your learning.
Experiment with this application and review the [examples](./examples.md) to further your learning.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
44 changes: 44 additions & 0 deletions website/i18n/ja/docusaurus-plugin-content-docs/0.17.3/SUMMARY.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
# Table of contents

* [はじめに](index)

## 始める

* [プロジェクトの準備](getting-started/project-setup)
* [wasm-packを使う](getting-started/project-setup/using-wasm-pack)
* [wasm-bindgenを使う](getting-started/project-setup/using-wasm-bindgen)
* [cargo-webを使う](getting-started/project-setup/using-cargo-web)
* [入門用テンプレート](getting-started/starter-templates)
* [サンプルアプリを作る](getting-started/build-a-sample-app)
* [web-sysかstdweb選ぶ](getting-started/choose-web-library)
* [例から学ぶ](getting-started/examples)

## 基本となる概念 <a id="concepts"></a>

* [html!を使う](concepts/html)
* [リスト](concepts/html/lists)
* [要素](concepts/html/elements)
* [リテラルと式](concepts/html/literals-and-expressions)
* [コンポーネント](concepts/html/components)
* [コンポーネント (Components)](concepts/components)
* [属性 (Properties)](concepts/components/properties)
* [コールバック (Callbacks)](concepts/components/callbacks)
* [参照 (Refs)](concepts/components/refs)
* [Agents](concepts/agents)
* [Services](concepts/services)
* [Format](concepts/services/format)
* [ルータ](concepts/router)

## 高度な内容

* [最適化とベストプラクティス](advanced-topics/optimizations)
* [低レベルなライブラリの中身](advanced-topics/how-it-works)

## 更なる内容

* [CSS](more/css)
* [ロードマップ](more/roadmap)
* [テスト](more/testing)
* [デバッグ](more/debugging)
* [外部ライブラリ](more/external-libs)

44 changes: 0 additions & 44 deletions website/i18n/ja/docusaurus-plugin-content-docs/0.17.3/SUMMARY.mdx

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ impl Component for MyComponent {
}
```

使い方については[`html!`ガイド](html.mdx)をご確認ください。
使い方については[`html!`ガイド](html)をご確認ください。

### Rendered

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ JSX \(HTMLのようなコードをJavaScript内部に書くことができるJav

**重要な注意**

1. `html!`マクロはルートのHTMLノードのみ受け付けます \([フラグメントかイテレータを使う](html/lists.mdx)ことでやり取りできます\)
1. `html!`マクロはルートのHTMLノードのみ受け付けます \([フラグメントかイテレータを使う](html/lists)ことでやり取りできます\)
2. 空の`html! {}`の呼び出しは可能ですが何もレンダリングしません
3. リテラルはクオーテーションがつけられ、ブレースで囲う必要があります: `html! { "Hello, World" }`

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ WebAssemblyとJavaScriptの互換を持たせるために他にツールが必
Rust / Wasm活動チームによって開発されているCLIツールで、WebAssemblyをパッケージ化することができます。
Webpackには[`wasm-pack-plugin`](https://github.com/wasm-tool/wasm-pack-plugin)が最もよく使われています。

[`wasm-pack`で始める](project-setup/using-wasm-pack.mdx)
[`wasm-pack`で始める](project-setup/using-wasm-pack)

### [**`wasm-bindgen`**](https://rustwasm.github.io/docs/wasm-bindgen/)

Expand All @@ -29,14 +29,14 @@ Rust/Wasm活動チームによって開発されているライブラリとCLI
`wasm-bindgen`は手書きのJavaScriptでWebAssemblyのバイナリを使う必要があるため、直接使うのは非推奨です。
しかし、詳細な情報については[**`wasm-bindgen` ガイド**](https://rustwasm.github.io/docs/wasm-bindgen/)から得られます。

[`wasm-bindgen`で始める。](project-setup/using-wasm-bindgen.mdx)
[`wasm-bindgen`で始める。](project-setup/using-wasm-bindgen)

### [**`cargo-web`**](https://github.com/koute/cargo-web)

`wasm-pack`と`wasm-bindgen`を導入する前は好まれたWebワークフローツールです。
`wasm-pack`がサポートされていないサンプルを動かすのにインストールする価値があり、依然として**最もお手軽に**始められる方法です。

[`cargo web`で始める](project-setup/using-cargo-web.mdx)
[`cargo web`で始める](project-setup/using-cargo-web)

### 比較

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ JSX \(HTMLのようなコードをJavaScript内部に書くことができるJav

**重要な注意**

1. `html!`マクロはルートのHTMLノードのみ受け付けます \([フラグメントかイテレータを使う](html/lists.mdx)ことでやり取りできます\)
1. `html!`マクロはルートのHTMLノードのみ受け付けます \([フラグメントかイテレータを使う](html/lists)ことでやり取りできます\)
2. 空の`html! {}`の呼び出しは可能ですが何もレンダリングしません
3. リテラルはクオーテーションがつけられ、ブレースで囲う必要があります: `html! { "Hello, World" }`

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ cargo install wasm-bindgen-cli
## ビルド

はじめに、Wasmファイルを生成するアプリをビルドしましょう。
[サンプルアプリをビルド](../build-a-sample-app.mdx)のアプリをビルドしたいとします。
[サンプルアプリをビルド](../build-a-sample-app)のアプリをビルドしたいとします。
生成されたファイルのパスは`target/wasm32-unknown-unknown/debug/yew-app.wasm`にあるはずです。
もしクレートに何か別の名前をつけた場合、Wasmファイルの名前は`yew-app.wasm`ではなく、`Cargo.toml`ファイルに
`package.name`として名前をつけたものになるでしょう。
Expand All @@ -25,7 +25,7 @@ cargo build --target wasm32-unknown-unknown
コンパイルされたWebAssemblyとJavaScriptのラッパーが入っています。
現在のブラウザは直接WebAssemblyファイルを読み込むことができないため、代わりにJavaScript経由で読み込まれるなければならず、
そのためにこれらのラッパーが必要となります。
[サンプルアプリを作る(../build-a-sample-app.mdx)の例では`static`フォルダにファイルが生成されるようにしており
[サンプルアプリを作る(../build-a-sample-app)の例では`static`フォルダにファイルが生成されるようにしており
(そのために`wasm-bindgen`へ`--out-dir static`と渡す必要があります)、
`wasm.js`と`wasm_bg.wasm`という名前になります(`wasm-bindgen`へ`--out-name wasm`と渡すことで実現できます)

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
# Table of contents

* [はじめに](index)

## 始める

* [プロジェクトの準備](getting-started/project-setup)
* [trunkを使う](getting-started/project-setup/using-trunk)
* [wasm-packを使う](getting-started/project-setup/using-wasm-pack)
* [cargo-webを使う](getting-started/project-setup/using-cargo-web)
* [入門用テンプレート](getting-started/starter-templates)
* [サンプルアプリを作る](getting-started/build-a-sample-app)
* [web-sysかstdweb選ぶ](getting-started/choose-web-library)
* [例から学ぶ](getting-started/examples)

## 基本となる概念 <a id="concepts"></a>

* [html!を使う](concepts/html)
* [リスト](concepts/html/lists)
* [要素](concepts/html/elements)
* [リテラルと式](concepts/html/literals-and-expressions)
* [コンポーネント](concepts/html/components)
* [コンポーネント (Components)](concepts/components)
* [属性 (Properties)](concepts/components/properties)
* [コールバック (Callbacks)](concepts/components/callbacks)
* [参照 (Refs)](concepts/components/refs)
* [Agents](concepts/agents)
* [Services](concepts/services)
* [Format](concepts/services/format)
* [ルータ](concepts/router)

## 高度な内容

* [最適化とベストプラクティス](advanced-topics/optimizations)
* [低レベルなライブラリの中身](advanced-topics/how-it-works)

## 更なる内容

* [CSS](more/css)
* [ロードマップ](more/roadmap)
* [テスト](more/testing)
* [デバッグ](more/debugging)
* [外部ライブラリ](more/external-libs)

Loading