Skip to content

Commit

Permalink
Revise
Browse files Browse the repository at this point in the history
  • Loading branch information
@Tao-VanJS
Tao-VanJS committed Mar 7, 2024
1 parent 7f3d661 commit d6d2125
Show file tree
Hide file tree
Showing 3 changed files with 3 additions and 3 deletions.
2 changes: 1 addition & 1 deletion minivan.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -191,7 +191,7 @@ <h1 class="w3-padding-16 w3-xxxlarge">
headers: {"content-type": "text/html; charset=utf-8"},
},
))
</code></pre><p>Preview via <a href="https://codesandbox.io/p/sandbox/github/vanjs-org/vanjs-org.github.io/tree/master/sitegen/deno-examples/mini-van-server?file=%2Fmini-van-server.ts%3A1%2C1" class="w3-hover-opacity">CodeSandbox</a>.</p><h2 class="w3-xxlarge w3-text-red" id="client-side-getting-started"><a class="self-link" href="#client-side-getting-started">Client-Side: Getting Started</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>To get started on the client side, add the line below to your script:</p><pre><code class="language-js">import van from "https://cdn.jsdelivr.net/gh/vanjs-org/mini-van/public/mini-van-0.5.3.min.js"</code></pre><p>To code without ES6 modules, add the following line to your HTML file instead:</p><pre><code class="language-html">&lt;script type="text/javascript" src="https://cdn.jsdelivr.net/gh/vanjs-org/mini-van/public/mini-van-0.5.3.nomodule.min.js"&gt;&lt;/script&gt;</code></pre><p>Alternative, you can download the files (<code class="symbol"><a href="/code/mini-van-0.5.3.min.js" download="mini-van-0.5.3.min.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.min.js">mini-van-0.5.3.min.js</a></code>, <code class="symbol"><a href="/code/mini-van-0.5.3.nomodule.min.js" download="mini-van-0.5.3.nomodule.min.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.nomodule.min.js">mini-van-0.5.3.nomodule.min.js</a></code>) and serve them locally.</p><h3 class="w3-large w3-text-red" id="download-table"><a class="self-link" href="#download-table">Download Table</a></h3><p>You can find all relevant <b>Mini-Van</b> files to download in the table below:</p><div>Click the link to download the file, or 📋 to copy the import line from CDN.</div><table class="download-table"><thead><tr><th>Files</th><th>Description</th></tr></thead><tbody><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.min.js" download="mini-van-0.5.3.min.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.min.js">mini-van-0.5.3.min.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.min.d.ts" download="mini-van-0.5.3.min.d.ts" style="white-space: nowrap;" title="Download mini-van-0.5.3.min.d.ts">mini-van-0.5.3.min.d.ts</a></code></pre></td><td>Minified script file for ES6 modules, optimized for bundle size.</td></tr><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.js" download="mini-van-0.5.3.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.js">mini-van-0.5.3.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.d.ts" download="mini-van-0.5.3.d.ts" style="white-space: nowrap;" title="Download mini-van-0.5.3.d.ts">mini-van-0.5.3.d.ts</a></code></pre></td><td>The source file without minification.</td></tr><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/van-0.5.3.nomodule.min.js" download="van-0.5.3.nomodule.min.js" style="white-space: nowrap;" title="Download van-0.5.3.nomodule.min.js">van-0.5.3.nomodule.min.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre></td><td>Similar to <code class="symbol">mini-van-0.5.3.min.js</code>, but designed to work in non-module context, such as inline JavaScript or <code class="symbol">&lt;script type="text/javascript"&gt;</code>.</td></tr><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/van-0.5.3.nomodule.js" download="van-0.5.3.nomodule.js" style="white-space: nowrap;" title="Download van-0.5.3.nomodule.js">van-0.5.3.nomodule.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre></td><td>Similar to <code class="symbol">mini-van-0.5.3.js</code>, but designed to work in non-module context, such as inline JavaScript or <code class="symbol">&lt;script type="text/javascript"&gt;</code>.</td></tr></tbody></table><h2 class="w3-xxlarge w3-text-red" id="api-reference"><a class="self-link" href="#api-reference">API Reference</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p><b>Mini-Van</b> exposes the same set of APIs as <b>VanJS</b> for DOM composition and manipulation. Thus for API reference, you can refer to <a href="/tutorial#dom" class="w3-hover-opacity">DOM Composition and Manipulation</a> section of <b>VanJS</b> tutorial. Note that: state and state binding are not supported in <b>Mini-Van</b>.</p><h2 class="w3-xxlarge w3-text-red" id="source-code"><a class="self-link" href="#source-code">Source Code</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p style="display: flex; align-items: center;"><svg height="16" aria-hidden="true" viewbox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-mark-github v-align-middle" style="margin-right: 6px;"><path d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"></path></svg><a href="https://github.com/vanjs-org/mini-van" class="w3-hover-opacity">github.com/vanjs-org/mini-van</a></p><h2 class="w3-xxlarge w3-text-red" id="support-feedback"><a class="self-link" href="#support-feedback">Support &amp; Feedback</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>🙏 <b>VanJS</b> aims to build a better world by reducing the entry barrier for UI programming, with no intention or plan on commercialization whatsoever. If you find <b>VanJS</b> interesting, or could be useful for you some day, please consider starring the project on <a href="https://github.com/vanjs-org/mini-van" class="w3-hover-opacity">GitHub</a>. It takes just a few seconds but your support means the world to us and helps spread <b>VanJS</b> to a wider audience.</p><p>We're looking for the 1.0 milestone (commitment to API stability) soon, your precious feedback will be greatly appreciated. You can submit your feedback by creating issues with the link below:</p><p><a class="github-button" href="https://github.com/vanjs-org/mini-van" data-icon="octicon-star" data-show-count="true" aria-label="Star vanjs-org/van on GitHub">Star</a> <a class="github-button" href="https://github.com/vanjs-org/mini-van/subscription" data-icon="octicon-eye" aria-label="Watch vanjs-org/van on GitHub">Watch</a> <a class="github-button" href="https://github.com/vanjs-org/mini-van/issues" data-icon="octicon-issue-opened" aria-label="Issue vanjs-org/van on GitHub">Issue</a> <a class="github-button" href="https://github.com/vanjs-org" aria-label="Follow @vanjs-org on GitHub">Follow @vanjs-org</a></p><p>Contact us: <a href="mailto:[email protected]" class="w3-hover-opacity">[email protected]</a></p></div>
</code></pre><p>Preview via <a href="https://codesandbox.io/p/sandbox/github/vanjs-org/vanjs-org.github.io/tree/master/sitegen/deno-examples/mini-van-server?file=%2Fmini-van-server.ts%3A1%2C1" class="w3-hover-opacity">CodeSandbox</a>.</p><h2 class="w3-xxlarge w3-text-red" id="client-side-getting-started"><a class="self-link" href="#client-side-getting-started">Client-Side: Getting Started</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>To get started on the client side, add the line below to your script:</p><pre><code class="language-js">import van from "https://cdn.jsdelivr.net/gh/vanjs-org/mini-van/public/mini-van-0.5.3.min.js"</code></pre><p>To code without ES6 modules, add the following line to your HTML file instead:</p><pre><code class="language-html">&lt;script type="text/javascript" src="https://cdn.jsdelivr.net/gh/vanjs-org/mini-van/public/mini-van-0.5.3.nomodule.min.js"&gt;&lt;/script&gt;</code></pre><p>Alternative, you can download the files (<code class="symbol"><a href="/code/mini-van-0.5.3.min.js" download="mini-van-0.5.3.min.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.min.js">mini-van-0.5.3.min.js</a></code>, <code class="symbol"><a href="/code/mini-van-0.5.3.nomodule.min.js" download="mini-van-0.5.3.nomodule.min.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.nomodule.min.js">mini-van-0.5.3.nomodule.min.js</a></code>) and serve them locally.</p><h3 class="w3-large w3-text-red" id="download-table"><a class="self-link" href="#download-table">Download Table</a></h3><p>You can find all relevant <b>Mini-Van</b> files to download in the table below:</p><div>Click the link to download the file, or 📋 to copy the import line from CDN.</div><table class="download-table"><thead><tr><th>Files</th><th>Description</th></tr></thead><tbody><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.min.js" download="mini-van-0.5.3.min.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.min.js">mini-van-0.5.3.min.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.min.d.ts" download="mini-van-0.5.3.min.d.ts" style="white-space: nowrap;" title="Download mini-van-0.5.3.min.d.ts">mini-van-0.5.3.min.d.ts</a></code></pre></td><td>Minified script file for ES6 modules, optimized for bundle size.</td></tr><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.js" download="mini-van-0.5.3.js" style="white-space: nowrap;" title="Download mini-van-0.5.3.js">mini-van-0.5.3.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre><pre style="margin: 0;"><code class="symbol"><a href="/code/mini-van-0.5.3.d.ts" download="mini-van-0.5.3.d.ts" style="white-space: nowrap;" title="Download mini-van-0.5.3.d.ts">mini-van-0.5.3.d.ts</a></code></pre></td><td>The source file without minification.</td></tr><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/van-0.5.3.nomodule.min.js" download="van-0.5.3.nomodule.min.js" style="white-space: nowrap;" title="Download van-0.5.3.nomodule.min.js">van-0.5.3.nomodule.min.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre></td><td>Similar to <code class="symbol">mini-van-0.5.3.min.js</code>, but designed to work in non-module context, such as inline JavaScript or <code class="symbol">&lt;script type="text/javascript"&gt;</code>.</td></tr><tr><td><pre style="margin: 0;"><code class="symbol"><a href="/code/van-0.5.3.nomodule.js" download="van-0.5.3.nomodule.js" style="white-space: nowrap;" title="Download van-0.5.3.nomodule.js">van-0.5.3.nomodule.js</a><a class="copy" onclick="copy(this)" onmouseout="resetTooltip(this)"><span class="tooltip">Copy import line</span>📋</a></code></pre></td><td>Similar to <code class="symbol">mini-van-0.5.3.js</code>, but designed to work in non-module context, such as inline JavaScript or <code class="symbol">&lt;script type="text/javascript"&gt;</code>.</td></tr></tbody></table><h2 class="w3-xxlarge w3-text-red" id="api-reference"><a class="self-link" href="#api-reference">API Reference</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p><b>Mini-Van</b> exposes the same set of APIs as <b>VanJS</b> for DOM composition and manipulation. Thus for API reference, you can refer to <a href="/tutorial#dom" class="w3-hover-opacity">DOM Composition and Manipulation</a> section of <b>VanJS</b> tutorial. Note that: state and state binding are not supported in <b>Mini-Van</b>.</p><h2 class="w3-xxlarge w3-text-red" id="source-code"><a class="self-link" href="#source-code">Source Code</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p style="display: flex; align-items: center;"><svg height="16" aria-hidden="true" viewbox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-mark-github v-align-middle" style="margin-right: 6px;"><path d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"></path></svg><a href="https://github.com/vanjs-org/mini-van" class="w3-hover-opacity">github.com/vanjs-org/mini-van</a></p><h2 class="w3-xxlarge w3-text-red" id="support-feedback"><a class="self-link" href="#support-feedback">Support &amp; Feedback</a></h2><hr style="width:50px;border:5px solid red" class="w3-round"><p>🙏 <b>VanJS</b> aims to build a better world by reducing the entry barrier of UI programming, with no intention or plan on commercialization whatsoever. If you find <b>VanJS</b> interesting, or could be useful for you some day, please consider starring the project on <a href="https://github.com/vanjs-org/mini-van" class="w3-hover-opacity">GitHub</a>. It takes just a few seconds but your support means the world to us and helps spread <b>VanJS</b> to a wider audience.</p><p>We're looking for the 1.0 milestone (commitment to API stability) soon, your precious feedback will be greatly appreciated. You can submit your feedback by creating issues with the link below:</p><p><a class="github-button" href="https://github.com/vanjs-org/mini-van" data-icon="octicon-star" data-show-count="true" aria-label="Star vanjs-org/van on GitHub">Star</a> <a class="github-button" href="https://github.com/vanjs-org/mini-van/subscription" data-icon="octicon-eye" aria-label="Watch vanjs-org/van on GitHub">Watch</a> <a class="github-button" href="https://github.com/vanjs-org/mini-van/issues" data-icon="octicon-issue-opened" aria-label="Issue vanjs-org/van on GitHub">Issue</a> <a class="github-button" href="https://github.com/vanjs-org" aria-label="Follow @vanjs-org on GitHub">Follow @vanjs-org</a></p><p>Contact us: <a href="mailto:[email protected]" class="w3-hover-opacity">[email protected]</a></p></div>
<aside id="toc"><ul><li><a href="#server-side-npm-integration" class="w3-hover-opacity">Server-Side: NPM Integration</a><ul><li><a href="#install" class="w3-hover-opacity">Install</a></li><li><a href="#npm-van-plate" class="w3-hover-opacity">van-plate mode</a></li><li><a href="#npm-mini-van" class="w3-hover-opacity">mini-van mode</a></li></ul></li><li><a href="#server-side-deno-integration" class="w3-hover-opacity">Server-Side: Deno Integration</a><ul><li><a href="#deno-van-plate" class="w3-hover-opacity">van-plate mode</a></li><li><a href="#deno-mini-van" class="w3-hover-opacity">mini-van mode</a></li></ul></li><li><a href="#client-side-getting-started" class="w3-hover-opacity">Client-Side: Getting Started</a><ul><li><a href="#download-table" class="w3-hover-opacity">Download Table</a></li></ul></li><li><a href="#api-reference" class="w3-hover-opacity">API Reference</a></li><li><a href="#source-code" class="w3-hover-opacity">Source Code</a></li><li><a href="#support-feedback" class="w3-hover-opacity">Support &amp; Feedback</a></li></ul></aside>
</div>
</div>
Expand Down
Loading

0 comments on commit d6d2125

Please sign in to comment.