mirror of
https://github.com/aljazceru/njump.git
synced 2025-12-17 06:14:22 +01:00
190 lines
11 KiB
Plaintext
190 lines
11 KiB
Plaintext
package main
|
||
|
||
templ homepageTemplate(params HomePageParams) {
|
||
<!doctype html>
|
||
<html class="theme--default font-light">
|
||
<meta charset="UTF-8" />
|
||
<head>
|
||
<title>njump - the nostr static gateway</title>
|
||
<meta name="description" content="" />
|
||
|
||
@headCommonTemplate(params.HeadParams)
|
||
<script src="https://unpkg.com/typewriter-effect@latest/dist/core.js"></script>
|
||
</head>
|
||
|
||
<body
|
||
class="mb-16 bg-white text-gray-600 dark:bg-neutral-900 dark:text-neutral-50 print:text-black"
|
||
>
|
||
@topTemplate(params.HeadParams)
|
||
<div
|
||
class="mx-auto block sm:flex sm:flex-col sm:items-center sm:justify-center sm:px-0"
|
||
>
|
||
<div
|
||
class="w-full px-4 max-w-screen-2xl sm:flex sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12 print:w-full"
|
||
>
|
||
|
||
<!-- Title nimation -->
|
||
<div class="mb-10 px-4 sm:mb-20 mt-8 border-l-[0.8rem] border-strongpink pl-4">
|
||
<h1 class="font-bold">
|
||
<div class="text-[3.5em] sm:text-[4em] leading-[1em] text-neutral-300">
|
||
NOSTR <span class="text-neutral-400">IS</span>
|
||
</div>
|
||
<div class="text-[3.5em] sm:text-[5em] leading-[1em] break-words" id="tw"></div>
|
||
<script>
|
||
var tw = document.getElementById('tw')
|
||
new Typewriter(tw, {
|
||
strings: [
|
||
'',
|
||
'',
|
||
'A PROTOCOL',
|
||
'MANY PLATFORMS',
|
||
'FREEDOM',
|
||
'A SOCIAL PLACE',
|
||
'REALLY WEIRD',
|
||
'ENERGY',
|
||
'UNIVERSAL',
|
||
'YOUR HAPPINESS',
|
||
'PERMISSIONLESS',
|
||
'HEALTHY',
|
||
'UNCENSORED',
|
||
'COOL TO DEVELOP',
|
||
'YOUR NEXT IDEA',
|
||
'.......'
|
||
],
|
||
autoStart: true,
|
||
loop: true,
|
||
cursorClassName: 'typewriter-cursor'
|
||
})
|
||
</script>
|
||
</h1>
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
class="w-full px-4 max-w-screen-2xl sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12 sm:gap-10 print:w-full font-extralight"
|
||
>
|
||
<!-- Intro -->
|
||
<div class="sm:flex sm:gap-20">
|
||
<div>
|
||
<h2 class="text-4xl text-strongpink">Freedom at risk</h2>
|
||
<div class="text-xl mt-2">The original principles of the internet, rooted in decentralization, user empowerment, openness, collaboration, and freedom of expression, were not designed to be dominated by centralized control systems led by governments and capitalist markets.</div>
|
||
<div class="mt-2 text-neutral-500 dark:text-neutral-300">Current social networks such as Twitter, Mastodon, and Secure Scuttlebutt, struggle with challenges of censorship, user bans, server closures, and spam. This underscores the necessity for a decentralized, censorship-resistant, and user-centric social network.</div>
|
||
</div>
|
||
|
||
<div class="mt-8 sm:mt-0">
|
||
<h2 class="text-4xl text-strongpink">The Nostr revolution</h2>
|
||
<div class="text-xl mt-2">Nostr, acronym for “Notes and Other Stuff Transmitted by Relays”, revolutionizes social networking and online communication by eliminating dependency of centralized servers.It employs a client-relay model, where users run clients, and anyone can operate relays.</div>
|
||
<div class="mt-2 text-neutral-500 dark:text-neutral-300">This protocol ensures tamperproof communication through cryptographic keys and signatures. By enabling users to establish pathways and publish notes to relays and incentivizing relay operators, Nostr addresses many shortcomings of existing systems.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Main section -->
|
||
|
||
<div id="why-nostr" class="mt-16 mb-12 text-center">
|
||
<div class="text-4xl text-strongpink">Empowering freedom in Nostr</div>
|
||
<div class="text-2xl">A secure, user-centric protocol and social network</div>
|
||
</div>
|
||
|
||
<div class="sm:flex sm:gap-20 mt-8 sm:mt-20 items-center">
|
||
<div class="sm:w-1/2">
|
||
<h3 class="text-2xl mb-4 text-strongpink">You own your identity, signed</h3>
|
||
<p>Nostr uses a public key system, where your identity is tied to a unique cryptographic key. You have full control over your identity without relying on a central authority. Nostr's protocol eliminates the need for Know Your Customer (KYC) processes. No email, ID, thumbprint, or eyeball scans required. Your privacy is entirely yours to safeguard.</p>
|
||
</div>
|
||
<div class="sm:w-1/2 mt-4 sm:mt-0">
|
||
<img class="dark:hidden" src="/njump/static/home/home01.png" />
|
||
<img class="hidden dark:inline" src="/njump/static/home/home01-dark.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sm:flex sm:flex-row-reverse sm:gap-20 mt-8 sm:mt-20 items-center">
|
||
<div class="sm:w-1/2">
|
||
<h3 class="text-2xl mb-4 text-strongpink">You own your data, signed</h3>
|
||
<p>Users sign their posts with their cryptographic keys in Nostr. This cryptographic signature ensures the authenticity of your data, and you maintain ownership over it. Each client validates these signatures, ensuring data integrity. Users select relays for data exchange, and relays communicate directly with users, not with each other.</p>
|
||
</div>
|
||
<div class="sm:w-1/2 mt-4 sm:mt-0">
|
||
<img class="dark:hidden" src="/njump/static/home/home02.png" />
|
||
<img class="hidden dark:inline" src="/njump/static/home/home02-dark.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sm:flex sm:gap-20 mt-8 sm:mt-20 items-center">
|
||
<div class="sm:w-1/2">
|
||
<h3 class="text-2xl mb-4 text-strongpink">You own your audience</h3>
|
||
<p>In Nostr, you have full control over your audience. Users choose their preferred relay servers and can recommend relays to maintain their follower base, even if they switch relays. Additionally, users can mute other users, words, and contents (if the feature is available), shaping their social media feed according to their preferences.</p>
|
||
</div>
|
||
<div class="sm:w-1/2 mt-4 sm:mt-0">
|
||
<img class="dark:hidden" src="/njump/static/home/home03.png" />
|
||
<img class="hidden dark:inline" src="/njump/static/home/home03-dark.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sm:flex sm:flex-row-reverse sm:gap-20 mt-8 sm:mt-20 items-center">
|
||
<div class="sm:w-1/2">
|
||
<h3 class="text-2xl mb-4 text-strongpink">You are free to speak</h3>
|
||
<p>There’s no censorship on Nostr. If users are censored by a relay or a client, they can always opt for different clients and relays which ensures they will be able to freely express themselves. Relay blocking has no impact on a user's ability to publish to other relays or own relays, ensuring freedom of speech.</p>
|
||
</div>
|
||
<div class="sm:w-1/2 mt-4 sm:mt-0">
|
||
<img class="dark:hidden" src="/njump/static/home/home04.png" />
|
||
<img class="hidden dark:inline" src="/njump/static/home/home04-dark.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sm:flex sm:gap-20 mt-8 sm:mt-20 items-center">
|
||
<div class="sm:w-1/2">
|
||
<h3 class="text-2xl mb-4 text-strongpink">You are free to be anonymous</h3>
|
||
<p>Nostr supports user anonymity. Users can choose to be anonymous or use pseudonyms without compromising their ability to participate. Nostr is also available On TOR that prevents tracking of users. Nostr does not have the capacity to provide user data to governments, safeguarding users' freedom of expression from prohibitions or restrictions.</p>
|
||
</div>
|
||
<div class="sm:w-1/2 mt-4 sm:mt-0">
|
||
<img class="dark:hidden" src="/njump/static/home/home05.png" />
|
||
<img class="hidden dark:inline" src="/njump/static/home/home05-dark.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sm:flex sm:flex-row-reverse sm:gap-20 mt-8 sm:mt-20 items-center">
|
||
<div class="sm:w-1/2">
|
||
<h3 class="text-2xl mb-4 text-strongpink">You are free to develop</h3>
|
||
<p>Nostr encourages development and customization. Users are free to develop on the platform, contributing to the growth and evolution of the network. Anyone can build on Nostr, creating clients, relays, tools, and apps. Users have the freedom to establish payment methods for their features, providing developers with a potential source of revenue.</p>
|
||
</div>
|
||
<div class="sm:w-1/2 mt-4 sm:mt-0">
|
||
<img class="dark:hidden" src="/njump/static/home/home06.png" />
|
||
<img class="hidden dark:inline" src="/njump/static/home/home06-dark.png" />
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- Get started -->
|
||
|
||
<div class="relative px-4 sm:px-0 sm:flex mt-20 py-10 sm:py-28 justify-center bg-gradient-to-br from-slate-600 to-slate-900 text-neutral-50">
|
||
<div class="w-full max-w-screen-2xl sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12">
|
||
<h2 class="text-4xl">Get started with Nostr</h2>
|
||
<div class="sm:flex sm:flex-row sm:flex-wrap sm:w-4/5 mt-12">
|
||
<div class="sm:basis-1/2 sm:pr-20 mb-8">
|
||
<h3 class="text-2xl mb-1 text-strongpink">Create an account</h3>
|
||
<p>With Nostr there is not a central provider that give you an account, in fact your account is powered just by cryptography, and you could create one (or more!) yourself by hand, without any limit. But usually the easist way is to use a <a href="#social" class="underline">Nostr app</a> to bootstrap a new account and then use it everywhere.</p>
|
||
</div>
|
||
<div class="sm:basis-1/2 sm:pr-20 mb-8">
|
||
<h3 class="text-2xl mb-1 text-strongpink">Secure your key</h3>
|
||
<p>An account is a key-pair. The private key (nsec) is your digital identity, if you loose or leak it, you are burned; so you need to keep your key-pair secure and private. Use a password manager, make a backup on paper and use it only in trusted apps. Never enter your nsec in a website, install a <a href="#signers" class="underline">signer extension</a>.</p>
|
||
</div>
|
||
<div class="sm:basis-1/2 sm:pr-20 mb-8 sm:mb-0">
|
||
<h3 class="text-2xl mb-1 text-strongpink">Pick an app</h3>
|
||
<p>Nostr developers already have built several applications that cover different areas; probably the easist way to start using Nostr and learn more is downloading a <a href="#social" class="underline">social client</a> and start getting involved with the community and learn more. Need help? Use the #asknostr hashtag!</p>
|
||
</div>
|
||
<div class="sm:basis-1/2 sm:pr-20 mb-8 sm:mb-0">
|
||
<h3 class="text-2xl mb-1 text-strongpink">Explore Nostr</h3>
|
||
<p>After you are familiar with the basic concepts you can explore other "social" clients and other <a href="#readwrite" class="underline">Nostr applications</a>; remember: your already have your digital identity and it works everywhere, so you can simply login in using your nsec. Always be sure that the app came from a trusted source/dev!</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sm:absolute sm:flex sm:flex-row-reverse sm:top-1/2 sm:right-0 sm:transform sm:-translate-y-1/2 sm:w-1/4">
|
||
<img src="/njump/static/home/client.png" class="sm:h-full sm:object-cover" alt="Nostr Client" />
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
@footerTemplate()
|
||
</body>
|
||
</html>
|
||
} |