183 lines
7.1 KiB
HTML
183 lines
7.1 KiB
HTML
{% import 'macros/footer.html' as macros_footer -%}
|
||
|
||
{% extends "base.html" %}
|
||
|
||
{% block seo %}
|
||
{{ super() }}
|
||
|
||
{% if config.title %}
|
||
{% set title = config.title %}
|
||
{% else %}
|
||
{% set title = "" %}
|
||
{% endif %}
|
||
|
||
{% if config.extra.title_addition and title %}
|
||
{% set title_addition = title_separator ~ config.extra.title_addition %}
|
||
{% elif config.extra.title_addition %}
|
||
{% set title_addition = config.extra.title_addition %}
|
||
{% else %}
|
||
{% set title_addition = "" %}
|
||
{% endif %}
|
||
|
||
{% set description = config.description %}
|
||
|
||
{{ macros_head::seo(title=title, title_addition=title_addition, description=description, is_home=true) }}
|
||
{% endblock seo %}
|
||
|
||
{% block content %}
|
||
<div class="prose dark:prose-invert max-w-[100%]">
|
||
|
||
<div class="relative bg-left-bottom mt-12 md:mt-0">
|
||
<img class="m-0 mt-[-60px] w-full" src="header.svg"/>
|
||
</div>
|
||
|
||
|
||
<div class="pb-20 section section-colored bg-redrust">
|
||
<div class="mb-10 pt-8 text-center section-colored">
|
||
<h1>
|
||
It’s Like Ruby on Rails, but for Rust.
|
||
</h1>
|
||
<h2>
|
||
Get the same great building experience of Rails, with the incredible<br /> performance and safety of Rust.
|
||
</h2>
|
||
</div>
|
||
<div class="flex items-center justify-center ">
|
||
<div class="relative w-full max-w-[50rem] max-h-[600px] mx-auto px-1 sm:px-0">
|
||
<div class="relative" style="padding-top: 56.25%">
|
||
<iframe class="absolute inset-0 w-full h-full rounded-md shadow-lg"
|
||
src="https://www.youtube.com/embed/EircfwF8c0E?si=jv_PZuWZIJ59Qz3O&rel=0" title="Loco.rs" frameborder="0"
|
||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center justify-center py-6 z-10 relative">
|
||
<a class="fatbtn dark:bg-foreground dark:text-background" href="/docs/getting-started/tour/">Get started →</a>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="pt-20 relative section section-colored bg-orangerust">
|
||
<div class="mb-10 text-center">
|
||
<h1>
|
||
It’s time to make Rust your super-power.
|
||
</h1>
|
||
<h2>
|
||
Using Rust with Loco is super easy. With a simple request lifecycle,<br /> code generators, productivity
|
||
toolkits and more.
|
||
</h2>
|
||
</div>
|
||
|
||
<div class="container">
|
||
<div class="flex items-center justify-center relative z-1 ">
|
||
<div
|
||
class="rounded-lg bg-card text-card-foreground shadow-lg mb-5 w-full max-w-[50rem] z-10 ">
|
||
|
||
<div class="p-0 sm:p-6">
|
||
<pre class="text-lg bg-inherit text-inherit text-[11px] sm:text-[16px]"><div class="text-red-100 font-semibold py-0">$ cargo loco generate scaffold post title:string content:text</div>added: "src/controllers/post.rs"
|
||
injected: "src/controllers/mod.rs"
|
||
injected: "src/app.rs"
|
||
...<div class="text-red-100 font-semibold py-0 ">$ cargo loco start</div>
|
||
<div style="line-height: 16px;" class="text-[9px] sm:text-[16px]">
|
||
▄ ▀
|
||
▀ ▄
|
||
▄ ▀ ▄ ▄ ▄▀
|
||
▄ ▀▄▄
|
||
▄ ▀ ▀ ▀▄▀█▄
|
||
▀█▄
|
||
▄▄▄▄▄▄▄ ▄▄▄▄▄▄▄▄▄ ▄▄▄▄▄▄▄▄▄▄▄ ▄▄▄▄▄▄▄▄▄ ▀▀█
|
||
██████ █████ ███ █████ ███ █████ ███ ▀█
|
||
██████ █████ ███ █████ ▀▀▀ █████ ███ ▄█▄
|
||
██████ █████ ███ █████ █████ ███ ████▄
|
||
██████ █████ ███ █████ ▄▄▄ █████ ███ █████
|
||
██████ █████ ███ ████ ███ █████ ███ ████▀
|
||
▀▀▀██▄ ▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀ ██▀
|
||
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
|
||
https://loco.rs
|
||
</div>
|
||
environment: <span class="text-red-400">development</span>
|
||
database: <span class="text-yellow-400">automigrate</span>
|
||
logger: <span class="text-red-400">disabled</span>
|
||
compilation: <span class="text-yellow-400">debug</span>
|
||
modes: <span class="text-green-400">server</span>
|
||
|
||
<div class="text-yellow-500">listening on localhost:5150</div></pre>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
<div class="py-6"></div>
|
||
|
||
<img src="/cloud.svg" class="absolute right-0 bottom-0 m-0" />
|
||
</div>
|
||
|
||
|
||
|
||
<div class="pt-20 pb-20 section relative section-colored bg-redrust ">
|
||
<div class="mb-10 mt-15 z-10 relative text-center">
|
||
<h1>
|
||
Enjoy that sweet & effortless Rust performance
|
||
</h1>
|
||
<h2>
|
||
Loco packs a lot of features and still gives you 10x more<br /> performance compared to Node.js
|
||
</h2>
|
||
</div>
|
||
|
||
<div class="container">
|
||
<div class="flex flex-col items-center rounded-lg shadow-lg bg-red-900 w-full sm:w-7/12 mx-auto">
|
||
<img src="bench-db-q.svg"/>
|
||
<img src="bench-no-db.svg"/>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center justify-center py-6 z-10 relative">
|
||
<a class="fatbtn dark:bg-foreground dark:text-background" href="/docs/getting-started/tour/">Get started →</a>
|
||
</div>
|
||
<img src="/mountain-bg.svg" class="absolute left-0 top-[-490px]" />
|
||
</div>
|
||
|
||
<div class="section bg-gray-100 dark:bg-background">
|
||
<div class="container">
|
||
<div class="pt-20 text-center">
|
||
<h1>
|
||
Build apps locally and save lots of time.
|
||
</h1>
|
||
<h2>
|
||
No need for SaaS or cloud services. Save time, money, and effort with<br /> auth, workers, emails & more
|
||
out of the box.
|
||
</h2>
|
||
</div>
|
||
|
||
<div
|
||
class=" items-start justify-center gap-6 rounded-lg p-8 md:grid xl:grid-cols-2 relative z-4 ">
|
||
|
||
{% for val in config.extra.homepage.features %}
|
||
<div class="col-span-2 grid items-start xl:col-span-1 text-center">
|
||
<div class="overflow-auto text-sm prose min-w-[100%] text-left">
|
||
{{ val.example | markdown(inline=true) | safe }}
|
||
</div>
|
||
|
||
<h3 class="my-5 mb-3 text-2xl">
|
||
{{ val.name }}
|
||
</h3>
|
||
<p class="mb-20 text-xl">
|
||
{{val.description | safe}}
|
||
</p>
|
||
</div>
|
||
{% endfor %}
|
||
|
||
</div>
|
||
|
||
<div class="flex items-center justify-center py-6 z-10 relative pb-20">
|
||
<a class="fatbtn dark:bg-zinc-700" href="/docs/getting-started/guide/">Read the Guide →</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
{% endblock content %}
|
||
|