<Route="/" />
<!DOCTYPE html><html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5, shrink-to-fit=no" />
<title>crateland</title> <meta name="title" content="crateland"> <meta name="description" content="a fullstack web framework built with deno!">
<meta property="og:type" content="website"> <meta property="og:url" content="https://crate.land/"> <meta property="og:title" content="crateland"> <meta property="og:description" content="a fullstack web framework built with deno!"> <meta property="og:image" content="https://siasky.net/CAD7j5WQJXvVyfBOOA0QSecHVrbeKrqoXOVpnN3vf03Uig">
<meta property="twitter:card" content="summary_large_image"> <meta property="twitter:url" content="https://crate.land/"> <meta property="twitter:title" content="crateland"> <meta property="twitter:description" content="a fullstack web framework built with deno!"> <meta property="twitter:image" content="https://siasky.net/CAD7j5WQJXvVyfBOOA0QSecHVrbeKrqoXOVpnN3vf03Uig">
<link rel="shortcut icon" href="https://siasky.net/CAD7j5WQJXvVyfBOOA0QSecHVrbeKrqoXOVpnN3vf03Uig" /> <link rel="preload" as="image" href="https://siasky.net/CAD7j5WQJXvVyfBOOA0QSecHVrbeKrqoXOVpnN3vf03Uig">
<style> :root { --syntax-keyword: #694e2b; --syntax-function: #9c7748; --syntax-variable: #7d4619; }
::-moz-selection { color: #000; background: #ffcf96; } ::selection { color: #000; background: #ffcf96; }
hr { border: none; background-color: #a4a4a4; height: 2px; }
img { user-select: none; }
html { background: #c4c4c4; width: 100%; }
#airframe { position: absolute; padding-bottom: 5vmin; left: 5vmin; top: 5vmin; width: calc(100% - 10vmin); height: fit-content; }
.subtitle { font-family: Helvetica; font-size: 2rem; font-weight: bold; color: #000; }
.body { font-family: Arial; color: #212121; }
.outbound { text-decoration: underline; color: #000; }
.accent { color: #ffcf96; font-weight: bold; }
a { color: inherit; text-decoration: none; }
a:hover { color: #ffcf96; text-shadow: 1px 1px 0 #000; cursor: pointer; }
pre, code { background-color: #b4b4b4; color: #212121; border-radius: 5px; padding: 0.45vmin; font-family: monospace; }
.keyword { color: var(--syntax-keyword); }
.function { color: var(--syntax-function); }
.variable { color: var(--syntax-variable); } </style>
</head> <body> <div id="airframe"> <header> <img src="https://siasky.net/CAD7j5WQJXvVyfBOOA0QSecHVrbeKrqoXOVpnN3vf03Uig" alt="crate" width="50" style="float: left"/> <div class="subtitle" style="float: right">crate</div> <div style="clear:both"></div> </header> <br/> <br/> <div class="subtitle">readme</div> <br/> <div class="body"> crate is a fullstack web framework built on deno! <br/> <br/> available on: <br/> [<a href="https://deno.land/x/crate" class="outbound">deno.land/x</a>] <br/> [<a href="https://github.com/jordanreger/crate" class="outbound">github</a>] <br/> <br/> <hr> <br/> <h2>get started</h2> all you need to do is make two files. seriously! <br/> <br/> <b>main.ts</b> <pre style="word-wrap: break-word; white-space: pre-wrap;"><span class="keyword">const</span> <span class="variable">App</span> = { directory: <span class="variable">"./src"</span>, routes: { <span class="variable">"/"</span>: <span class="variable">"./index.html"</span>, <span class="variable">"/redirect"</span>: <span class="variable">"https://crate.land"</span> }}
<span class="keyword">import</span> Crate <span class="keyword">from</span> <span class="variable">"https://crate.land/mod"</span>;
<span class="keyword">let</span> crate = <span class="keyword">new</span> Crate();crate.<span class="function">serve</span>(<span class="variable">App</span>);</pre> <br/> <b>./src/index.html</b> <pre style="word-wrap: break-word; white-space: pre-wrap;"><<span class="keyword">html</span>> <<span class="keyword">main</span>> hello from index.html! <<span class="keyword">br</span>/> <<span class="keyword">Link</span> to="https://crate.land/deno"> Built with Crate! </<span class="keyword">Link</span>> </<span class="keyword">main</span>></<span class="keyword">html</span>></pre> </div> <br/> <br/> <div class="subtitle">roadmap</div> <br/> <div class="body"> - [x] make a basic server-side rendering tool and an automatic server <br/> - [ ] attach a universal backend (pallet) so you can run it anywhere <br/> - [ ] ??? — <a href="https://github.com/jordanreger/crate/issues" class="outbound">make an issue</a>! </div> <br/> <br/> <div class="subtitle">where's the old crate?</div> <br/> <div class="body"> for those of you who don't know, crate used to be a fancy webview wrapper. now, it's evolving into a fullstack web framework that will have a seamless native experience as well with an upcoming tool called "pallet." </div> <br/> <br/> <div class="subtitle">dev</div> <br/> <div class="body"> <a href="/deno"><img alt="Deno release" src="https://shield.deno.dev/x/crate"></a> <a href="/github"><img alt="GitHub license" src="https://img.shields.io/github/license/jordanreger/crate"></a> <br/> <br/> built with ♡ and <a href="https://deno.land" class="outbound">deno</a> by <a href="https://jordanreger.com" class="outbound">jordan reger</a>. </div> <br/> <br/> </div> </body></html>