Как создать децентрализованный веб-сайт

Создать децентрализованный веб-сайт проще, чем ожидает большинство людей. Фактически, единственная разница между децентрализованным веб-сайтом и обычным сайтом заключается в том, что он размещен в децентрализованной сети. Почти все остальное остается прежним.

В этом руководстве мы рассмотрим процесс создания и запуска децентрализованного веб-сайта. Для прохождения всего процесса вам понадобится домен Web3 и немного ETH в вашем кошельке.

1. Создайте файлы своего веб-сайта

Начните с подготовки необходимых файлов сайта. Кроме того, вы можете скачать бесплатный шаблон веб-сайта у поставщиков шаблонов и использовать его для создания децентрализованного веб-сайта. Мы загрузим шаблон из Free CSS для разработки нашего сайта.

1. Посещать Бесплатный CSS, выберите шаблон и загрузите его. Затем извлеките ZIP-файл в папку, содержащую каждый отдельный файл, как показано ниже.

Если вы создаете сайт с нуля, убедитесь, что все файлы находятся в одной папке.

2. Загрузите файлы вашего сайта в IPFS

IPFS (Межпланетная файловая система) — это самая популярная децентрализованная система хранения файлов, состоящая из глобально распределенной одноранговой сети компьютеров, которые совместно размещают файлы.

Для начала вы можете разместить файлы своего веб-сайта на независимо работающем узле IPFS – персональном компьютере. Проблема с этим маршрутом заключается в том, что ваш компьютер должен быть подключен к сети, чтобы кто-то мог получить доступ к вашему децентрализованному веб-сайту.

Другой вариант — использовать хостинговую платформу IPFS, например Пиньята, Инфура, или Флик для размещения и распространения ваших файлов по сети IPFS, делая их доступными для всех. Однако для использования некоторых из этих услуг вам придется заплатить подписку.

Загрузка на ваш узел IPFS

Во-первых, вам необходимо запустить независимый узел IPFS.

1. Начать с настройка IPFS на вашем ПК. Вы можете загрузить клиент для ПК или использовать расширение браузера Brave для настройки узла IPFS.
2. После того, как вы уже настроили, откройте панель управления IPFS, нажмите Импортироватьи загрузите папку своего веб-сайта.
3. Чтобы проверить, активен ли сайт, нажмите на три точки в правой части файла, выберите Поделиться ссылкой, скопируйте и откройте ссылку IPFS на новой вкладке в Brave. Сайт должен загружаться хорошо, если вы правильно настроили Brave.

Загрузка на Флик

Fleek позволяет пользователям бесплатно загружать веб-сайты в IPFS, а Piñata требует премиум-пакета. Тем не менее, прежде чем вы сможете использовать Fleek, вам необходимо сначала развернуть свой веб-сайт на GitHub.

1. Откройте панель управления GitHub и создайте новый репозиторий. Затем загрузите файлы вашего веб-сайта в репозиторий GitHub с помощью Git, системы контроля версий, хорошо интегрированной с GitHub. Для удобства демонстрации сначала сохраните файл вашего веб-сайта в папке на рабочем столе под названием dWeb
2. Посещать Git-SCM, скачайте и установите последнюю версию Git.
3. Запустите Git Bash из меню «Пуск» вашего ПК и введите:

   cd desktop/dWeb 

   Эта команда позволяет запустить Git внутри папки, которую мы создали на рабочем столе, для инициализации локального репозитория.
4. Затем выполните следующие команды одну за другой:

   git init 
   git add. 
   git commit -m "first commit"
   gitremoteaddorigin[url].git
   

   Где [url] представляет адрес вашего репозитория GitHub. В нашем случае это:

   git remote add origin https://github.com/elgwaro/dWeb.git

Выполнение этих команд инициализирует скрытую папку .git в папке вашего веб-сайта и добавляет все файлы вашего веб-сайта. в папку .git, фиксирует их для загрузки и в конечном итоге загружает файлы в ваш репозиторий GitHub.

Это наиболее эффективный способ загрузки нескольких файлов и папок веб-сайта в репозиторий GitHub, который должен выглядеть, как показано выше.

Вот как связать учетную запись Fleek с GitHub

1. Посещать Флик, войдите в свою учетную запись и нажмите Добавить новый сайт
2. Подключите Fleek к GitHub и авторизуйте доступ к репозиторию с файлами вашего сайта.
3. Fleek отобразит выбранный вами репозиторий. Перейдите к Местоположение развертывания вкладку, выберите IPFS и нажмите Продолжать.
4. Выберите фреймворк (если не уверены, оставьте как Другой) и разверните свой сайт.

Ваш сайт будет развернут на IPFS.

3. Подключите свой домен Web3

Независимо от того, используете ли вы локальный узел IPFS или онлайн-платформу, такую ​​​​как Fleek, на этом этапе ваш сайт должен быть развернут на IPFS, что означает, что у вас есть хэш IPFS сайта.

Итак, следующий шаг — привязка вашего сайта к домену Web3. Вы можете купить его в любом из ведущие регистраторы Web3 в магазине. Стоимость домена будет зависеть от условий платформы, и для доменные системы на основе блокчейна, вы понесете сетевую комиссию за запись транзакции в блокчейне.

Для этой демонстрации мы приобрели elgwaro.eth домен на ENS.

Привязка домена ENS к веб-сайту IPFS

Вот как связать ваш домен ENS с сайтом, размещенным на IPFS.

1. Откройте панель управления ENS и получите доступ к разделу своего доменного имени.
2. Выберите Рекорды вкладку и нажмите Редактировать записи.
3. Выбирать Другой, вставьте ссылку на свой независимый веб-сайт IPFS и нажмите Сохранять.
4. Вам будет предложено подключить свой кошелек для авторизации транзакции, которая будет стоить вам небольшую комиссию в зависимости от активности сети.
5. Как только транзакция пройдет, ваш домен Web3 будет связан с вашим децентрализованным веб-сайтом.

Если вы используете Fleek, вы можете подключить свой домен на панели управления Fleek.

1. Откройте панель развернутого веб-сайта и нажмите Добавить собственный домен.
2. Прокрутите вниз до Информация об ЭНС и нажмите Добавить ЭНС.
3. Введите свой домен ENS и нажмите Проверять а затем подтвердите.
4. Далее нажмите Установить хеш контента. Вам необходимо будет подключить свой кошелек, чтобы авторизовать транзакцию, заплатив небольшую комиссию в зависимости от активности сети. Чтобы успешно настроить ссылку, убедитесь, что подключенная учетная запись кошелька является контроллером домена.

4. Доступ к вашему веб-сайту

После того как вы успешно связали свой домен Web3 со своим децентрализованным веб-сайтом, ваш домен Web3 будет связан с вашим децентрализованным веб-сайтом.

Вы можете получить к нему доступ, используя свой Домен ENS +.link. Например, в данном случае это elgwaro.eth.link. Тем не менее, при использовании браузера с поддержкой IPFS, такого как Brave, вам не нужно включать .связь в конце вашего URL.

Вы успешно создали свой децентрализованный веб-сайт.

Выход за рамки разработки Web2

Поскольку со временем Интернет становится все более децентрализованным, количество децентрализованных веб-сайтов, вероятно, в конечном итоге превысит количество размещенных на централизованных серверах. К счастью, переход от разработки веб-сайтов Web2 к Web3 не так сложен, как кажется. Поэтому, если вы задумались о создании децентрализованного веб-сайта, устойчивого к цензуре, это руководство может дать вам огромное преимущество.