LukeParke/website
1
0
Fork 0
mirror of https://github.com/LukeHagar/website.git synced 2025-12-09 12:57:48 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
afafcea0711e8f7c3e4dcbcfbedb4442eebf6733
website/src/routes/docs/tutorials/+page.svelte
Vincent (Wen Yu) Ge afafcea071 Add db quick start
2023-09-13 04:02:01 +00:00

531 lines
20 KiB
Svelte
Raw Blame History

<script lang="ts">
import { MainFooter } from '$lib/components';
import { Docs } from '$lib/layouts';
import Sidebar from '../Sidebar.svelte';
</script>
<main class="aw-main-section">
<article class="aw-article">
<header class="aw-article-header">
<div class="aw-article-header-start u-flex-vertical aw-u-cross-start">
<div class="u-position-relative u-flex u-cross-center">
<h1 class="aw-title">Platforms</h1>
</div>
</div>
<div class="aw-article-header-end" />
</header>
<div class="aw-article-content aw-u-gap-80">
<section class="u-flex-vertical u-gap-24">
<h2 class="aw-eyebrow">Client</h2>
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
</ul>
</section>
<section class="u-flex-vertical u-gap-24">
<h2 class="aw-eyebrow">Server</h2>
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
</ul>
</section>
</div>
<header class="aw-article-header">
<div class="aw-article-header-start u-flex-vertical aw-u-cross-start">
<div class="u-position-relative u-flex u-cross-center">
<h1 class="aw-title">Authentication</h1>
</div>
</div>
<div class="aw-article-header-end" />
</header>
<div class="aw-article-content aw-u-gap-80">
<section class="u-flex-vertical u-gap-24">
<h2 class="aw-eyebrow">Client</h2>
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
</ul>
</section>
<section class="u-flex-vertical u-gap-24">
<h2 class="aw-eyebrow">Server</h2>
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
</ul>
</section>
</div>
<header class="aw-article-header">
<div class="aw-article-header-start u-flex-vertical aw-u-cross-start">
<div class="u-position-relative u-flex u-cross-center">
<h1 class="aw-title">Databases</h1>
</div>
</div>
<div class="aw-article-header-end" />
</header>
<div class="aw-article-content aw-u-gap-80">
<section class="u-flex-vertical u-gap-24">
<h2 class="aw-eyebrow">Client</h2>
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
</ul>
</section>
<section class="u-flex-vertical u-gap-24">
<h2 class="aw-eyebrow">Server</h2>
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="is-mobile-col-span-2">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
<p class="aw-sub-body-400 u-margin-block-start-4">
Lorem ipsum dolor sit amet consectetur.
</p>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
<li class="">
<article class="aw-card is-full-color">
<header class="u-flex u-cross-baseline u-gap-4">
<span class="icon-node_js aw-u-font-size-24" aria-hidden="true" />
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Node.js</h4>
</header>
</article>
</li>
</ul>
</section>
</div>
</article>
<MainFooter variant="docs" />
</main>
Reference in New Issue View Git Blame Copy Permalink