SelfPrivacy.org landing page source code
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

390 lines
22 KiB

<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="">
<meta property="og:type" content="">
<meta property="og:url" content="">
<meta property="og:image" content="">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="font/stylesheet.css">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<link rel="icon" type="image/png" href="favicon.png" />
<meta name="theme-color" content="#fafafa">
</head>
<body>
<!-- Add your site or application content here -->
<div class="nav">
<div class="flex-box-wrap max-width">
<div class="w-25">
<div class="nav-logo-box">
<img src="img/Logo.png" alt="">
</div>
</div>
<div class="w-50">
<div>
<a class="telegram-btn" href="https://t.me/selfprivacy">
Telegram
</a>
</div>
</div>
<div class="w-25">
<div class="flex-box-wrap jc-fe">
<a href="https://selfprivacy.org/en/index.html">en</a>
<a href="https://selfprivacy.org/">ru</a>
<a class="nav-yellow-link" href="https://social.selfprivacy.org">
<img src="img/Twitter%20Logo.svg" alt="">
</a>
<a class="nav-yellow-link" href="https://git.selfprivacy.org">
<img src="img/Vector.svg" alt="">
</a>
</div>
</div>
</div>
</div>
<div class="margin-16 boxes">
<div class="max-width">
<h2 class="install-page-header">
Установка и настройка
</h2>
<div class="blue-border">
<p></p>
<p class="bottom-p">
SelfPrivacy сервер создается поэтапно в течение часа. Звучит страшно, но уверяю, ученая степень не
понадобится. Процесс не сложнее покупки в интернет магазине.
</p>
<ul>
<li>
<!--1. -->Поиск паспорта и карты с балансом $10-15 и $5 в месяц
</li>
<li>
<!--2. -->Регистрация учётных записей
</li>
<li>
<!--3. -->Защита учётных записей
</li>
<li>
<!--4. -->Покупка домена
</li>
<li>
<!--5. -->Подключение домена к DNS серверу
</li>
<li>
<!--6. -->🔑 Создание ключей
</li>
<li>
<!--7. -->Установка
</li>
<li>
<!--8. -->Подключение к сервисам 🎉
</li>
</ul>
<p class="bottom-p">
Если кому-нибудь поручите эту задачу — лишитесь приватности. Для 100% независимости и контроля всё
делать самому.
</p>
</div>
<div class="blue-border">
<p class="top-p">
Регистрация учётных записей
</p>
<p class="bottom-p">
SelfPrivacy для устойчивости и приватности требует много учётных записей. Если всё держать в одном
месте,
получаем то, от чего бежали — все данные у одной компании 🤦‍♀️
</p>
<p class="bottom-p">
Поэтому разные части системы будут в разных местах. Регистрируемся:
</p>
<ul>
<li>
<a href="https://accounts.hetzner.com/login">Hetzner </a>— хостинг виртуального сервера. Здесь
будут жить наши данные и SelfPrivacy сервисы.
</li>
<li>
<a href="https://www.namecheap.com/myaccount/login/">NameCheap</a> или любой другой
регистратор, для покупки личного адреса в интернете — домена, который будет указывать на сервер.
</li>
<li>
<a href="https://dash.cloudflare.com/login">CloudFlare </a>— DNS сервер, где работает ваш
домен.
</li>
<li>
<a
href="https://secure.backblaze.com/user_signin.htm">Backblaze
</a>— IaaS провайдер, для бесплатного хранения резервных копий ваших данных в
зашифрованном виде.
</li>
</ul>
<p class="bottom-p">
Регистрация заурядна, но иногда проверка учётной записи длится несколько дней или требуют
дополнительных
документов. Поэтому используйте настоящие документы и заполняйте все аккуратно. Провайдеры так
защищаются от спамеров, ничего личного )
</p>
</div>
<div class="blue-border">
<p class="top-p">
Защита учётных записей
</p>
<p class="bottom-p">
Взламывают системы через самое слабое звено. Чтобы учётные записи не были таким звеном, пароли
делаем разные и сложные. MamaMilaRamu как ни странно плохой пароль, а отличные 🌈 — это
парольная фраза:
</p>
<p class="code-p">
expert repose postwar anytime glimpse freestyle liability effects
</p>
<p class="bottom-p">или</p>
<p class="code-p">
}Rj;EtG:,M!bc4/|
</p>
<p class="bottom-p">
Как такой пароль запомнить? Никак! Пароли не нужно запоминать, их надо создавать и хранить в <a
href="https://keepassxc.org/download/">менеджере паролей</a>. Хотя один помнить придется —
пароль от менеджера паролей.
</p>
<p class="bottom-p">
Обязательно включите дополнительную защиту учётных записей. Называется второй фактор (MFA, 2FA). Без
этого
простого шага ваши данные не будут в безопасности.
</p>
<p class="bottom-p">
Я знаю, было сложно, но теперь вы защищены лучше, чем у 95%. Можете собой гордится! Я вот вами
горжусь 🤗
</p>
</div>
<h2>
Покупка домена
</h2>
<p class="top-header-p">
Включили второй фактор? Я серьезно! Тогда переходим к интересному!
</p>
<div class="blue-border-img">
<img src="img/nc-buy-domain.gif" alt="gif">
</div>
<p class="bottom-p pb-25">
<i>Домен</i> — это кусочек интернета, которому вы даете имя. Простор для творчества огромен, у вас есть
63 символа + .com .org .icu и еще несколько сотен доменов после точки. Можно просто по фамилии выбрать
ivanov.live или ivanov.health, а можно что-то творческое shit-happens.shop
</p>
<div class="blue-border">
<p class="top-p">
Рекомендации
</p>
<ul>
<li>Обязательно смотреть на цену ежегодного продления, она может в разы превышать стоимость покупки.
</li>
<li>Нормальная цена домена $8-10 в год. Самые дешевые — китайские .icu и .cyou — $4-6.</li>
<li>Хорошее имя удобно и по телефону диктовать и на деловой визитке писать.</li>
<li>Фамилия в домене хороша тем, что можно раздать почту всем однофамильцам, типа:
[email protected] или [email protected] или [email protected]</li>
<li>При регистрации домена обязательно указывать реальные почту и телефон, иначе регистрацию могут
аннулировать. И если вы не сможете продлить домен, система не будет работат так как задумано.
</li>
<li>Я уже говорил про второй фактор?</li>
</ul>
</div>
<p class="top-header-p">
Подключение домена к DNS серверу
</p>
<p class="bottom-p">
После покупки, домен добавляем в CloudFlare:
</p>
<div class="blue-border-img">
<img src="img/add-domain-to-cf.gif" alt="gif">
</div>
<p class="bottom-p">
На примере домена <span class="color-blue">ruleit.stream</span> мы выбрали бесплатный тариф и получили
серверы имен: <span class="color-blue">gail.ns.cloudflare.com</span> и <span
class="color-blue">mattns.cloudflare.com</span>, которые надо прописать у своего регистратора. В
нашем случае <span class="color-blue">NameCheap:</span>
</p>
<div class="blue-border-img">
<img src="img/nc-to-cf.gif" alt="gif">
</div>
<p class="bottom-p">
Заодно проверяем, что у нас включено автопродление и защита персональных данных — <span
class="color-blue">WhoisGuard</span>. Через несколько минут или в худшем случае до 2-ух суток
настройки применятся.
</p>
<h2>
🔑 Создание ключей
</h2>
<div class="blue-border">
<p class="top-p">
API ключи
</p>
<p class="bottom-p">
<i>API ключи</i> — это почти тоже самое, что и логин с паролем, только для программы, а не человека.
Мобильное приложение SelfPrivacy с их помощью управляет сервисами во всех учётных записях вместо вас. Удобно!
</p>
<p class="bottom-p">
Ключи хранить в <a href="https://keepassxc.org/download/">менеджере паролей</a>
</p>
<p class="bottom-p">
Для NameCheap нам ключ не нужен, мы уже все сделали. А домен будет управляться в CloudFlare.
</p>
<p class="header-p">
CloudFlare
</p>
<ul>
<li>Переходим по <a href="https://dash.cloudflare.com/">ссылке</a></li>
<li>В правом углу, кликаем на иконку профиля (человечек в кружочке). Для мобильной версии сайта, в
верхнем левом углу, нажимаем кнопку <b>Меню</b> (три горизонтальных полоски), В выпавшем меню,
ищем пункт <b>My Profile</b></li>
<li>Нам предлагается на выбор, четыре категории настройки: <b>Communication, Authentication, API
Tokens, Session. Выбираем API Tokens.</b></li>
<li>Самым первым пунктом видим кнопку <b>Create Token</b>. С полной уверенностью в себе и желанием
обрести приватность, нажимаем на неё.</li>
<li>Спускаемся в самый низ и видим поле <b>Create Custom Token</b> и кнопку <b>Get Started</b> с
правой стороны. Нажимаем.</li>
<li>В поле <b>Token Name</b> даём своему токену имя. Можете покреативить и отнестись к этому как к
наименованию домашнего зверька :)</li>
<li>Далее, у нас <b>Permissions</b>. В крайнем левом поле выбираем Zone. В самом длинном поле, по центру,
выбираем DNS. В крайнем правом поле выбираем Edit</li>
<li>Далее, прямо под этой строчкой, нажимаем на <b>Add More</b>. Появиться аналогичная строка, такая
же как та, которую мы только что заполняли.</li>
<li>В крайнем левом поле новой строки, выбираем, аналогично прошлой строке — <b>Zone</b>. В
центральном - немного по другому. Тут мы выбираем то же самое что и в левой - <b>Zone</b>. В
крайнем правом поле - выбираем <b>Read</b>.</li>
<li>Далее смотрим на <b>Zone Resources</b>. Под этой надписью есть строка с двумя полями. В левом
должно быть <b>Include</b>, а в правом - <b>Specific Zone</b>. Как только вы выберете
<b>Specific Zone</b>, справа появиться ещё одно поле. В нём выбираем наш домен.
</li>
<li>Листаем в самый низ и нажимаем на синюю кнопку <b>Continue to Summary.</b></li>
<li>Проверяем, всё ли мы правильно выбрали. Должна присутствовать подобная строка: ваш.домен -
<b>DNS:Edit, Zone:Read.</b>
</li>
<li>Нажимаем <b>Create Token.</b></li>
<li>Копируем созданный токен, и сохраняем его в надёжном месте (желательно - в менеджере паролей).
</li>
</ul>
<img src="img/CloudFlare.gif" alt="gif">
<p class="header-p">
Hetzner
</p>
<ul>
<li>Переходим по <a href="https://console.hetzner.cloud/">ссылке</a> и авторизуемся в ранее
созданном аккаунте.</li>
<li>Заходим в созданный нами проект. Если такового - нет, значит создаём.</li>
<li>Наводим мышкой на боковую панель. Она должна раскрыться, показав нам пункты меню. Нас интересует
последний — <b>Security</b> (с иконкой ключика).</li>
<li>Далее, в верхней части интерфейса видим примерно такой список: <b>SSH Keys, API Tokens,
Certificates, Members.</b> Нам нужен <b>API Tokens</b>. Переходим по нему.</li>
<li>В правой части интерфейса, нас будет ожидать кнопка <b>Generate API Token</b>. Если же вы используете
мобильную версию сайта, в нижнем правом углу вы увидите <b>красный плюсик</b>. Нажимаем на эту
кнопку.</li>
<li>В поле <b>Description</b>, даём нашему токену название (это может быть любое название, которые
вам нравиться. Сути оно не меняет.</li>
<li>Под полем <b>Description</b> видим возможность выбрать разрешения <b>permissions</b>. Выбираем
<b>Read & Write</b>.
</li>
<li>Нажимаем <b>Generate API Token</b>.</li>
<li>После этого, нам покажет ваш ключ. Записываем его в надёжном месте, или ещё лучше, сохраняем в
менеджере паролей.</li>
</ul>
<img src="img/Hetzner.gif" alt="gif">
<p class="header-p">
Backblaze B2
</p>
<ul>
<li>Переходим по <a href="https://secure.backblaze.com/user_overview.htm">ссылке</a></li>
<li>В левой части интерфейса выбираем <b>App Keys</b> в подкатегории "B2 Cloud Storage"</li>
<li>Нажимаем на синюю кнопку Generate New Master Application Key</li>
<li>Во всплывающем окне, подтверждаем генерацию</li>
<li>Сохраняем keyID и applicationKey в надёжном месте. Например - в менеджере паролей :)</li>
</ul>
<img src="img/Backblaze.GIF" alt="gif">
<p class="header-p">
🎉 Поздравляю! Теперь вы готовы использовать приватные сервисы
</p>
</div>
</div>
</div>
<footer>
<a href="https://social.selfprivacy.org">
<img src="img/Twitter-Logo.svg" alt="">
</a>
<a href="https://t.me/selfprivacy">
<img src="img/Telegram%20Logo.svg" alt="">
</a>
<a href="https://git.selfprivacy.org">
<img src="img/GitHub%20Logo.svg" alt="">
</a>
</footer>
<!--<script src="js/vendor/modernizr-3.11.2.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
-->
<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
<!--<script>
window.ga = function () { ga.q.push(arguments) }; ga.q = []; ga.l = +new Date;
ga('create', 'UA-XXXXX-Y', 'auto'); ga('set', 'anonymizeIp', true); ga('set', 'transport', 'beacon'); ga('send', 'pageview')
</script>
<script src="https://www.google-analytics.com/analytics.js" async></script>-->
</body>
</html>