forked from cory/tildefriends
289 lines
8.6 KiB
HTML
289 lines
8.6 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<link rel="stylesheet" href="w3.css" />
|
|
<link rel="stylesheet" href="fontawesome.min.css" />
|
|
<link rel="stylesheet" href="regular.min.css" />
|
|
<link rel="stylesheet" href="solid.min.css" />
|
|
<link rel="stylesheet" href="brands.min.css" />
|
|
|
|
<style>
|
|
body,
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5 {
|
|
font-family: 'Poppins', sans-serif;
|
|
}
|
|
body {
|
|
font-size: 16px;
|
|
}
|
|
img {
|
|
margin-bottom: -8px;
|
|
}
|
|
.mySlides {
|
|
display: none;
|
|
}
|
|
</style>
|
|
<base target="_top" />
|
|
</head>
|
|
<body class="w3-content w3-black" style="max-width: 1500px">
|
|
<!-- The App Section -->
|
|
<div class="w3-padding-64 w3-white">
|
|
<div class="w3-row-padding">
|
|
<div class="w3-col l8 m6 w3-padding-32">
|
|
<h1 class="w3-jumbo">
|
|
<b>😎 Tilde Friends</b>
|
|
</h1>
|
|
<h1 class="w3-xxlarge w3-text-green">
|
|
<b>Make apps and friends from the comfort of your web browser.</b>
|
|
</h1>
|
|
<p>
|
|
Tilde Friends is a platform for building, running, and sharing web
|
|
applications.
|
|
</p>
|
|
<p>
|
|
Available for lots of devices:
|
|
<i class="fa-brands fa-linux w3-xlarge"></i>
|
|
<i class="fa-brands fa-android w3-xlarge"></i>
|
|
<i class="fa-brands fa-apple w3-xlarge"></i>
|
|
<i class="fa fa-mobile-screen w3-xlarge"></i>
|
|
<i class="fa-brands fa-windows w3-xlarge"></i>
|
|
</p>
|
|
<a
|
|
class="w3-button w3-black w3-padding-large"
|
|
href="https://dev.tildefriends.net/cory/tildefriends/releases"
|
|
><i class="fa fa-download"></i> Download</a
|
|
>
|
|
<a
|
|
class="w3-button w3-black w3-padding-large"
|
|
href="https://www.tildefriends.net/~cory/apps/"
|
|
><i class="fa fa-link"></i> Try It</a
|
|
>
|
|
<a
|
|
class="w3-button w3-black w3-padding-large"
|
|
href="https://dev.tildefriends.net/"
|
|
><i class="fa fa-mug-hot"></i> Code</a
|
|
>
|
|
</div>
|
|
<div class="w3-col l4 m6">
|
|
<img src="tildefriends.png" class="w3-image w3-right w3-hide-small" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Getting Starting Section -->
|
|
<div class="w3-indigo w3-center">
|
|
<div class="w3-row-padding w3-padding-64">
|
|
<div class="w3-jumbo">
|
|
<i class="fa fa-rocket"></i> <b>Getting Started</b>
|
|
</div>
|
|
<div>
|
|
<h2>First-time user checklist:</h2>
|
|
<ol type="1" style="text-align: left">
|
|
<li>
|
|
<a href="https://dev.tildefriends.net/cory/tildefriends/releases"
|
|
>Download</a
|
|
>
|
|
Tilde Friends and run your own instance, or use
|
|
<a href="https://www.tildefriends.net/"
|
|
>https://www.tildefriends.net/</a
|
|
>.
|
|
</li>
|
|
<li>
|
|
Create an account to identify yourself with that instance by
|
|
username and password.
|
|
</li>
|
|
<li>
|
|
Create an SSB identity in the <b>ssb</b> app. This will generate a
|
|
keypair used to identify yourself to other users and sign your
|
|
messages so that they can be verified as from you.
|
|
</li>
|
|
<li>
|
|
Describe yourself in your profile in the <b>ssb</b> app. Give
|
|
yourself a name and an avatar if you like.
|
|
</li>
|
|
<li>
|
|
Connect to others. You will automatically discover peers on the
|
|
same instance and same network if there are any. Or use
|
|
<a href="https://github.com/staltz/ssb-room/blob/master/FAQ.md"
|
|
>rooms</a
|
|
>
|
|
and pubs to reach more distant users.
|
|
<a href="https://www.tildefriends.net/~cory/room/"
|
|
>tildefriends.net itself</a
|
|
>
|
|
operates as a room, so you can connect and see who else is online
|
|
and establish a connection.
|
|
</li>
|
|
<li>Follow people to grow your network.</li>
|
|
<li>
|
|
Use the <b>edit</b> link at the top of any page to start modifying
|
|
and making apps.
|
|
</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SSB Section -->
|
|
<div class="w3-light-grey">
|
|
<div class="w3-row-padding w3-padding-64">
|
|
<div class="w3-col l4 m6 s4">
|
|
<a href="https://scuttlebutt.nz/"
|
|
><img
|
|
class="w3-image w3-round-large"
|
|
src="ssb.png"
|
|
alt="Secure Scuttlebutt"
|
|
/></a>
|
|
</div>
|
|
<div class="w3-col l8 m6" style="height: auto">
|
|
<h1 class="w3-jumbo"><b>Built for Sharing</b></h1>
|
|
<p>
|
|
Tilde Friends participates in the
|
|
<a href="https://scuttlebutt.nz/">Secure Scuttlebutt</a> distributed
|
|
social network.
|
|
</p>
|
|
<p>
|
|
Share apps with friends. Discover new apps made by enemies. Post
|
|
pictures of your coffee. Or just lurk.
|
|
</p>
|
|
<p>
|
|
The social network integration provides tools for connecting with
|
|
other people world-wide while still allowing apps and everything to
|
|
operate offline.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Editor Section -->
|
|
<div class="w3-container w3-padding-64 w3-light-blue">
|
|
<div class="w3-row-padding">
|
|
<div class="w3-col l8 m6">
|
|
<h1 class="w3-jumbo"><b>Edit Anything</b></h1>
|
|
<i
|
|
class="fa fa-pen-to-square w3-left w3-jumbo w3-text-gray"
|
|
style="padding: 32px"
|
|
></i>
|
|
<p>
|
|
See that <code><b>edit</b></code> link near the top left corner of
|
|
this page? It's there for every Tilde Friends app, so you can modify
|
|
and see your changes right away.
|
|
</p>
|
|
<p>It's kind of like a wiki, but for code!</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sandbox Section -->
|
|
<div class="w3-padding-64 w3-grey">
|
|
<div class="w3-row-padding">
|
|
<div class="w3-col">
|
|
<h1 class="w3-jumbo" style="text-align: right">
|
|
<b>Sandbox Security</b>
|
|
</h1>
|
|
<i
|
|
class="fa fa-road-barrier w3-right w3-jumbo w3-text-yellow"
|
|
style="padding: 32px"
|
|
></i>
|
|
<p>
|
|
Tilde Friends tries to make sure apps can be trusted using similar
|
|
techniques to how web browsers and operating systems do it.
|
|
</p>
|
|
<p>
|
|
This is all a work in progress, and it varies by platform, so don't
|
|
give it all your innermost secrets yet, but do kick its tires and
|
|
<a href="mailto:cory@tildefriends.net">share</a> any surprises you
|
|
find.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Technlology Section -->
|
|
<div class="w3-container w3-padding-64 w3-light-grey w3-center">
|
|
<h1 class="w3-jumbo"><b>Trusted Technology</b></h1>
|
|
<p>Tilde Friends is built using boring, trusted tech.</p>
|
|
<p>
|
|
Though of course for building Tilde Friends apps, you are free to use
|
|
whatever fits.
|
|
</p>
|
|
|
|
<div class="w3-row" style="margin-top: 64px">
|
|
<a
|
|
href="https://en.wikipedia.org/wiki/C_(programming_language)"
|
|
class="w3-col s3"
|
|
>
|
|
<i class="fa fa-c w3-text-blue w3-jumbo"></i>
|
|
<p>C</p>
|
|
</a>
|
|
<a href="https://bellard.org/quickjs/" class="w3-col s3">
|
|
<i class="fa-brands fa-js w3-text-orange w3-jumbo"></i>
|
|
<p>QuickJS</p>
|
|
</a>
|
|
<a href="https://www.sqlite.org/" class="w3-col s3">
|
|
<i class="fa fa-database w3-text-red w3-jumbo"></i>
|
|
<p>SQLite</p>
|
|
</a>
|
|
<a href="https://github.com/libuv/libuv" class="w3-col s3">
|
|
<i class="fa fa-bolt w3-text-yellow w3-jumbo"></i>
|
|
<p>libuv</p>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="w3-row" style="margin-top: 64px">
|
|
<a href="https://www.zlib.net/" class="w3-col s3">
|
|
<i class="fa fa-file-zipper w3-text-cyan w3-jumbo"></i>
|
|
<p>zlib</p>
|
|
</a>
|
|
<a href="https://doc.libsodium.org/" class="w3-col s3">
|
|
<i class="fa fa-lock w3-text-purple w3-jumbo"></i>
|
|
<p>libsodium</p>
|
|
</a>
|
|
<a href="https://www.openssl.org/" class="w3-col s3">
|
|
<i class="fa fa-shield-halved w3-text-green w3-jumbo"></i>
|
|
<p>OpenSSL</p>
|
|
</a>
|
|
<a
|
|
href="https://github.com/ianlancetaylor/libbacktrace"
|
|
class="w3-col s3"
|
|
>
|
|
<i class="fa fa-burst w3-text-pink w3-jumbo"></i>
|
|
<p>libbacktrace</p>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="w3-row" style="margin-top: 64px">
|
|
<a href="https://codemirror.net/docs/changelog/" class="w3-col s3">
|
|
<i class="fa fa-keyboard w3-text-indigo w3-jumbo"></i>
|
|
<p>CodeMirror</p>
|
|
</a>
|
|
<a href="https://github.com/jlfwong/speedscope/" class="w3-col s3">
|
|
<i class="fa fa-microscope w3-text-orange w3-jumbo"></i>
|
|
<p>Speedscope</p>
|
|
</a>
|
|
<a href="https://github.com/lit/lit/" class="w3-col s3">
|
|
<i class="fa fa-fire w3-text-cyan w3-jumbo"></i>
|
|
<p>Lit</p>
|
|
</a>
|
|
<a href="https://www.gnu.org/software/make/" class="w3-col s3">
|
|
<i class="fa fa-hammer w3-text-teal w3-jumbo"></i>
|
|
<p>GNU Make</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer class="w3-container w3-padding-32 w3-blue-grey w3-center w3-xlarge">
|
|
<p class="w3-medium">
|
|
This page and Tilde Friends itself was made by Cory mostly in coffee
|
|
shops and a local pizza place.
|
|
</p>
|
|
</footer>
|
|
</body>
|
|
</html>
|