Как создать сайт на компьютере windows 7 - Доктор Windows

Как создать сайт бесплатно самому с нуля – пошагово для чайников

Как создать сайт бесплатно самому с нуля

Как создать сайт бесплатно самому с нуля – именно про это я расскажу в этой сгеодняшней статье простым языком пошагово.

У всех сейчас есть дома персональный компьютер или небольшой ноутбук. Так давайте же исаользовать эти гаджеты с умом! Ведь как просто, имея обычный компьютер или просто ноутбук, можно построить целый бизнес….

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

Чтобы узнать, как построить свой собственный сайт с помощью обычного компьютера (ноутбука) самостоятельно – читайте эту статью.

Далее я объясню пошагово как создать сайт бесплатно самому с нуля и опубликовать его в сети

Я дам вам альтернативы, которые могут быть использованы для создания веб-сайта, так что вы можете выбрать, что подходит вам лучше всего.

Вы можете подумать, что вопрос “как создать сайт бесплатно самому с нуля” является достаточно сложным. И только веб-дизайнеры или программисты смогут сделать это, но не так все страшно).

Посмотрите новые отличные ноутбуки на Яндекс.Маркете!

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

Есть 3 ключевых компонента, которые необходимы для создания веб-сайта на ПК

Доменное имя;
Веб-хостинг;
Конструктор сайтов.

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

ШАГ 1

Домен, регистрация доменного имени

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

Существует множество доменных расширений, из которых вы можете выбрать, однако наиболее популярными и лучшими доменами являются .ru, .com и .рф

Если ваш сайт будет ориентирован на конкретную страну, вы должны выбрать домен конкретной страны, например .ru (для России), .co.uk (для Соединенного Королевства), com.au (Австралия),. de (Германия) и так далее.

Например мой адрес сайта https://pc-reanimator.ru/. Где pc-reanimator.ru – это домен. .ru – это доменная зона. К примеру .us – это доменная зона США, .com – это международная общая доменная зона и т.д.

Каждый домен по своему уникален, и может быть зарегистрирован один раз – если вы не знаете как создать сайт бесплатно самому с нуля – вы должны это понимать.

Так, например, вы не сможете зарегистрироваться google.com или yandex.ru, потому что эти домены уже зарегистрированы.

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

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

Совет! Всегда держите свой ноутбук на зарядке, если работаете на нем! Если резко отключат электричество, то вы ничего не успеете сохранить.

Домен, который вы выбираете, может быть ключевым словом (или несколькими ключевыми словами, описывающими ваш сайт и бизнес). Или может быть вашим фирменным знаком или названием компании.

Всегда регистрируйте свои домены в компаниях, которые аккредитованы и имеют хорошую репутацию. Таким образом, вы можете быть уверены, что ваш домен будет в надежных руках.

Домен .ru будет стоить вам примерно около 200 – 1000 р. в год, в зависимости от регистратора доменов. Однако большинство веб-хостинговых компаний, таких как BlueHost, InMotion или iPage, предоставят вам бесплатное доменное имя. Если вы купите у них веб-хостинг.

ШАГ 2

Как же создать сайт на ПК – получение учетной записи веб хостинга

Второй шаг в том, чтобы купить план веб хостинга, где вы будете загружать свой сайт. Веб хостинг – это в основном большая комната или здание (называемое дата центром). Где несколько высокопроизводительных компьютеров подключены к интернету.

Эти компьютеры принадлежат и управляются провайдером веб хостинга.

При покупке веб хостинга вы фактически арендуете очень небольшую часть компьютера. Вам кажется вопрос как создать сайт бесплатно самому с нуля очень сложный? Это не так, продолжаем….

С таким количеством хостинг провайдеров и планов трудно сделать правильный выбор. Я дам вам несколько советов о том, как выбрать правильный хостинг план для вашего сайта.

Если вы планируете продавать товары в интернете, и вам нужен веб сайт типа электронной коммерции, вы должны выбрать VPS (виртуальный частный сервер).

Это даст вам более высокий контроль и безопасность над вашим сайтом за дополнительную плату.
Вероятно, вам не понадобится выделенный сервер.

Однако, если ваш трафик сайта вырастет до тысяч ежедневных посетителей, вам он обязательно понадобится.

Вы можете подумать, что хостинг – это дорого, но это не так. Хостинг стоит около 700 р. в месяц. После того, как ваш домен и учетная запись веб хостинга будут на месте, вы можете начать разработку вашего сайта.

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

Потрясающих, профессионально выглядящих, полностью функциональных веб сайтов в кратчайшие сроки. Я приведу вам несколько примеров инструментов и их использования:

Website Builders: это отличное программное обеспечение, которое предназначено для людей, не имеющих навыков программирования.

Эти типы инструментов поставляются с очень удобным интерфейсом и функциональностью перетаскивания, что дает пользователю возможность полностью настроить веб-сайт с нажатием нескольких кнопок.

Обычно веб строители приходят с готовыми шаблонами для разных ниш,которые можно настроить. Например, конструктор веб сайтов HostGator имеет сотни доступных шаблонов, из которых вы можете выбрать.

Я рекомендую использовать конструктор сайтов для небольших статических веб сайтов, которые не будут часто обновляться.

ШАГ 3

Третий шаг это выбор движка сайта. Самые популярные в 2021 году это вордпресс и битрикс. Я настоятельно рекомендую именно Вордпресс. Он простой и понятный и под него есть куча плагинов.

WordPress:

Является бесплатным и является одной из самых популярных систем управления контентом, используемых более чем 75 миллионами веб сайтов по всему миру.

Это программное обеспечение требует немного больше времени, чтобы узнать, но использование программного обеспечения очень легко, как только вы узнаете, как это работает.

Не требуется знать программирование для создания и управления сайтом WordPress. Есть сотни сайтов, полных учебников и руководств по использованию WordPress.

Для блога или веб сайта, который будет часто обновляться, WordPress будет правильным выбором. Для размещения вашего сайта WordPress я настоятельно рекомендую BlueHost.

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

Поэтому, если вы хотите создать сайт на компьютере самому, с помощью site builder, лучшим вариантом является использование HostGator GATOR. Их план premium website builder начинается с 175 р. / месяц и включает в себя бесплатный домен.

Инструменты для настройки вашего сайта, не касаясь кода, статистику сайта для движения вашего трафика на сайте.

Веб-сайты, созданные с помощью конструктора веб сайтов Gator. Размещаются на их облачной платформе хостинга, что обеспечивает более высокую производительность.

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

Для размещения вашего сайта WordPress я рекомендую BlueHost или InMotion. Обе компании предлагают схожие услуги по практически одинаковой цене. Мой любимый, однако, BlueHost.

iPage – еще один хороший вариант для хостинга WordPress, но я рекомендую их только для небольших сайтов.

Их цена самая низкая, начиная всего с 60 р.месяц Если вы находитесь на низком бюджете, вероятно, это лучшее, что вы можете получить.

Кстати, если вам все же не хочется разбираться в сайтостроении и программировании, вникать в вопросы, знаю отличный сайт https://ws-helper.ru/. Где вам окажут техническую поддержку и помогут в доработке ваших интернет площадок.

Теперь вы знаете как создать сайт бесплатно самому с нуля. Читайте также статью про то какой щас мощнейший в мире процессор!

Как сделать сайт с нуля за 20 минут на Google Sites

НА ГЛАВНУЮ

Подписывайтесь на мой канал!

У вас есть сайт, блог, или группы в соц.сетях? Регистрируйтесь в Яндекс.Дистрибуции и зарабатывайте ₽ через рекламу товаров и услуг!

Источник

Для разработки и тестирования сайтов или веб-приложений обычно используют локальный Web-сервер, а после разработки переносят уже на рабочий сервер. Поэтому сегодня я предлагаю рассмотреть возможность установки локального web-сервера на операционную систему Windows 7, и так как у нас сайт для начинающих разработчиков, мы будем использовать готовую сборку web-сервера на примере XAMPP.

И начнем мы с основ, т.е. узнаем, что же это такое сборка web-сервера, из чего она состоит, зачем она нужна, в частности разберем сборку XAMPP, установим ее и, конечно же, проверим ее работу.

Содержание

Что такое сборка Web-сервера?
Что такое XAMPP?
Где скачать XAMPP?
Установка XAMPP
Шаг 1
Шаг 2
Шаг 3
Шаг 4
Шаг 5
Запускаем и проверяем работу Apache, PHP и MySQL

Сборка Web-сервера – это некий комплект приложений необходимых для функционирования сайтов, после развертывания которого, можно сразу переходить к их разработке, не отвлекаясь и не вникая в настройки каждого компонента web-сервера.

В сборку web-сервер обычно входит как минимум 3 компонента: это непосредственно сам HTTP сервер, средство разработки сайтов, т.е. библиотеки языка программирования, интерпретатор и т.д., и система управления базами данных. Для таких сборок используется бесплатное программное обеспечение, поэтому самыми распространенными компонентами являются веб сервер Apache, СУБД MySQL, языки программирования PHP и Perl.

Если говорить о том, для чего вообще нужна такая сборка, так как Вы сами понимаете, что все это в отдельности устанавливается и настраивается, то она нужна в основном для того, чтобы облегчить жизнь начинающим разработчикам, чтобы они могли просто установить одну программу и сразу начать, скажем, учиться программировать (создавать сайты). Для примера в качестве операционной системы нашего локального web сервера мы будем использовать Windows 7, так как именно ОС Windows от компании Microsoft широко используется у нас в России.

Конечно же, после того как разработка сайта или веб приложения окончена, необходимо перенести все на рабочий сервер, который скорей всего будет использовать операционную систему на базе Linux. Например, мы с Вами уже рассматривали возможность установки и настройки полноценного, рабочего web-сервера на CentOS 7.1, где мы как раз по отдельности устанавливали и настраивали каждый из компонентов web-сервера, там мы использовали Apache, PHP и MySQL. Также если кому интересна установка СУБД MySQL на Windows, то это мы подробно рассмотрели вот здесь.

Примечание! Использовать сборку веб сервера на продакшн хостинге для сайтов не рекомендуется, тем более что сами разработчики предупреждают, что эти сборки не предназначены для внедрения в производство.

В число самых популярных сборок web-сервера входят: Denwer, Open Server, XAMPP, WampServer. Как видно из названия статьи, сегодня мы будем рассматривать XAMPP.

Что такое XAMPP?

XAMPP — это бесплатная, кроссплатформенная сборка веб-сервера, которая включает Apache, MySQL PHP и Perl.

Как не трудно догадаться XAMPP — это аббревиатура:

X – означает, сборка есть под все операционные системы (Windows, Linux, OS X);
A – Apache;
M – MySQL;
P – PHP;
P – Perl.

Официальный сайт — https://www.apachefriends.org/ru/index.html

В последнюю, на сегодняшний день (Июнь 2015), сборку XAMPP для Windows включено следующее программное обеспечение: Apache 2.4.12, MySQL 5.6.24, PHP 5.6.8, phpMyAdmin 4.3.11, OpenSSL 1.0.1, XAMPP Control Panel 3.2.1, Webalizer 2.23-04, Mercury Mail Transport System 4.63, FileZilla FTP Server 0.9.41, Tomcat 7.0.56 (with mod_proxy_ajp as connector), Strawberry Perl 7.0.56 Portable.

Где скачать XAMPP?

Загрузить данную сборку можно со страницы загрузки официального сайта — https://www.apachefriends.org/ru/download.html

И так как мы будем устанавливать XAMPP на Windows, то соответственно и скачиваем дистрибутив под эту операционную систему, например, я хочу скачать версию XAMPP с PHP 5.6.8 для этого, и жму соответствующую ссылку.

После чего у нас загрузится дистрибутив размером 107 мегабайт.

Данная сборка поддерживает операционные системы Windows, начиная с Vista.

Установка XAMPP

Приступаем к установке сборки Web-сервера XAMPP, она простая, поэтому проблем возникнуть не должно.

Шаг 1

Запускаем скаченный файл xampp-win32-5.6.8-0-VC11-installer.exe. Первое окно программы установки — это окно приветствия, жмем «Next».

Шаг 2

Далее, выбираем компоненты, которые нужно установить, по умолчанию выбрано все, но если Вы не хотите что-то устанавливать, т.е. Вам это не нужно, то можете снять галочку с соответствующего пункта, например, мне не нужен Perl, жмем «Next».

Заметка! Преимущества разных видов хостинга: выбираем оптимальный вариант для своего сайта.

Шаг 3

Затем выбираем каталог, в который мы будем устанавливать XAMPP, я оставлю по умолчанию, жму «Next».

Шаг 4

На этом шаге мы можем оставить или убрать галочку «Узнать больше о Bitnami для XAMPP», я галочку убрал, жму «Next».

Шаг 5

Все готово к установке, жмем «Next».

Установка началась.

После того как установка будет завершена, нам предложат сразу запустить «Control Panel», жмем «Finish».

Вот и все, у нас запустилась панель управления XAMPP.

Запускаем и проверяем работу Apache, PHP и MySQL

Как мы видим, сразу после установки все сервисы не запущены, поэтому мы запускаем их кнопкой «Start».

Зеленым выделены те сервисы, которые в данный момент запущены.

Сначала давайте проверим работу Apache, для этого просто в браузере набираем localhost, и если мы увидим следующую картину, то значит все в порядке.

Для проверки MySQL и PHP давайте напишем простой скрипт на PHP, который проверит подключение к базе данных MySQL. Для этого создаем в каталоге C:xampphtdocs папку test, кстати, все, что находится в папке htdocs, можно удалить. В папке test создаем файл index.php со следующим кодом;

<?php
        ini_set('display_errors', 1); //Включаем вывод ошибок на страницу
        $dbServer = "127.0.0.1"; //Адрес сервера БД
        $dbname = "mysql"; //База данных (тестовая по умолчанию)
        $dbuser = "root"; //Имя пользователя БД
        $dbpass = ''; //Пароль пользователя БД (по умолчанию его просто нет)
        //Подключаемся к серверу
        $dbconn = @mysql_connect($dbServer, $dbuser ,$dbpass);
        //Проверка доступности сервера
        if (!$dbconn){
                echo "<p>Сервер баз данных недоступен</p>";
                exit();
        }
        //Проверка доступности базы данных
        if (!@mysql_select_db($dbname,$dbconn)){
                echo "<p>База данных недоступна</p>";
                exit();
        }
        //Простой запрос, узнаем версию MySQL 
        $VERSION = mysql_query("SELECT VERSION()");
        if(!$VERSION){
                echo "<p>Ошибка в запросе</p>";
                exit();
        }
        echo mysql_result($VERSION, 0);
?>

Сохраняем и в браузере обращаемся по адресу http://localhost/test/ в ответ мы должны получить версию MySQL.

Если Вы это удивили, значит и Apache и PHP и MySQL запущены и работают.

Теперь немного расскажу о панели управления XAMPP. Запустить ее можно через меню «Пуск->Все программы->XAMPP».

После запуска в системном трее появится значок для быстрого управления, т.е. запуска и остановки сервисов.

Заметка! ТОП 5 популярных CMS для блога.

На этом предлагаю заканчивать, так как все готово для разработки сайтов на базе Apache, MySQL и PHP, еще раз замечу, что данная сборка подходит исключительно для разработки и тестирования веб приложений, использовать ее в качестве рабочей платформы для сайтов не рекомендуется. Удачи!

Источник

Обновили в январе 2022 года.

Для проведения тестов, отладки или предварительной сборки нужно быстро «поднять» сайт не на хостинге, а на локальном компьютере, а затем перенести ресурс на сервер хостинг-провайдера. Вот как это можно сделать.

Как подготовить компьютер к работе с локальным сервером

Чтобы запустить локальный сервер на компьютере, придется изменить настройки некоторых программ или операционной системы. Для работы серверов нужно освободить порт 80. Его часто занимает служба Internet Information Services (IIS). Чтобы убедиться в этом, введите в командную строку команду netstat -aon | findstr 0.0:80. Если порт 80 действительно занимает системный процесс, в диалоговом окне в последнем столбце вы увидите значение «4».

Чтобы отключить IIS, в панели управления выберите меню «Программы и компоненты – Включение и отключение компонентов Windows». Снимите флаг напротив опции «Службы IIS» и сохраните изменения. Может потребоваться перезагрузка системы.

Снимаем выделение с этого чекбокса

Если открыть «Программы и компоненты» в вашей версии Windows не удалось, есть еще один способ. Используйте сочетание горячих клавиш Win+R. Откроется окно «Выполнить», где нужно указать команду appwiz.cpl

Если изменение настроек системы не помогло, отключите брандмауэр и антивирусное ПО. Некоторые сетевые экраны блокируют порт 80.

Если этот шаг не помог, скачайте и запустите надстройку для Windows TCP View. Программа не требует установки. С ее помощью вы увидите список активных процессов и используемых портов. Найдите процесс, который занимает порт 80, и отключите связанную с ним программу на время работы с локальным сервером.

Если его в списке нет, приступайте к установке локального сервера

Продвинем ваш бизнес

В Google и «Яндексе», соцсетях, рассылках, на видеоплатформах, у блогеров

Подробнее

Desktop Server – запускаем сайт на WordPress локально

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

Вот подробная инструкция по работе с плагином:

загрузите плагин DesktopServer для WordPress и активируйте его;
выберите «Экспорт», а затем установите флажок «Получить сведения о реальном сервере хостинга»;
для получения дополнительной информации посетите http://serverpress.com/.

Активируйте Desktop Server и воспользуйтесь меню Create New development site. По умолчанию установочный пакет содержит устаревшую версию CMS WordPress. Вы можете скачать и загрузить в папку Xampplite – Blueprints (по умолчанию она распаковывается на системный диск) дистрибутив актуальной версии WordPress.

Выберите подходящий дистрибутив с помощью выпадающего меню, укажите название экспериментального сайта и нажмите кнопку Create.

Обратите внимание на путь к корневой папке сайта. Он должен быть корректным (там не должно быть кракозябры или кириллицы)

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

После перехода по URL нажимаем Next

Выберите язык. Укажите название сайта, имя пользователя, e-mail и пароль.

Заполняем название, имя пользователя, пароль и электронную почту

Браузер отобразит страницу приветствия. Чтобы войти в административную консоль, введите созданный на предыдущем шаге пароль.

Мы получили доступ к админке WordPress

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

Создали первую запись, которая выводится на главной – все как при работе с сайтом на обычном хостинге

Как запустить сайт на Open Server

Open Server дает возможность работать без установки ПО на компьютер. Вы можете запускать сервер с USB-накопителя.

Скачайте дистрибутив с официального сайта проекта. Open Server можно использовать бесплатно. Разработчики предлагают сделать пожертвование на развитие проекта. Без платежа скорость загрузки дистрибутива сильно ограничена. Скачивать полный пакет придется несколько часов.

Активируйте инсталлятор и укажите путь для распаковки архива. По умолчанию программа предлагает установку на системный диск, но вы можете изменить параметры. Запустите исполняемый файл в папке Open Server и выберите язык.

Нужно открыть установочный файл. Для корректной распаковки понадобится минимум 7 ГБ свободного пространства на жестком диске

Если все сделано верно, в трее появится красный флажок. Нажмите на него, чтобы начать работу с сервером.

Обратите внимание на иконку программы в трее

Нажмите кнопку «Запустить». Затем введите в адресную строку браузера адрес http://localhost/. Вы увидите страницу приветствия.

Успешно подняли сервер на локальном компьютере

Теперь установите на локальный сервер выбранную CMS. Для этого создайте новую папку в разделе Domains. Распакуйте в нее архив с дистрибутивом движка.

Мы создали новую папку

Перезапустите Open Server с помощью меню в трее.

Нажмите кнопку «Перезапустить»

Какую CMS выбрать: руководство по выбору «движка» для сайта

Введите в адресной строке браузера URL экспериментального сайта. Вы попадете в меню установки CMS.

После выбора языка продолжаем устанавливать новый сайт на локальный сервер

Для продолжения установки необходимо создать базу данных. Через меню Open Server войдите в панель управления phpMyAdmin. Для доступа к серверу введите имя пользователя root, а поле «Пароль» оставьте пустым.

Нажмите PHP Adminer

В панели управления phpMyAdmin выберите вкладку «Базы данных» и создайте БД экспериментального сайта.

Сперва проходим авторизацию в Adminer

В меню установки WordPress укажите название БД и имя пользователя. Завершите установку: укажите название сайта, имя пользователя, пароль, электронный адрес администратора.

Заполняем данные для подключения сайта к базе данных

Теперь вы можете работать с сайтом на локальном сервере.

Как работать с локальным сервером Denwer

Denwer остается очень популярным среди веб-мастеров и профессиональных разработчиков, хотя многие специалисты называют это ПО устаревшим. Тем не менее, его возможностей достаточно для запуска и настройки сайтов на популярных CMS.

Скачайте дистрибутив с сайта проекта. Закройте браузеры и запустите установщик. Используйте подсказки в диалоговом окне инсталлятора. После завершения установки браузер откроет окно приветствия. Запустить программу можно с помощью ярлыка на рабочем столе Start Denwer. Если его нет, идем в директорию с программой и запускаем ярлык Run:

Откройте ярлык двойным кликом

В адресную строку браузера введите URL http://localhost/denwer/. Вы попадете на стартовую страницу локального сервера Denwer.

Локальный сервер работает корректно

Чтобы установить CMS на локальный сервер «Денвер», создайте раздел с названием сайта в папке WebServers – Home. В разделе создайте еще одну папку с именем www. Распакуйте в нее архив с дистрибутивом движка.

Мы создали папку testik.io

В разделе создайте еще одну папку с именем www. Распакуйте в нее архив с дистрибутивом движка.

Сюда нужно скопировать движок сайта

Создайте базу данных экспериментального сайта в разделе управления phpMyAdmin. Для этого введите в адресную строку браузера адрес http://localhost/tools/phpMyAdmin/

Нажимаем кнопку «Создать»

Перезапустите локальный сервер с помощью ярлыка Restart Denwer на рабочем столе. Установите WordPress. Для этого в адресной строке браузера наберите адрес экспериментального сайта.

Denwer не подвел – сайт на локальном компьютере запускается

После окончания разработки перенесите сайт с локального сервера на сервер хостинг-провайдера.

Чтобы удалить «Денвер», выполните следующие действия:

остановите сервер с помощью ярлыка Stop Denwer на рабочем столе;
в командную строку введите команду subst z: /d. Это необходимо для удаления виртуального диска Z, который создается при установке ПО «Денвер». Если вы вместо значения по умолчанию Z использовали другое название виртуального диска, укажите это в команде;
удалите папку WebServers с диска C;
удалите ярлыки управления локальным сервером с рабочего стола.

Как создать сайт на локальном сервере Xampp

Xampp – популярный программный комплекс для создания локального сервера Apache. Чтобы установить ПО, скачайте дистрибутив и запустите инсталлятор. Во время установки оставьте настройки по умолчанию.

В папке Xampp активируйте контрольную панель: запустите приложение xampp-control. На панели запустите сервер Apache и базу данных.

Активируем работу сервера

Введите в адресную строку браузера URL http://localhost. Если Xampp работает корректно, вы попадете на страницу-приветствие.

Успешно подняли сервер на домашнем компьютере

Создайте базу данных экспериментального сайта. Для этого введите в адресную строку браузера URL http://localhost/phpmyadmin/. На вкладке «Базы данных» укажите название БД и нажмите кнопку «Создать».

Укажите название, выберите кодировку БД и нажмите кнопку «Создать»

Установите на локальный сервер WordPress. Скачайте дистрибутив с официального сайта и разархивируйте его в папку xampp – htdocs. Укажите URL тестового сайта в качестве названия папки с файлами движка.

Чтобы завершить установку CMS, введите в адресную строку браузера URL http://localhost/folder-name. Вместо значения folder-name укажите название папки с файлами CMS.

Выбираем язык для админки CMS

Завершите установку и проверьте работоспособность сайта.

Сайт на локальном сервере работает

Хостинг: как выбрать и на какие технические возможности обратить внимание

Как пользоваться локальным сервером Winginx

Winginx – локальный сервер, с помощью которого можно быстро создать сайт на своем компьютере. Скачайте дистрибутив и запустите программу-установщик. После установки ПО нажмите на иконку Winginx в трее и включите компоненты программы.

Активируем сервер Winginx

Перейдите по ссылке «Рабочая среда Winginx», чтобы вызвать панель управления программой. Создайте новый проект и укажите адрес экспериментального сайта.

Создаем новый проект

Перейдите в панель управления phpMyAdmin с помощью меню «Менеджеры баз данных – phpMyAdmin». Создайте базу данных экспериментального сайта.

Нам нужно создать новую базу данных

Откройте папку сайта с помощью соответствующего меню в панели управления Winginx.

Нажмите кнопку «Открыть папку сайта»

Разархивируйте дистрибутив выбранной CMS в каталог public_html.

Выберите конечную папку и извлеките все файлы

Введите в адресную строку браузера адрес wp-admin/install.php и установите движок на сервер.

Обратите внимание на удобный планировщик задач в панели управления Winginx. С его помощью можно планировать работу над сайтом, контролировать выполнение задач и учитывать рабочее время.

Запланировали две задачи

Как перенести действующий сайт на локальный сервер

Если вы хотите изменить существующий сайт без риска потерять данные или нарушить его работоспособность, перенесите ресурс на локальный сервер.

Если вы используете WordPress, действуйте так:

запустите локальный сервер и установите на него WordPress;
установите на локальном сайте дизайн-шаблон, который вы используете на реальном ресурсе;
установите на действующий сайт и активируйте плагин Duplicator;
в административной консоли выберите меню «Duplicator – Пакеты». Нажмите кнопку «Создать новый».

Сперва создаем новый пакет

Скачайте созданные пакеты на жесткий диск компьютера. Перенесите их в корневой каталог ресурса на локальном сервере.

Проверяем все элементы бэкапа

Введите в адресную строку браузера путь к файлу installer.php на тестовом ресурсе. Вы попадете на страницу установки базы данных.

Делаем диплой файлов сайта и база данных

Удалите из корневой директории тестового ресурса файлы install.php и wp-config.php.

Укажите имя пользователя и название базы данных экспериментального сайта. Отметьте, что вы прочитали техническое предупреждение и запустите установку копии ресурса на локальный сервер.

Запускаем диплой

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

Вы можете перенести сайт с сервера хостинг-провайдера на экспериментальный ресурс на локальном сервере без помощи плагинов. Для этого можно воспользоваться функцией «Экспорт» в административной консоли.

Выберите элемент сайта, который нужно экспортировать

С помощью функции «Импорт» можно загрузить полученный файл на локальный сервер.

Выбирайте необходимые элементы сайта

Если вы пользуетесь не WordPress, в панели управления phpMyAdmin выберите базу данных экспериментального сайта. Укажите обычный способ экспорта, при котором отображаются все настройки. Выберите метод сжатия gzip. Не меняйте другие настройки. Запустите экспорт БД.

Выбираем способ экспорта

Браузер загрузит на жесткий диск ПК файл с расширением sql.gz. Его необходимо импортировать на сервер хостинг-провайдера. Для этого в панели управления сервером выберите меню «Базы данных – phpMyAdmin».

Нужно открыть админку phpMyAdmin

На вкладке «Импорт» загрузите файл с базой данных.

Выбираем файл для импорта

Описанными способами сайты можно переносить с локального сервера на сервер хостера и обратно. Также для создания копии ресурса и последующего переноса вы можете воспользоваться инструментами резервного копирования базы данных, например, плагином для WordPress WP Database Backup или аналогами для других движков.

Как заказать хороший сайт: пошаговое руководство для чайников

Какой локальный сервер выбрать

Для рядового пользователя подойдет любой из описанных вариантов. Работа с предложенным ПО позволяет установить сайт на локальную машину, настроить, протестировать и перенести ресурс на сервер хостинг-провайдера.

Если вы пользуетесь CMS WordPress, обратите внимание на Desktop Server. Установка и настройка этой программы занимают меньше времени по сравнению с другими продуктами. Благодаря плагину для WordPress вы также ускорите перенос готового сайта на сервер хостера.

Если вы работаете с другими CMS, используйте любой из предложенных локальных серверов. Например, с Winginx вы сможете запустить сайт и контролировать разработку с помощью удобного планировщика в панели управления программой.

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

Источник

Загрузить PDF

Вас интересует веб-дизайн? Чтобы попробовать свои силы в создании веб-страниц, необязательно пользоваться сложными программами. Веб-страницу можно создать в Блокноте, предустановленном на компьютерах с Windows. В качестве языка программирования будет использован HTML — HyperText Markup Language (язык гипертекстовой разметки). Вы можете написать HTML-код страницы в Блокноте или любом другом текстовом редакторе, а затем просто сохранить файл как HTML-документ. Этот язык легко изучить, даже если у вас нет навыков программирования. Итак, в нашей статье мы расскажем, как создать простую веб-страницу с помощью Блокнота.

1

Откройте меню «Пуск»

. Нажмите на логотип Windows в нижнем левом углу экрана. На экране появится меню «Пуск».
2

Найдите Блокнот. Введите блокнот в меню «Пуск». Вверху меню появятся результаты поиска.
3

Щелкните по Блокнот. Это голубой значок в виде блокнота верхней части результатов поиска. Откроется Блокнот.
4

Откройте меню Файл. Оно находится в верхнем левом углу окна Блокнота.
5

Нажмите Сохранить как…. Эта опция находится в открывшемся меню «Файл». Откроется окно «Сохранить как».
6

Откройте выпадающее меню «Тип файла». Оно находится в нижней части окна; в нем отобразится опция «Текстовые документы (*.txt)». Нажмите на нее, чтобы появилось выпадающее меню.
7

Щелкните по Все файлы. Эта опция находится в выпадающем меню. Теперь файл можно сохранить как HTML-документ.
8
Выберите папку для сохранения. Для этого нажмите на нужную папку на левой панели окна.
- Например, чтобы сохранить документ на рабочем столе, прокрутите вверх и нажмите «Рабочий стол» на левой панели.
9
Введите имя файла и расширение «html». Нажмите на текстовое поле «Имя файла», введите имя файла, а затем введите .html.
- Например, чтобы назвать файл веб-страницы «hello», введите hello.html.
10
Нажмите Сохранить. Текстовый документ будет сохранен как документ HTML. Теперь можно перейти к созданию структуры веб-страницы.
- Если Блокнот неожиданно закрылся или вы хотите вернуться к документу позже, щелкните правой кнопкой мыши по HTML-файлу и в меню выберите «Изменить».
Реклама

1

Добавьте языковой тег. Первый тег, который нужно добавить в Блокнот, указывает всему документу, что будет использоваться язык HTML. В Блокноте введите следующее:
2
Добавьте теги «head». Этот раздел HTML-документа содержит метаданные веб-страницы. В веб-браузере они не отображаются. Здесь может содержаться такая информация, как имя страницы, таблицы стилей (CSS), скрипты и так далее. Сейчас просто введите <head> после тега <html>, дважды нажмите ↵ Enter, чтобы вставить пустые строки, а затем введите </head>.
- Каждый HTML-элемент должен находиться между двумя тегами. Когда мы добавляем новый элемент, например тег «<head>», открывающий соответствующий раздел, нам нужно добавить и закрывающий тег. В данном случае это «</head>».
3

Введите имя страницы. Оно должно находиться внутри раздела «head», так что его нужно ввести между открывающим тегом «<head>» и закрывающим «</head>». Чтобы добавить имя, наберите открывающий тег <title>, затем введите текст (собствнно имя) и сразу за ним добавьте закрывающий тег </title>. Например, если именем вашей страницы будет «Мой сайт», введите следующее:
4

Добавьте теги «body». Все, что будет отображаться на вашей странице в веб-браузере, должно находиться между этими тегами. Под тегом </title> введите:
5

Закройте тег языка HTML. Последним тегом документа будет закрывающий тег «html», чтобы обозначить конец страницы. Введите </html> под тегом </body>, чтобы закрыть тег HTML.
6
Просмотрите HTML-документ. На данном этапе документ должен выглядеть следующим образом:
```
<!DOCTYPE html>
<html>

<head>
<title>Мой сайт</title>
</head>

<body>

</body>

</html>
```
7

Сохраните документ. Для этого нажмите «Файл» и затем «Сохранить» на панели меню. В качестве альтернативы для сохранения документа можно нажать Ctrl+S. Не забывайте чаще сохранять его в процессе работы.

Реклама

1

Запомните, что все элементы веб-страницы должны находиться между тегами «body». Любой элемент — будь то заголовок или абзац — нужно вводить после тега <body> и перед тегом </body>.
2
Добавьте основной заголовок сайта. Введите <h1></h1> между тегами «body», а затем введите заголовок внутри тегов <h1></h1>. Например, чтобы создать страницу с заголовком «Добро пожаловать», введите следующее:
```
<h1>Добро пожаловать</h1>
```
- Используйте теги от <h2></h2> до <h6></h6>, чтобы создать заголовки меньшего размера.
3
Добавьте текст на страницу. Введите теги абзаца <p></p>, а затем введите текст внутри этих тегов. Результат должен выглядеть примерно так:
```
<p>Это мой сайт. Голосуйте за меня на выборах!</p>
```
4
Вставьте разрыв абзаца. Чтобы добавить пустые строки между абзацами или заголовками, введите <br> после закрывающего тега строки. Например, чтобы создать разрыв строки после абзаца, введите следующее:
```
<p> Это мой сайт. Голосуйте за меня на выборах!</p><br>
<p>А еще я люблю картошку</p>
```
- После первого тега <br> можно ввести такой же тег, чтобы добавить еще один разрыв строки, то есть между двумя абзацами будут две пустые строки.
- Для разрыва абзаца закрывающий тег не нужен.
5
Отформатируйте текст. Полужирным, наклонным или подчеркнутым, а также надстрочным и подстрочным можно сделать слово, предложение или блок текста, если они находится между тегами абзаца. Для форматирования используйте следующие теги:
```
<b>Полужирный текст</b>
<i>Наклонный текст</i>
<u>Подчеркнутый текст</u>
<sub>Подстрочный текст</sub>
<sup>Надстрочный текст</sup>
```
6
Добавьте на страницу изображение. Чтобы изображение можно было добавить на веб-страницу, оно должно быть загружено на сервер в интернете, и вам нужно знать веб-адрес этого изображения. Наберите <img src=, затем адрес изображения в кавычках. В конце добавьте закрывающий значок >. Вот пример, как это должно выглядеть:
```
<img src="https://www.mywebsite.me/images/me.jpg">
```
- Если изображение хранится не в интернете, а на вашем компьютере, вместо веб-адреса можете использовать путь к его местоположению. Например: <img src="C:UsersusernamePicturesme.jpg">
7
Добавьте на страницу ссылку. Ссылки — важнейший аспект веб-разработки. Они позволяют пользователям переходить с одной страницы на другую. Чтобы добавить ссылку, вам нужно знать адрес веб-страницы, на которую она будет вести. Наберите <a href=, затем веб-адрес нужной страницы в кавычках. В конце добавьте закрывающий значок >. Затем сразу за ним наберите текст ссылки и закрывающий тег </a>. Вот пример того, как добавить на веб-страницу ссылку:
```
<a href="https://www.mywebsite.me/ipage2">Вторая страница</a>
```
- Вы также можете добавить ссылку на адрес электронной почты или использовать вместо текста ссылки изображение.

Просмотрите внешний вид веб-страницы. Хотя элементы веб-страницы могут различаться, документ должен выглядеть примерно так:

<!DOCTYPE html>
<html>

<head>
<title>Мой сайт</title>
</head>

<body>

<h1>Добро пожаловать!</h1>
<a href="https://www.mywebsite.me/ipage2">Вторая страница</a>
<img src="https://www.mywebsite.me/images/me.jpg">
<p>Это мой сайт. Надеюсь, он вам понравится!</p>
<p><b>Полужирным текстом выделены главные моменты.</b></p>
<p><i>Курсив выглядит зловеще.</i></p>

</body>
</html>

1

Сохраните документ. Для этого нажмите Ctrl+S. Теперь, когда вы откроете документ HTML, отобразится последняя версия вашей веб-страницы.
2

Щелкните правой кнопкой мыши по HTML-документу. Откроется меню.
3

Выберите Открыть с помощью. Эта опция находится в меню. Откроется новое меню.
4

Выберите веб-браузер. HTML-документ можно открыть в любом браузере, поэтому в меню выберите предпочитаемый веб-браузер. HTML-документ откроется в окне веб-браузера.
5

Реклама

Об этой статье

Эту страницу просматривали 206 250 раз.

Была ли эта статья полезной?

Источник

Как создать сайт бесплатно и самостоятельно с полного нуля не имея технических знаний? Что такое «домен» и «хостинг» и зачем они нужны? Что такое «HTML-сайт», «CMS-система» и «конструктор сайтов» и в чем их ключевые отличия друг от друга?

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

Технические аспекты создания сайта
- Конструкторы сайтов
  - Простой пример создания сайта
- CMS-системы
  - Топ бесплатных CMS-систем
  - Топ платных CMS-систем
- Самостоятельное создание сайта
  - Создание HTML-сайта
  - Ключевые этапы создания сайта
  - Создание макета сайта
  - Верстка сайта
  - Создание сайта с помощью PHP
- Создавать сайт с нуля или на конструкторе сайтов?
- Полезные программы для начинающих вебмастеров
Публикация созданного сайта в сети Интернет
- Что такое «домен» и зачем он нужен
- Как выбрать домен
  - Где можно купить домен?
- Что такое «хостинг»
- Как выбрать хостинг
- Размещение готового сайта на сервере
Вместо заключения

Ответы на вопросы
- Можно ли создать полноценный сайт абсолютно бесплатно?
- С чего начать обучение будущему вебмастеру (создателю сайтов)?
- Как найти и выбрать специалистов для создания сайта
- Где можно пройти профессиональное обучение созданию сайтов?
- Можно ли бесплатно изучить основы сайтостроения?
- Можно ли самостоятельно создать собственный сайт?
- Можно ли заработать на создании сайтов?

Технические аспекты создания собственного сайта во многом зависят от правильного выбора необходимых инструментов. Прежде всего, стоит понимать, что на сегодняшний день существует три основных способа самостоятельного создания сайта:

с помощью конструкторов сайтов;
с помощью CMS-систем;
путем самостоятельного написания исходного кода сайта.

Давайте рассмотрим каждый из этих способов более подробно. Начнем с того, который, на наш взгляд лучше других подходит для новичков.

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

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

Наиболее популярные конструкторы сайтов

uKit – лучший конструктор на российском рынке для создания простых и эффективных сайтов своими руками, целится на бизнес-аудиторию: визитки, лендинги, корпоративные сайты с новостным разделом, портфолио и т.п. Здесь легко начать с готовых шаблонов, очень простой и удобный для новичков визуальный редактор, масса действий по продвижению, рекламе, подключению доменов, добавлению аналитики – автоматизирована. Больше деталей и цены подписок – в нашем подробном обзоре uKit + мануал по работе с этим конструктором.
Nethouse – конструктор, который отлично подойдет для создания сайтов-визиток, сайтов-портфолио, интернет-магазинов. Он достаточно прост в первичном освоении и дальнейшем использовании. Мы подготовили его подробный обзор, а также пошаговое руководство.
Wix – крупнейший игрок с мировым охватом, хорошо локализован для российской аудитории, имеет много профильных инструментов. Правда, с недавних пор наблюдаются проблемы с приёмом оплаты на сайтах интернет-магазинов, она недоступна, и сложно оплатить подписки самого сервиса с карт российских банков. У нас есть отдельный подробный обзор этого конструктора, а также пошаговое руководство по работе с ним. Чем заменить Wix.

Кроме того, специально для читателей нашего сайта мы составили рейтинг лучших конструкторов сайтов. Обязательно обратите на него внимание, чтобы проанализировать все возможные варианты!

Давайте вкратце пробежимся по этапам создания сайта в конструкторе uKit. Он отлично подойдет для представителей малого бизнеса и новичков, которые не желают погружаться в тонкости создания сайтов. uKit избавит вас от необходимости делать свой первый ресурс на «голом» HTML или разбираться с особенностями работы CMS.

Сам процесс состоит из нескольких понятных и простых шагов, о которых чуть ниже!

Шаг первый – регистрация в конструкторе и вход в аккаунт.
Проходим простую процедуру регистрации, заполнив данные формы либо просто авторизовавшись в одной из популярных соц.сетей (подойдут также аккаунты поисковиков Яндекс и Google).

Определитесь с нужным вам функционалом и выберите подходящую подписку. Стандартные цены uKit – от 2,5 $/месяц. Это с учетом скидок за оплату наперед, от года и более. 14 дней тестирования – бесплатно.

Чтобы получить максимально выгодное предложение по подписке uKit прямо сейчас, воспользуйтесь нашим промокодом: IT-15.

Шаг второй – выбираем шаблон дизайна для будущего сайта.
Конструктор предоставляет в распоряжение пользователей коллекцию из более 350 уникальных бесплатных шаблонов! И это не просто «рыбы», текст и описания в блоках осмысленные, полностью соответствуют тематике. Для сайтов, которые не нуждаются в уникальном контенте, например, при создании лендингов и визиток, останется поменять только контакты.

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

Шаг третий – оформляем и персонализируем сайт.
В первую очередь необходимо дать создаваемому ресурсу уникальное имя (изначально — это домен третьего уровня, фактически это техническое имя сайта, позже его лучше заменить на свой домен второго уровня, красивый, понятный и запоминающийся). Стоит отметить, что в случае с ru/рф-зонами, домен даже не придётся настраивать, нужные ресурсные записи внесутся автоматически. Только регистрировать домен необходимо через админ-панель сервиса.

Визуальный редактор uKit позволяет изменять и настраивать любой элемент страницы, вы можете без каких-либо проблем добавлять или удалять разнообразные блоки и виджеты, менять их содержимое и внешний вид (фон, шрифты, анимации и т.п.).

В частности можно:

Добавлять на сайт необходимые страницы и наполнять их контентом.
Фотогалереи, слайдеры и видеоролики. У uKit нет ограничений по месту на диске – полный безлимит во всех подписках!
Разнообразные функциональные элементы, такие как формы, кнопки и меню.
Кнопки социальных сетей и специальные виджеты соцсетей (подписчики, участники групп и т.п.)
Функционал для ведения блога компании (новостного раздела).
Реализовать простой интернет-магазин (без массового экспорта и импорта, но с полноценной оплатой, корзиной и уведомлениями).
Получить все необходимые SEO-возможности для продвижения создаваемого сайта – мета-теги, элементы микроразметки, автоматическое сжатие изображений и плавную подгрузку по скроллу (для ускорения отрисовки и повышения ранжирования). Есть даже встроенный SEO-мастер, который автоматически найдёт основные проблемы на страницах и порекомендует действия.
Добавить красочный favicon.
Разнообразные счетчики и метрики для отслеживания важных параметров и характеристик сайта (подключение аналитики происходит в специальном мастере, никакой код никуда добавлять не нужно, данные отображаются внутри панели управления).
И еще множество других модулей под разные задачи – виджеты калькуляторов uCalc, кнопки заказа обратного звонка, онлайн-чаты, прайс-листы, счётчики обратного отсчёта и т.п.

Шаг четвертый – финальные штрихи и запуск.

Просмотрите мобильную версию, убедитесь, что вас все устраивает.
Проверьте ранее введенные контактные данные, попробуйте работу форм и кнопок в деле.
Обязательно сделайте «Предпросмотр» перед запуском сайта. Определитесь с тем, какие блоки показывать в десктопной версии сайта, а какие – в версии для планшетов или для смартфонов.
И наконец, нажмите кнопку «Опубликовать», чтобы созданный вами сайт стал частью всемирной паутины и был доступен всем пользователям.

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

А для вашего удобства и безопасности имеется встроенная автоматическая и ручная система бэкапов. Вы в любой момент сможете откатиться до более удачной версии сайта.

Как итог – вы получаете высококачественный сайт с удобной мобильной версией без каких-либо технических знаний. Если у вас остались вопросы по конструктору, то вы сможете найти ответ на них в нашей подробной пошаговой инструкции.

Термин CMS происходит от английского выражения Content Management System и используется для обозначения так называемых «систем управления контентом» (сайтом).

Эти же системы зачастую называют «движками» для сайтов. На сегодняшний день любая CMS-система позволяет управлять всем содержимым сайта с помощью простого и наглядного интерфейса.

Вполне естественно, что выбор CMS-системы зависит от цели создания конкретного сайта. Каждый движок для сайта имеет свои особенности, преимущества и недостатки. Кроме того, стоит учитывать, что все CMS-системы делятся на две большие группы: бесплатные и платные движки.

WordPress – отлично подходит для создания блогов, сайтов-визиток, корпоративных сайтов. Кстати, сайт, который вы сейчас читаете, работает на базе именно этой CMS. И мы уже опубликовали руководство, в котором рассказывается о том, как создать сайт на WordPress.
Joomla – еще одна многофункциональная CMS-система, которая позволяет создать как простой сайт-визитку или корпоративный сайт, так и полноценный интернет-магазин. Обязательно прочитайте наше руководство, посвященное тому, как создать сайт на Joomla.
InstantCms – в первую очередь, этот движок предназначен для создания социальных сетей, городских порталов, а также сайтов знакомств и онлайн-клубов;
Drupal — ещё одна популярная CMS-система, которая отлично подходит для создания корпоративных сайтов, сайтов-визиток, а также сайтов-портфолио, социальных сетей и интернет-магазинов;
OpenCart –данная CMS-система предназначена, прежде всего, для создания интернет-магазинов. Вместе с тем стоит учитывать, что она проста в использовании, но при этом достаточно сложна в плане разработки. Как показывает практика, для разработки полноценного интернет-магазина на основе этого движка требуется привлечение опытного PHP-программиста.
phpBB – отличная CMS-система, предназначенная для создания форумов.

«1С-Битрикс» — мощная и многофункциональная система управления сайтами. Она позволяет создавать и поддерживать интернет-ресурсы практически любого типа. В качестве ключевых особенностей стоит выделить простоту управления созданным сайтом, высокую производительность, интеграцию с 1С (это очень важный момент для российских интернет-магазинов), а также обширные возможности мобильного администрирования.
UMI.CMS – еще один достойный представитель платных CMS-систем. Девиз его разработчиков — «удобство для людей». Специально для этого движка было создано 500 уникальных шаблонов, которые подойдут практически для любого сайта и при этом предоставят возможность доработки под каждый конкретный проект. А 2500 разработчиков будут рады помочь вам в создании сайта на основе UMI.CMS и его «затачивании» именно под ваши цели.
osCommerce — платная CMS-система, предназначенная для создания современных интернет-магазинов и обладающая богатейшими функциональными возможностями.

Специально для тех, кто хочет научиться самостоятельно писать исходный код создаваемого сайта, мы подготовили пошаговую инструкцию по созданию простого сайта на HTML. Поехали!

Внимание! Если вы абсолютный новичок или просто не хотите погружаться в работу с кодом и другие технические моменты, можете смело переходить к разделу «Создать сайт с нуля или на конструкторе сайтов?»

В качестве первого примера мы создадим простой HTML-сайт, который будет состоять всего из одной страницы. HTML (HyperText Markup Language — язык разметки гипертекстов) – универсальный язык, предназначенный для описания веб-страниц. Его задача заключается в том, чтобы указать браузеру, что и как нужно отображать при загрузке страницы в браузере пользователя. Каждый из его тегов описывает фрагмент страницы.

Ниже приводится исходный код простейшей HTML-страницы:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<base href="https://www.internet-technologies.ru/wp-content/uploads/pages/createMySite/" />
<title>Туристическое агентство ТурБюро</title>
<meta name="description" content="Описание страницы" />
<meta name="keywords" content="Ключевые слова" />
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
</head>
<body>
<div id="page">
<header>
<a href="/" title="" class="logo"><img src="images/logo.png" alt="Туристическое агентство" /></a>
<div class="phone">+7 (123) 45-67-89</div>
<nav>
<ul id="top_menu">
<li><a href="index.html">О компании</a></li>
<li><a href="services.html">Наши услуги</a></li>
<li><a href="contacts.html">Контакты</a></li>
</ul>
</nav>
<div class="header_img">
<img src="images/header_img.jpg" alt="Туристическое агентство" />
</div>
</header>
<section id="content">
<h1>Приветствуем Вас на сайте ТурБюро!</h1>
<img src="images/content_img.jpg" alt="Картинка" class="float-right" />
<p>Здравствуйте! Мы рады приветствовать вас на сайте туристического агентства «ТурБюро»! Мы предлагаем нашим клиентам только самые интересные и захватывающие приключенческие туры по всему миру!</p>
<p>Только у нас вы сможете полететь в Индию на слоне и окунуться в глубокое синее море, держась за плавник акулы. Но не волнуйтесь - каждый клиент нашего агентства застрахован по полной программе и жаждет приключений снова и снова!</p>
<p>Если вам нечего заняться, вы поистине решили заняться приключениями на свою голову, то приглашаем вас в офисы нашей компании по всей стране для выбора самых вкусных предложений.</p>
</section>
<footer>
<a href="https://www.internet-technologies.ru/" title="Сайтостроение от А до Я">Сайтостроение от А до Я</a><br />Все права защищены
</footer>
</div>
</body>
</html>

Скопируйте этот код в новый текстовый файл и сохраните его на своем компьютере. Задайте для сохраняемого файла имя index.html. Затем откройте этот файл в любом браузере и посмотрите на результат.

Обратите внимание, что по умолчанию любой веб-сервер пытается выдать браузеру именно страницу с названием index.html. Поэтому в 99% случаев исходный код главной страницы сайта сохраняется в файле под таким названием и это считается хорошим тоном.

Полную версию этого простейшего HTML-сайта вы можете скачать в виде архива (10,8Mb). После распаковки архива запускаем html/index.html.

Самостоятельное создание сайта с нуля состоит из трех основных этапов:

Создание макета сайта. Именно на этом этапе появляется четкое визуальное представление, как будет выглядеть создаваемый интернет-ресурс. Чаще всего используется Adobe Photoshop или другие растровые редакторы.
Верстка сайта. На этом этапе приступают к верстке сайта из макета .psd, мобильной адаптации и тестированию на корректное отображение в различных браузерах.
Внедрение PHP. На этом этапе сайт превращается из статичного в динамический.

Давайте разберемся со всеми этими этапами более подробно.

Чаще всего макет (в данном случае под этим словом стоит понимать визуальное оформление) сайта создается в программах, которые принято называть графическими редакторами. Наиболее популярными являются Adobe Photoshop и CorelDRAW. Мы рекомендуем использовать именно Photoshop, так как он чуть проще в освоении и при этом обладает богатейшими возможностями. Кроме того, именно им пользуются все веб-дизайнеры.

Создаем новый документ в Adobe Photoshop. Задаем ему имя – MySite.

Выбираем разрешение 1000 на 1000 пикселей. Оно гарантирует корректное отображение у любого пользователя, размер по вертикали в дальнейшем можно будет увеличить.

Выбираем разрешение 72 пикселя на дюйм и RGB-цвет. Эти установки делаем обязательно, так как именно они отвечают за корректное отображение веб-страницы.

Затем устанавливаем цвет фона F7F7C5 в шестнадцатеричном формате или выбираем его с помощью палитры цветов.

После этого выбираем пункт меню «Просмотр» – «Направляющие» и активируем отображение линеек и направляющих.

В пункте меню «Просмотр» — «Привязка к» необходимо проверить, что включена привязка к направляющим и границам документа.

С помощью инструмента «Текст», вводим текстовое название будущего сайта, слоган под ним, а также контактный номер телефона справа вверху макета.

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

Затем с помощью инструмента «Формы» создаем прямоугольник с закруглёнными краями (радиус – 8 точек) и с его помощью обозначаем место под изображение, которое будет располагаться в шапке сайта.

Теперь пришло время вставить изображение в шапку сайта.

С помощью инструмента «Текст», и шрифта Georgia, входящего в стандартный набор операционной системы Windows, создаем навигационное меню и заголовок главной страницы сайта.

Затем, используя инструмент «Текст» и шрифт «Arial», добавляем текст главной страницы. В данном случае лучше всего использовать блочный текст для последующей работы с ним.

Для заголовка в тексте используем черный шрифт. Для навигационного меню – белый.

Перемещая правую границу основного текстового блока, вставляем изображение в текст страницы (справа от текста).

Используя инструмент «Формы» — «Прямая», проводим заключительную линию под текстом страницы.

C помощью инструмента «Текст» (шрифт Arial) размещаем копирайт в подвале страницы (под линией).

Нарезаем необходимые для вёрстки сайта фрагменты изображений с помощью инструмента «Раскройка» (мы выделили основную картинку в шапке и картинку в тексте страницы).

В результате проделанной работы мы создали полноценный макет сайта. В случае если вы захотите внести собственные изменения в макет страницы, PSD-файл также можно найти в архиве.

Для того чтобы сохранить и использовать результаты проделанной работы в виде изображений для последующей вёрстки сайта, переходим в меню «Файл» и выбираем пункт «Сохранить для Веб». Затем настраиваем качество выходных изображений и сохраняем их.

В результате этого мы получим множество графических фрагментов для нашего будущего шаблона. В папке, где был сохранен сам шаблон, появится папка с изображениями (images). Отбираем нужные и переименовываем.

Макет страницы создан, необходимые фрагменты получены, можно переходить к верстке.

Прежде всего, необходимо создать новый текстовой файл и сохранить его под названием index.html.

Первая строка этого файла должна выглядеть следующим образом:

Она сообщит браузеру, как именно обрабатывать содержимое страницы. Далее следует набор тегов:

<html><head> «Голова» документа</head><body> «Тело» документа</body></html>

Пара тегов <html>…</html> говорит о том, что внутри содержится HTML-код.

Внутри <head>…</head> располагаются теги, которые не отображаются в окне браузера пользователя. Как правило, они начинаются со слова meta, и называются мета-тегами, а вот тег <title>…</title> отображается в качестве заголовка окна браузера и анализируется поисковыми системами.

Далее располагается пара тегов <body>…</body>, в которые заключено содержимое страницы. Именно эта часть, которую часто называют телом страницы, отображается в браузере пользователя.

Также важно понимать, что существует несколько способов организации контента. Наиболее популярные из них – организация с помощью блоков (<div>…</div>) и в виде таблиц (<table>…</table>).

Что касается формата отображения элементов, то он может быть задан как напрямую, с использованием соответствующих тегов, так и с помощью таблиц стилей CSS. При этом именно второй способ является наиболее предпочтительным, так как он позволяет повторно применять стили компонентов. Таблица стилей задается либо в внутри тега <head>, либо в отдельном файле (чаще всего этот файл имеет имя style.css), ссылка на который также располагается внутри <head>.

В нашем случае структура элементов сайта выглядит следующим образом:

Основополагающими документами, в которых описываются все компоненты того или иного языка, применяемого при создании сайтов, являются спецификации.

Более подробно изучить все основные HTML-теги, их назначение, и принципы использования таблиц стилей (CSS) можно в нашем разделе статей: «Верстка сайта».

На HTML-странице, созданной в предыдущем примере, все определено заранее и не будет изменяться при обращении со стороны пользователей. Такие страницы принято называть статичными, для их создания вполне хватает средств, предоставляемых языком гипертекста HTML.

Если же предоставляемая пользователям сайта информация изменяется в зависимости от каких-либо факторов или запросов, говорят, что веб-страница содержит динамический контент (является динамической).

Для создания таких страниц необходимо использовать языки веб-программирования. Среди них наиболее широко распространены PHP, Python и Ruby on Rails для Unix-систем, а для Windows характерна разработка динамического контента с использованием средств .NET.

Это все касается серверной части, а для программирования на клиентской стороне чаще всего используется JavaScript.

В подготовленном нами архиве есть папка php, в которой сохранен файл index.php. Именно он позволяет реализовать три странички нашего тестового сайта с помощью PHP.

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

В рамках этой статьи мы не будем углубляться в дебри PHP-программирования и для наглядности ограничимся простыми вставками фрагментов кода.

Суть этих действий заключается в том, что мы выносим шапку и подвал сайта в отдельные файлы: header.php и footer.php соответственно. А затем на страницах с текстовым содержанием вставляем их в макет сайта с помощью PHP. Сделать это можно с помощью приведенного ниже кода:

<?php include('templates/header.php'); // Вставка шапки сайта ?>
...
<?php include('templates/footer.php'); // Вставка подвала сайта ?>

Попробуйте запустить в браузере файл php/index.php. Не получилось? Конечно нет. Ведь браузер не знает, что ему делать с командами, из которых состоит PHP-файл (он же PHP-скрипт).

Для того чтобы любой PHP-скрипт выполнился успешно, он должен быть обработан интерпретатором языка. Такой интерпретатор обязательно присутствует на всех веб-серверах и позволяет обрабатывать PHP-код. Но как же посмотреть, что изменилось в результате нашей работы?

Для отладки веб-приложений и реализации полноценного веб-сервера на компьютерах, работающих под управлением операционной системы Windows, был создан бесплатный пакет Denwer (для вашего удобства он присутствует в подготовленном нами архиве). Он включает в себя веб-сервер Apache, интерпретаторы таких языков веб-программирования как PHP и Perl, базу данных MySQL, а также средства для работы с электронной почтой.

Установка пакета приложений Denwer не требует каких-либо серьезных усилий. Запускаем установочный файл, выполняем все его требования. Выбираем букву виртуального диска для быстрого доступа к веб-серверу, создаем ярлыки. Вот и все! Denwer готов к работе!

Только что установленный нами веб-сервер запускается кликом по ярлыку Start Denwer (у вас он может называться иначе). После старта веб-сервера скопируйте в папку home/test1.ru/www/, расположенную на появившемся в системе виртуальном диске (обычно Z), содержимое папки php из архива, с которым мы работаем, кроме файла index.html.

После этого наберите в адресной строке браузера test1.ru. Знакомая картина? А теперь пройдитесь по ссылкам, расположенным сверху страницы. Работает? Отлично!

Ключевое отличие создания с нуля (будь то с помощью CMS-систем или исходного кода) от конструктора сайтов заключается в том, что создание сайта с нуля подразумевает возможность не только создать сайт, отвечающий именно вашим потребностям, но и управлять всеми возможностями, которые вы сами и заложили.

В свою очередь, создание интернет-ресурса с помощью того или иного конструктора сайтов не потребует от вас наличия специальных технических навыков. Любой из перечисленных выше конструкторов позволяет создать полноценный сайт буквально за несколько часов. Однако к выбору конструктора нужно отнестись предельно внимательно. Выбор за вами!

В приведенной ниже таблице мы постарались обобщить ключевые преимущества и недостатки сайта с нуля VS конструктора сайтов:

Сравнительная характеристика	Сайты, созданные с помощью конструктора	Сайты, созданные самостоятельно с нуля
Простота создания	Просто	Сложно
Скорость создания	Очень быстро	Долго
Возможность редактирования исходного кода	Нет	Есть
Возможность продвижения в поисковых системах	Возможны нюансы	Полная свобода
Гибкость в настройке дизайна и функциональности	Ограничена	Не ограничена
Возможность перенести на другой хостинг	Чаще нет	Есть

Какой же способ создания сайта наиболее предпочтителен?

На самом деле, однозначного ответа на этот вопрос не существует. Все зависит от ваших целей и задач. Может быть, вы хотите изучить наиболее популярные CMS-системы? А может, научиться самостоятельно формировать исходный код создаваемого сайта? Нет ничего невозможного!

Но если вы хотите создать современный и действительно качественный сайт в предельно короткий срок, мы рекомендуем воспользоваться именно конструкторами сайтов!

Мы перечислим несколько полезных программ, которые значительно облегчат и ускорят процесс самостоятельного создания сайта:

Notepad++ — текстовый редактор, позволяющий создавать и редактировать исходный код создаваемого сайта. Отличная замена программе «Блокнот», входящей в состав операционной системы Windows.

Adobe Dreamweaver — мощная и многофункциональная программа для создания сайтов. Помимо всего прочего она включает в себя возможность предварительного просмотра создаваемого ресурса.

NetBeans – среда разработки приложений, которая позволяет эффективно работать с такими языками разметки и Веб-программирования, как HTML, CSS, JavaScript и PHP.

Допустим, вы уже создали свой первый сайт, но что нужно сделать, чтобы на него мог зайти любой пользователь Всемирной паутины?

Домен — это имя сайта. Кроме того, под термином «домен» зачастую понимают адрес вашего сайта в сети «Интернет».

Отличным примером домена может быть имя сайта, на котором вы сейчас находитесь — internet-technologies.ru.

Как видно из приведенного выше примера доменное имя сайта состоит из двух частей:

непосредственно названия сайта — в нашем случае это internet-technologies;
выбранной доменной зоны. В нашем случае была выбрана доменная зона «.ru». Доменная зона указывается в адресе сайта после его названия.

Также стоит отметить, что существуют домены различных уровней. Разобраться в этом очень просто – достаточно посмотреть на количество разделенных точкой частей адреса сайта. Например:

internet-technologies.ru – домен второго уровня;
forum.internet-technologies.ru – домен третьего уровня (он же поддомен).

Доменные зоны могут быть разными. Чаще всего выбор доменной зоны зависит от страны или назначения каждого конкретного сайта.

Наиболее часто используются следующие доменные зоны:

.ru — наиболее популярная доменная зона в рамках русскоязычного сегмента Всемирной паутины;
.biz — часто доменная зона используется для сайтов бизнес-тематики;
.com — эта доменная зона чаще всего используется для коммерческих и корпоративных сайтов;
.info — в этой доменной зоне достаточно часто располагаются именно информационные сайты;
.net — еще одна популярная доменная зона, подходящая для проектов, связанных с Интернетом;
.рф — официальная доменная зона Российской Федерациию

Важно! Мы настоятельно не рекомендуем использовать домены в зоне .рф. Связано это со сложностью в продвижении сайта, расположенного в этой доменной зоне.

Если большая часть целевой аудитории находится в России, мы рекомендуем регистрировать домен в зоне «.ru».

При выборе домена для собственного сайта мы рекомендуем руководствоваться следующими принципами:

оригинальность и легкость запоминания;
максимальна длина – 12 символов;
легкость набора на латинице;
отсутствие в имени домена знака «тире» (желательно, но не обязательно).
Чистота истории домена и отсутствие на нем каких-либо санкций со стороны поисковых систем. Это можно проверить с помощью сервиса «whois history».

Мы рекомендуем пользоваться услугами надежного и проверенного временем регистратора доменных имен – WebNames. Мы используем именно его.

Помимо всего прочего, сайт этого регистратора позволяет прямо в режиме онлайн подобрать имя (домен) для своего сайта. Сделать это довольно просто.

Для этого достаточно ввести в соответствующее поле желаемое имя домена и нажать кнопку «Искать домен».

Для того чтобы созданный вами сайт стал доступен всем пользователям Всемирной паутины, помимо домена вашему интернет-ресурсу понадобится еще и хостинг.
Термином «хостинг» обозначается услуга по размещению вашего сайта в Интернете. Предоставлением подобных услуг занимается большое количество компаний, которые принято называть «хостерами».

Вы должны четко понимать, что все сайты, которые доступны на просторах Всемирной паутины, где-то находятся. Если говорить более конкретно, находятся они (их файлы) на жестких дисках серверов (мощных компьютеров), находящихся в распоряжении компаний — хостеров.

Так как практически любой сайт состоит из разных типов файлов (базы данных, тексты, картинки, видео), доступ к ним с разных компьютеров осуществляется путем обработки запроса, обращенного к сайту, который располагается на сервере компании-хостера.

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

При выборе хостинга для создаваемого сайта мы рекомендуем руководствоваться следующими критериями:

Стабильная работа. Выбранный вами хостинг должен стабильно работать 24 часа в сутки, 7 дней в неделю. Иначе вы будете нести репутационные потери в глазах посетителей, а также потеряете доверие со стороны поисковых систем. В этой связи стоит обратить особое внимание на такой параметр, как uptime хостинга. Uptime — это время, в течение которого сайт работает в штатном режиме и посетители могут его открыть в своем браузере без каких-либо проблем. Оно должно быть максимально приближено к 100%. В свою очередь время отклика сайта демонстрирует, насколько быстро ваш сайт отвечает на запрос, поступающий от браузера пользователя. Чем меньше время отклика, тем лучше.
Простота и удобство пользовательского интерфейса. При входе в личный кабинет вся панель управления должна быть не только доступна, но и интуитивно понятна. В частности, вы должны видеть текущий баланс, а также иметь быстрый доступ ко всем основным функциям хостинга.
Профессиональная русскоязычная служба поддержки. Быстрая, квалифицированная и говорящая на родном для вас языке техническая поддержка очень важна в случае возникновения различных сбоев в работе сайта и необходимости их оперативного устранения.
Стоимость услуг. Этот аспект важен как для начинающих вебмастеров, которые имеют в своем распоряжении ограниченный бюджет, так и для владельцев масштабных интернет-проектов, требующих использования действительно дорогостоящего хостинга.

Со своей стороны мы можем порекомендовать вам таких надежных и проверенных временем хостинг-провайдеров, как Beget (для начинающих и продвинутых вебмастеров), а также FastVPS (для тех, кому нужен высокопроизводительный хостинг).

Допустим, вы уже создали сайт, купили домен и хостинг. Что делать дальше?

Теперь нужно разместить все файлы нашего сайта на сервере выбранного вами хостинг-провайдера. Есть сразу несколько способов сделать это. Давайте поговорим о них.

Это загрузка содержимого вашего сайта по HTTP-протоколу с помощью панели управления хостингом.
По протоколу FTP с помощью так называемого FTP-клиента.

Именно второй способ является наиболее быстрым. Для этой задачи мы рекомендуем один из лучших бесплатных FTP-клиентов – FileZilla.

После установления связи с FTP-сервером выбранного вами хостинг-провайдера (обычно после оплаты хостинга провайдер передает IP-адрес, логин и пароль входа) доступное дисковое пространство отобразится в виде логического устройства (как и обычные жесткие диски компьютера) на одной из двух панелей используемой программы. После этого останется запустить процесс копирования и дождаться его окончания.

Таким образом, ваш сайт будет опубликован в Интернете и станет доступен всем пользователям Всемирной паутины. На этом этапе уже можно будет набрать в адресной строке браузера его доменное имя и полюбоваться результатом проделанной работы.

Можно ли создать полноценный сайт абсолютно бесплатно?

С чего начать обучение будущему вебмастеру (создателю сайтов)?

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

Где можно пройти профессиональное обучение созданию сайтов?

Можно ли бесплатно изучить основы сайтостроения?

Можно ли самостоятельно создать собственный сайт?

Можно ли заработать на создании сайтов?

Благодарим вас за прочтение этой статьи. Мы будем очень рады, если вам помогут нашими рекомендации. Кроме того, благодарим вас за лайки и шаринги. Оставайтесь с нами, и вы узнаете еще много интересного!

Может быть, у вас есть какие-то вопросы по созданию сайтов? Задайте их в комментариях, и мы постараемся вам помочь!

Источник

Привет, Хабр! Относительно недавно после пары лет перерыва в айти, потраченных на изучение японского языка, мне пришлось срочно обновлять свои знания на работе. Ну знаете, искать возможности исполнить все хотелки начальника, как и положено эникею. Меня ждало много увлекательных открытий, но при этом, как водится, и немало боли и борьбы с непонятками. Docker, контейнеры, реверс DNS и реверс прокси, получение TLS сертификатов. В какой-то момент я наконец дошёл до удобного решения, которым я теперь хочу поделиться.

В своё время домашний сервер очень облегчил бы мне понимание Docker’а, да и удобство работы с ним неслабо бы повысил. Поэтому возникла идея написать эту статью, после прочтения которой любой человек даже с поверхностными знаниями в информационных технологиях сможет поставить себе постоянно доступный домашний сервер на базе Docker Swarm с удобной веб-мордой, простым получением TLS-сертификатов и Heroku-подобным функционалом (для чего будем использовать PaaS CapRover).

Статья, в общем-то, рассчитана на новичков, обладающих какими-то техническими знаниями — школьников старших классов, студентов и просто любителей — а потому вряд ли будет интересна серьёзным профессионалам.

Зачем оно нужно?

Ну как минимум потому что это круто, иметь домашний сервер! Да и настраивать всё это дело интересно. При этом он уже за месяца три отобьёт свою стоимость в сравнении с VPS’ом схожей конфигурации. Ну и наконец он просто радует глаз и миленький.

Что же до использования — иметь возможность развернуть в пару кликов дома Docker-контейнеры сразу в формате http://контейнер.мой.домен/ и в ещё один клик подключить к нему SSL неплохо упрощает жизнь. Сейчас всё больше и больше разнообразных приложений и сервисов переезжают в контейнеры и, если вы не любите лишний раз платить большим компаниям, иметь свои аналоги платных сервисов на домашнем сервере это очень удобно.

Ну а удобство для разработчиков и так понятно.

Подготовка

Поскольку мы хотим, чтобы наш домашний сервер был доступен из внешней сети, нужно сделать несколько приготовлений.

Port Forwarding

Схема работы перенаправления портов

Проверьте наличие у вашего маршрутизатора (роутера) опции Fort forwarding/Port mapping/Перенаправление портов. Это не самый безопасный, но самый простой способ дать нашему серверу путь во внешний мир. Убедитесь что 80, 443 и 3000 порты у вас ничем не заняты — именно их вы будете прописывать IP адресу вашего сервера. Возможно в будущем, например, если вы захотите поднять почтовый сервер, вам придётся прописать дополнительные порты, но пока нужно только это.

Если проводить аналогию для понимания перенаправления портов, то представьте работу мамы в детстве. По умолчанию охранник туда не пустит, но стоит только сказать волшебную фразу «Я к маме», как строгий охранник уже пускает и говорит куда пройти. Вот и тут так же, с нашим NAT’ом роутера, только вместо «Я к маме» вы говорите порт, на что вас направляют куда надо.

Так же стоит убедиться, что у DHCP вашего роутера есть возможность зарезервировать выданный IP адрес за MAC. Скорее всего ваш сервер будет стоять включённым всё время и не просрочит свой выданный IP адрес, но подстраховаться никогда не бывает лишним. Если нельзя — выпишите машине статичный IP вне зоны выдачи адресов DHCP. Это сложнее и неудобнее, но тоже вариант (Кто-то даже скажет что так даже лучше сделать. Но я сейчас за простоту).

Нету этих опций? Возможно ещё не всё потеряно. Проверьте базу https://dd-wrt.com/support/router-database/ на наличие вашего роутера и есть ли тема по нему на 4pda. Если и там пусто… Ну, либо сворачивайте это руководство, либо пора купить новый роутер.

Домен

Конечно, ничто не мешает нам обращаться к нашему домашнему серверу и напрямую по IP адресу, но делать так не рекомендуется: и не особо безопасно, и запоминать IP адрес не просто, да и если у вас динамический, меняющийся каждый раз как вы заново подключаетесь к интернету, IP адрес, то запоминать его вообще бессмысленно. Ну и наконец, у нас много сервисов планируется, а чтобы к ним доступ был тупо по IP адресу, придётся их на разные порты навешивать. Оно вам надо?

Именно поэтому мы будем использовать домен.

Ну, знаете, ту самую штуку, которую вы вводите в адресной строке. В результате сможем давать сервисам поддомены для удобства и не страдать. Ну, например https://пароли.мой.домен/ для парольного сервиса или https://почта.мой.домен/ для почты. Удобно, в общем, запоминается. Делать это будет Ngnix под капотом нашего PaaS, при желании всегда можете разобраться в конкретике.

Схема работы обратного прокси Ngnix в случае контейнеров

Рекомендую я, конечно, домен купить. Цены на домены в популярных зонах достаточно либеральные, платить раз в год, регистраторов куча. В плане выбора регистратора я ничего конкретного советовать не буду. Адекватнее всего ориентироваться по цене и отзывам. Разве что маленькое наблюдение: если регистратор требует миллиарды шекелей за такие вещи, как банальное управление DNS записями, то возможно это не очень хороший регистратор и следует посмотреть в другую сторону.

Впрочем если вы только пощупать пришли, то домен можно получить и бесплатно. Есть такой регистратор — Freenom, там можно бесплатно достать домен в зонах .tk, .ml, .ga, .cf или .gq. Правда как часто бывает с чем-то бесплатным, сайт глючный. Если на проверке доменов у вас всё время пишется, что домен занят, попробуйте поставить сразу полный путь. То есть вводите в проверочное поле не мой_домен, а сразу, скажем, мой_домен.tk.

Очевидно, что если что-то досталось бесплатно, то и потерять его легко — отзывы у Freenom в этом плане далеки от хороших. Так что если планируете что-то серьёзное, то лучше домен себе всё-таки купить у регистратора. Однако для маленького домашнего сервера потенциальная потеря домена не критична.

Cloudflare

Тут мы уже входим в пространство вкусовщины. Вам ничто не мешает использовать и редактор DNS записей вашего регистратора или любой другой сервис управления DNS записями домена. Тут, на хабре, вон вообще CloudFlare раком интернета недавно называли. Но с другой стороны, CloudFlare даже в базовой, бесплатной версии имеет достаточно много приятных фишек, которые ваш регистратор скорее всего не предоставляет. Тут и какая-никакая защита от DDoS, кеширование, расширенные возможности управления доступом и так далее и в том же духе. Плюс в одном из следующих пунктов, когда мы поднимем контейнер для DDNS, будет использоваться именно CloudFlare (впрочем настроить DDNS с другим провайдером вроде DuckDNS — задача достаточно тривиальная).

Правда многие фишки пройдут мимо нас, поскольку проксирование у CloudFlare на wildcard-записи (ну, это записи включающие всё пространство имён *.мой.домен) не работает (ну, за бесплатно). Однако ничего не мешает потом, уже для отдельных сервисов, сделать конкретную запись и пожать все плюшки платформы. Ну или ещё лучше, если у вас статический IP адрес, вообще без DDNS обойтись.

Платформа

Физический путь

Удобство физического пути очевидно — стоит отдельная машинка, не мешает основной работе, радует глаз.

Если спросить, что же использовать как платформу, наверняка многие ответят Малинку (то есть Raspberry Pi). На мой взгляд это не самый лучший выбор для данного случая.

Raspberry Pi отлично подходят для самодельных решений разнообразной направленности, но по соотношению цена/производительность не являются каким-либо лидером. И, хотя сейчас уже множество софта доступно под ARM системы, под x86 программы всё-таки чувствуют себя постабильнее.

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

Я же советовал бы купить для данных целей недорогой (или не очень дешёвый, если вы хотите постоянно запускать «тяжёлые» задачи на вашем сервере) мини-пк (иначе называемый неттоп). Доступные варианты с 8 гигабайтами оперативной памяти, четырёхядерным Celeron и SSD на 128 гигабайт можно найти за 150-200 долларов и этого более чем хватит для домашних задач. При этом он будет компактным, тихим, удобным в размещении, достаточно приятно выглядящим и с низким TDP. Даже в самые дешёвые модели обычно можно доставить как минимум один, а порой и два 2,5 дюймовых диска, так что как файловую помойку его, в общем-то, тоже можно использовать. Хотя лучше превратить его в личное облако, а как файловый сервер использовать отдельное NAS-устройство — для отказоустойчивого хранения большого количества данных форм фактор мини-пк не слишком располагает.

Помимо этого, если вы «наиграетесь» и решите, что оно не ваше, такому компьютеру будет легко найти место. Например поставить обратно Windows и отдать маме/тёте Вале из третьего подъезда. Для офисной работы и использования браузера он подойдёт прекрасно.

А если вы за чуточку большую цену взяли мини-пк с несколькими сетевыми портами, то сможете превратить его в невероятно мощный и функциональный маршрутизатор, поставив сверху OpenWRT, PFsense, ClearOS или ещё какую-нибудь систему для роутеров. Ну и вообще альтернатив много, когда и если наиграетесь с предложенным мной вариантом.

Сразу, правда, надо учесть: шансы, что у такой машинки не будет работать Wi-Fi под линуксом, мягко говоря, не самые маленькие. Так что планируйте проводное соединение.

Заранее погуглите, на какую клавишу вызвать boot menu у вашей машинки. А образ для установки, если вы на Windows, лучше всего на флешку записывать программой Rufus.

Виртуальный путь

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

Тут стоит провести некоторое разграничение в понимании, поскольку дальше у нас будут ещё и контейнеры Docker. Внешне и по структуре они очень похожи, но вот по использованию неплохо так различаются.

Виртуальная машина — это именно то, как оно звучит — компьютер, которой на самом деле не существует, живущий внутри нашего. Её в какой-то мере можно сравнить с картонной коробкой. Её нужно где-то достать, развернуть, заполнить. Она стоит и занимает место, даже если не до конца заполнена. И залезть внутрь этой коробки иначе как сверху достаточно проблематично.

А контейнер — это как пакетик из магазина. Вроде и служит примерно той же цели, что и коробка, но внутрь что-то положить и достать проще, укладывать по-особому не нужно,места много не занимает, и выкинуть не жалко, и продырявить просто. Говоря же чуть более нормальным языком — контейнер это такая недо-виртуалка, которая ведёт себя скорее как процесс программы.

Конкретный гипервизор (ну, программа, где ваши виртуальные машины создаются и управляются) — на ваше усмотрение. Лучше, конечно, использовать гипервизор первого типа (они, как правило, быстрее, поскольку работают “под” операционной системой, а не “над” ней, как гипервизоры второго типа), но нашему серверу это не очень критично.

Внимание, любители всяких игруль, мобильных и не очень, на Windows — большая часть гипервизоров конфликтуют с эмуляторами Android для игр и с некоторыми античит решениями. Нормально только Bluestacks для Hyper-V работает, так что заранее выберите, что вам важнее.

VirtualBox

Для начала распишу для VirtualBox, который доступен на всех основных платформах, хотя и не отличается высокой скоростью.

Нажмите на кнопку New (Создать) для создания новой машины, и, ориентируясь по своей логике, задайте все настройки — если что, то потом всегда сможете поправить. Правда, меньше чем 2 гигабайта оперативной памяти лучше не ставить.

После создания машины войдите в её настройки. В разделе Storage (Носители) добавьте ваш образ к дисководу (синяя иконка), а в разделе Network (сеть) поменяйте тип подключения на Bridged Adapter (Сетевой мост) и выберите сетевую карту, по которой к вам приходят интернеты, после чего сохраните.

Hyper-V

Поскольку сам я в основном пользуюсь Windows, то предпочитаю использовать Hyper-V — встроенный в Pro версию системы гипервизор первого типа. Если вы пользователь Windows, то вам я тоже его советую — как и положено гипервизору первого типа, он весьма радует своей производительностью.

Чтобы использовать Hyper-V, активируйте его в Turn Windows Features on or off (Включение или отключение компонентов Windows) и перезагрузите компьютер. Вероятно, вам ещё придётся включить аппаратную виртуализацию в BIOS, если вы ещё не делали это. Также необходимо создать в Hyper-V manager (Диспетчер Hyper-V) сетевой интерфейс, ведущий во внешнюю сеть. Кликните справа на Virtual Switch Manager (Диспетчер виртуальных коммутаторов), выберите External (Внешний) и нажмите Create Virtual Switch (Создать виртуальный коммутатор). Далее в настройках External Network (Внешняя сеть) выберите сетевую карту, по которой к вам приходят интернеты, а потом сохраните.

После этого создайте новую машину в Hyper-V manager (но только не создавайте «быструю» машину, там всё не слава богу), а потом пройдите в её свойства и отключите Secure Boot (если машина 2-ого поколения). Остальные параметры по вкусу, но меньше 2 гигабайт оперативной памяти лучше не ставить. Ну и как сетевой интерфейс, очевидно, нужно поставить свежесозданный.

Установка и настройка системы

При выборе дистрибутива для установки у нас есть некоторый выбор (Но свериться с поддерживаемыми платформами на https://docs.docker.com/engine/install/ не помешает). Официально докер рекомендуется ставить на Ubuntu, я обычно предпочитаю Debian, но нам в целом не принципиально. Однако возможные подводные камни я распишу только для этих двух дистрибутивов.

И да, если можете, то лучше напрямую смотрите инструкции. А то информация в интернете имеет привычку устаревать и есть шанс, что к моменту, как вы это читаете, всё уже десять раз поменялось.

В случае с Ubuntu скачайте Ubuntu Server — на сервере графический интерфейс ни к чему, вы даже не будете подключать к нему монитор после изначальной установки. При установке важный момент — НЕ отмечайте Docker в качестве установки по умолчанию. Иначе он поставится как snap пакет, будет глючить, тупить и вообще, зачем вам лишние проблемы, не дружите со snap’ами, это плохая компания.

После установки системы копипастим по одной эти строчки (вы же уже подключились по SSH, правда ведь? Если нет, то чуть подальше будет инструкция) или вбиваем вручную:

sudo apt-get update
sudo apt-get install 
    ca-certificates 
    curl 
    gnupg 
    lsb-release
    curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
echo 
  "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu 
  $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io

При установке Debian не надо отмечать web server, поскольку в качестве него у нас Nginx внутри контейнера Docker’а с нашим PaaS работать будет.

После установки системы копипастим эти строчки:

sudo apt-get update
sudo apt-get install 
    ca-certificates 
    curl 
    gnupg 
    lsb-release
    curl -fsSL https://download.docker.com/linux/debian/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
echo 
  "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/debian 
  $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io

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

Помимо того, чтобы вводить команды вручную, вы можете использовать Ansible или другие системы для развёртывания, но данное руководство их проигнорирует, поскольку ничего сложного мы не делаем. Просто знайте, что если вам потребуется однотипно настраивать несколько машин, то можно по ssh удобненько это делать через Ansible. Но ssh игнорировать всё же не стоит, ведь как минимум подключившись к своей машине по нему, вы сможете тупо копипастить все команды из руководств, а не вводить вручную.

Ansible это достаточно важный инструмент для Linux-админа и, если вы планируете сдавать или хотя бы просто учиться на сертификации от RedHat, то он вам понадобится. Ну так, на будущее.

Ssh клиентов великое множество, я обычно пользуюсь встроенным в Windows OpenSSH (хотя он встроен, но в старых версиях Windows 10 может быть по-умолчанию отключен. Включается в Turn Windows Features On and Off (Управление дополнительными компонентами)). Просто открываете PowerShell и пишите:

ssh логин_в_linux@IPшник_сервера

А после вводите пароль своего пользователя. Тут стоит отметить, что использовать ssh с паролем это не особо безопасно (но зато проще всего), и, если у вас будет желание с этим разобраться, то лучше настроить ssh ключ.

Систему мы настроили, но не спешите ставить CapRover. Сначала вернёмся к роутеру. Найдите в нём ваш сервер и зарезервируйте его IP адрес в DHCP. Ну или поменяйте его на что-нибудь приятное и зарезервируйте. У вас есть чувство прекрасного, я уверен. После этого пропишите перенаправление с 80, 443 и 3000 портов маршрутизатора на 80, 443 и 3000 порты нашего сервера.

Вот пример того, как оно выглядит в моём роутере TP-Link:

Теперь идём к домену. Войдите в CloudFlare или DNS редактор вашего регистратора и создайте следующую запись:

Тип: A
Хост: *.ваш.домен
Запись: указывает на ваш внешний IP адрес

Если вы не знаете как узнать ваш внешний IP адрес, то посмотрите в настройках интерфейса, роутера, где угодно. Ну или наберите в поисковике что-нибудь вроде «мой IP», если копаться не хочется.

Можете сразу не отходя от кассы создать токен, если планируете динамически обновлять DNS при изменении вашего IP адреса.

Для этого пройдите по ссылке https://dash.cloudflare.com/profile/api-tokens и создайте токен со следующими свойствами:

Zone — Zone Settings — Read
Zone — Zone — Read
Zone — DNS — Edit

Include — All zones

Сохраните длинный Cloudflare API токен, но далеко не убирайте.

Всё, теперь заходим на сервер и пишем волшебную команду, которая поднимает нашу систему для управления контейнерами:

docker run -p 80:80 -p 443:443 -p 3000:3000 -v /var/run/docker.sock:/var/run/docker.sock -v /captain:/captain caprover/caprover

Если вы плохо знакомы с Docker’ом, то тут мы запускаем наш первый контейнер — небольшой PaaS CapRover. Помимо этого мы даём портам в контейнере путь на волю (-p 80:80 -p 443:443 -p 3000:3000), позволяем контейнеру иметь доступ к демону Docker на хост-машине (-v /var/run/docker.sock:/var/run/docker.sock) и делаем так, чтобы папка из контейнера хранила своё содержимое в папке на хосте (-v /captain:/captain). Если так не сделать, то при перезапуске контейнера всё содержимое: настроечные файлы и другие данные нашего контейнера, потеряются навсегда. Так что никогда не забывайте указывать команду -v при работе docker в консоли, чтобы потом не плакать у разбитого корыта. Ну а caprover/caprover — это образ на Docker Hub.

Подождите немного и зайдите либо по айпи адресу, либо по адресу вашего домена:3000 (например http://мой.домен:3000), введите пароль captain42 . После этого тут же введите в нижнее поле ваш домен и нажмите Update Domain. Можете также нажать на Enable HTTPS, но вот на Force HTTPS не надо нажимать — Cloudflare и так трафик у вас (если вы оставили рекомендуемые настройки) с http на https переводит. Конфликтов на этом поводе нам не надо.

Вы великолепны!

Настала пора запустить наш первый контейнер внутри PaaS.

Перейдите в веб панели в раздел Apps, нажмите на One-Click Apps/Database, найдите CloudFlare DDNS. Это достаточно простой контейнер, весь смысл которого сводится к тому чтобы раз в пять минут проверять, изменился ли IP адрес сервера, и, если изменился, обновлять DNS запись на CloudFlare.

После того как вы нажали на него, вы увидите много опций для ввода. Вообще говоря, чтобы всё заработало нам достаточно просто указать наш сохранённый токен CloudFlare и задать какое-нибудь имя. Но давайте всё-таки разберёмся, что именно мы видим.

А видим мы опции ввода так называемых переменных окружения. Не всех правда, а только тех, которые указал автор конфигурационного файла для CapRover. Значения из этих переменных контейнер может достать и использовать в своих целях, проще говоря через них задаётся начальная конфигурация контейнера.

Так вот, задайте какое-нибудь имя, вставьте ранее сохранённый токен и нажмите Deploy. Контейнер заработал. Теперь можете делать что угодно!

Чуть сложнее

Этот контейнер был простым, без веб доступа, но что у тех, к которым мы будем иметь доступ? Да в общем всё так же, разве что ещё можно включить https, задать домен, указать HTTP порт контейнера и включить websocket. Попробуйте, это просто и интересно!

Использование

И вот наконец у нас всё стоит и работает.

Зачем оно вам? Ну, если вы до сих пор не знаете — придумайте. Для установки в один клик в CapRover доступно множество приложений для повседневного использования. Например менеджер паролей Vaultwarden. Торрент-клиент Qbittorrent. Сервер Minecraft. Боты для Discord. Вариантов много.

Я, например, держу стол для игры в DnD с друзьями Foundry VTT, веб-интерфейс для пробуждение от спячки моего домашнего компьютера (чтобы потом подключаться по RDP), свой маленький гит на базе Gitea, удобный фронтэнд для чтения Reddit’а libReddit, веб-архив для закладок и ещё кучу всякой всячины для тестов и изучения.

Ничто не мешает вам самому поэкспериментировать с контейнерами, которых в списке ещё нет, а если результат будет удовлетворительным — опубликовать свой конфиг на Github среди других приложений для установки в один клик.

В самом начале мы установили SSH, так что если вы захотите более тонкой настройки, подключите и тыкайтесь. Советую также зайти на SSH через VS Studio Code с установленным расширением Docker’а, и установить его же сразу там на ваш сервер. Теперь наблюдать, управлять и чистить мусор в контейнерах гораздо удобнее.

Что дальше?

Возможно, вам уже хватило, вы поняли что это не ваше и вообще. Тоже неплохой результат. Возможно, вы просто хотели домашний сервер и получили его — опять же, к результату мы пришли. Или же вы хотите большего — и это тоже прекрасный результат! Надо понимать, что хотя Docker Swarm уже несколько протух, для небольших нагрузок, вроде домашнего использования, он подходит на отлично. А если вам мало, то, разобравшись как и что тут работает, вы можете медленно начать своё движение к изучению kubernetes.

Что можно посоветовать конкретного? Ну, если Docker вам интересен и хочется в нём разобраться поглубже, то вводный цикл статей от Microsoft достаточно приятно и наглядно объясняет как и что оно.

Если хотите покрупнее брать — и в Hyper-V получше разобраться, и в контейнерах и чуточку затронуть кубер, то вот ещё у них есть неплохие материалы.

Не, не, вы не подумайте, я хоть и виндовый админ (ну хорошо-хорошо, эникей а не админ), но не сказать чтобы прям топлю за Microsoft, просто материалы у них бесплатные и достаточно толковые, на мой взгляд.

Коли от Microsoft тошнит — ищите курсы. В англоязычных интернетах с этим проще — идёшь на Udemy или Pluralsight и выбираешь курс по теме, где люди поменьше в комментах бугуртят на качество, и в бой. С русскоязычными курсами посложнее в выборе, но кто ищет — тот найдёт.

Ну и наконец если в целом вся эта тема с сервисами на своём домашнем сервере вам интересна, то вот отличный список selfhosted решений на все случаи жизни.

В общем, да пребудет с вами IT сила!

Источник

6 / 6 / 2

Регистрация: 25.11.2013

Сообщений: 239

Хочу создать сайт на собственном компьютере

27.01.2016, 04:22. Показов 1228. Ответов 11

Подскажите решил создать сайт на собственном компьютере, а точнее на ноуте, как правильно всё это организовать в плане программного обеспечения так как у меня стоит 7 windows? Прошерстив немного инет, понял что можно создать виртуальную машину к примеру: VirtualBox, а на неё установить уже: Ubuntu или Linux а на ней создавать свои сайты. Подскажите я двигаюсь в правильном направление или нет и что лучше Ubuntu или Linux? Подсказывайте свои идеи так как я в этом 0.

__________________
Помощь в написании контрольных, курсовых и дипломных работ, диссертаций здесь

163 / 159 / 27

Регистрация: 24.10.2013

Сообщений: 952

27.01.2016, 11:13

Сообщение от Chesterfield20

Ubuntu или Linux

Chesterfield20, Ubuntu это и есть Linux.
По теме, я очень далек от создания сайтов, но если сайт должен быть всегда в онлайне, тогда ноутбук не вариант.
Использование VirtualBox для таких целей, так-же считаю не совсем правильным решением.
Во вторых, я бы выбрал для этого дела десктоп, который всегда онлайн, ну и пожалуй поставил бы на него Ubuntu Server 14.04.3.
Это просто мое мнение.

6 / 6 / 2

Регистрация: 25.11.2013

Сообщений: 239

27.01.2016, 11:36

[ТС]

Что такое десктоп?

Добавлено через 7 минут
а ноут не может быть постоянно онлайн?

Модератор

8386 / 3082 / 106

Регистрация: 24.05.2011

Сообщений: 14,238

Записей в блоге: 8

27.01.2016, 11:49

Сообщение от Chesterfield20

Что такое десктоп?

В данном случае очевидно имеется ввиду системник. Тот, который люди ставят под стол, а на стол — только моник, клаву и мышу.

Сообщение от Chesterfield20

а ноут не может быть постоянно онлайн?

Да, может, конечно! Но долго-ли он протянет при этом?
Дело в том, что в ноутах, обычно, либо малы мощности и их довольно трудно нарастить, либо для этих достаточных мощностей недостаточное охлаждение — корпус тонкий, много воздуха не прогонишь…
То есть, ноут — не вариант для содержания сервера сайта.

Но вот потренироваться, попытаться что-то такое построить чисто «для себя», понять что там к чему и как — вполне подойдёт.

6 / 6 / 2

Регистрация: 25.11.2013

Сообщений: 239

27.01.2016, 12:11

[ТС]

Подскажите если ноут уйдёт в спящий режим то и выделенный сервер тоже перестанет работать?
И в правильном ли я направление двигаюсь по созданию самого виртуального сервера, не считая того что у меня не настольный ПК а ноут? Хотелось бы узнать правильно я установил VirualBox? Скачал последнюю 32 битную версию для windows, так как у меня 7windows, на виртуальный диск поставить Linux, или мне нужно скачать VirualBox для Linux?

Добавлено через 13 минут
Подскажите, для этого дела мне лучше скачать ubuntu Server или ubuntu Desktop?

Модератор

8386 / 3082 / 106

Регистрация: 24.05.2011

Сообщений: 14,238

Записей в блоге: 8

27.01.2016, 12:51

Сообщение от Chesterfield20

если ноут уйдёт в спящий режим то и выделенный сервер тоже перестанет работать?

Да, однозначно. Выделенный сервер не должен уходить ни в гибернацию, ни в сон. Для его пользователей (для удалённых юзеров сайта) такое поведение сервера равнозначно его выключению.

Сообщение от Chesterfield20

Скачал последнюю 32 битную версию для windows

В виндовсе кликаем ПКМ по «Компьютер», выбираем «свойства», видим программную архитектуру платформы.
Устанавливаем соответствующую по архитектуре версию виртуалбокса.
Запускаем программу Виртуалбокс.
Кликаем «Создать», создаём виртуальную машину: придумываем имя виртуальной машины, задаём тип ОС, создаём виртуальный HDD в файле .vdi , выбираем параметры виртуального хоста: размер оперативной памяти, разрядность и количество ядер процессора. Выбираем доступные для виртуального хоста интерфейсы — USB и подключение к сети.
Запускаем виртуальную машину.
Устанавливаем на неё любую ОС.
Ставим дополнения на виртуальную систему, создаём папку для обмена с реальным хостом.

А вообще — очень рекомендую почитать мануалы по данному вопросу, в сети их море. Можно и видео найти.

6 / 6 / 2

Регистрация: 25.11.2013

Сообщений: 239

27.01.2016, 13:33

[ТС]

Видео полно я знаю, но там только показано как установить Виртуалбокс и как установить ПО но какую скачивать не нашел ни в одном видео. Да и подскажите, если я отключу спящий режим то ноут будит работать постоянно и сервер тоже?

163 / 159 / 27

Регистрация: 24.10.2013

Сообщений: 952

27.01.2016, 21:07

Сообщение от Chesterfield20

ноут будит работать постоянно и сервер тоже?

Сервер «крутиться» на ноуте, соответственно, работает ноут-работает сервер.

Сообщение от Chesterfield20

лучше скачать ubuntu Server или ubuntu Desktop?

Chesterfield20, Не в обиду, но в Вашем случае пожалуй лучше будет Ubuntu Desktop.

1312 / 1238 / 212

Регистрация: 19.02.2010

Сообщений: 3,564

27.01.2016, 22:22

Так и хочется сказать, что господа знают толк в извращениях

сайт должен жить на нормальном веб-сервере. Бесплатного хостинга щас полно, платный хостинг тоже стоит дёшево.

На ноуте — просто дизайнить-верстать-разрабатывать-тестировать, после чего заливать разработку на сервак. Ставить виртуалку и бубунту — тоже не надо, под виндой нормально отработает и Small HTTP server (правда, он давно не обновлялся — но для начальных проектов хватит). Да, может потребоваться скачать и накатить дистрибутив php и/или прочих веб-приблуд (в зависимости от технологий, на которых будет разрабатываться сайт) — но в итоге всё равно выйдет сильно экономичнее по месту на винте и по памяти, чем виртуалка с линухом.

24 / 24 / 7

Регистрация: 25.04.2013

Сообщений: 195

28.01.2016, 00:28

лет 10 назад ставили Денвер и сайты и форумы ставили.

Модератор

8386 / 3082 / 106

Регистрация: 24.05.2011

Сообщений: 14,238

Записей в блоге: 8

28.01.2016, 19:53

Chesterfield20, огласите параметры вашего ноута, если не секрет.

Хочу в Исландию

1041 / 840 / 119

Регистрация: 10.11.2010

Сообщений: 1,630

28.01.2016, 20:19

Chesterfield20, у Вас есть IIS (Internet Information Services) в Windows 7? Этого достаточно чтобы установить веб сайт на своём компьютере чтобы его видели все кто есть в интернете. Ах да, ещё доступ в интернет нужен .

IT_Exp

Эксперт

87844 / 49110 / 22898

Регистрация: 17.06.2006

Сообщений: 92,604

28.01.2016, 20:19

Помогаю со студенческими работами здесь

Хочу создать сайт
Всем добрый день. Я частный предприниматель. Не так давно увлекся web — программированием (мое…

Хочу создать сайт
Хочу создать сайт не знаю какой выбрать хостинг хотел бы услышать мнение пользовался кто не будь…

Хочу создать сайт
Очень хочу создать свой интернет-магазин по продаже косметики из Израиля , но чтобы вложения были…

Хочу создать сайт
Что то сердцу снова хочется написать сайт..но про что,где,как расскрутить,какая диза,сам не…

Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:

Источник

Содержание:

Установка веб-сервера IIS
Установка PHP (FastCGI)
FAQ

Установка веб-сервера IIS

Открываем Панель управления -> Программы -> Включение или отключение компонентов Windows. Находим в списке раздел Службы IIS. Раскрываем его и выбираем нужные компоненты:

Устанавливаем компоненты веб-сервера

Базовый набор:

Безопасность. Выбираем все компоненты кроме «Проверка подлинности с сопоставлением сертификата …».
Компоненты разработки приложений. Мне нужна только компонента CGI, для последующей установки PHP.
Общие функции HTTP. Отмечаем все пункты.
Проверка работоспособности и диагностика. Выбираем «Ведение журнала HTTP» и «Монитор запросов».
Функции повышения быстродействия. Отмечаем все пункты.
Средства управления веб-сайтом. Отмечаем только «Консоль управления IIS».

Когда все пункты выбраны, нажимаем Ок. После завершения установки обязательно перезагружаемся!

Теперь переходим к созданию веб-сайта. Открываем Панель управления -> Система и безопасность -> Администрирование -> Управление компьютером (можно быстрее: меню Пуск -> правый клик на Компьютер -> в меню выбрать пункт Управление). В открывшемся окне раскрываем группу «Службы и приложения» и открываем «Диспетчер служб IIS». В окне Подключения выбираем папку Сайты, затем в правом окне Действия нажимаем на ссылку «Добавить веб-сайт».

Создаем новый веб-сайт (1)

Далее необходимо указать имя веб-сайта и месторасположение его файлов (по умолчанию c:inetpubwwwroot). Остальные опции оставляем без изменения.

Создаем новый веб-сайт (2)

Нажимаем OK. На этом базовая настройка завершена. Нужно проверить работоспособность только что созданного сайта. Открываем браузер и в адресной строке вводим: http://localhost. Если все работает правильно, вы увидите похожую страницу:

Тестируем созданный сайт

Последний штрих. Чтобы сайт был доступен из вне, необходимо открыть 80-й порт для входящих соединений. Как это сделать на примере штатного брандмауэра Windows 7:
Откройте Панель управления -> Система и безопасность -> Брандмауэр Windows -> Дополнительные параметры. В списке необходимо найти и включить правило Службы Интернета (входящий трафик HTTP) :

Открываем 80-й порт в брандмауэре Windows

В этом режиме базовой установки веб-сервер способен отображать только статические страницы (обычный HTML + JavaScript). Чтобы расширить его возможности, можно установить поддержку ASP, ASP.NET или PHP. Сам я занимаюсь программированием пока только на PHP, поэтому далее расскажу только об установке PHP на IIS в режиме FastCGI.

Установка PHP (FastCGI)

Конечно, оптимальный веб-сервер для PHP — это Apache, но все же бывают случаи когда требуется установить PHP на IIS. Тем более, в последнее время разработчиками была проделана большая работа, чтобы производительность PHP на IIS улучшилась.

Перед началом установки необходимо скачать релиз PHP с сайта http://windows.php.net/download/. Там предлагается несколько вариантов. Нам необходим релиз VC9 x86 Non Thread Safe. Для работы в режиме FastCGI это наиболее быстрый и стабильный вариант. Я рекомендую скачивать релиз с установщиком (installer), а не zip-архив (это для любителей ручной установки).

Теперь запускаем установщик. После нескольких не особо информативных окон нам предложат выбрать веб-сервер и режим работы PHP:

Установка PHP (1)

IISFastCGI — да, сейчас это единственный стабильный вариант установки PHP на IIS.

Далее переходим к выбору компонетов PHP. Если установку PHP производите впервые, лучше оставить значения по умолчанию.

После завершения работы установщика, переходим к настройкам IIS. В принципе здесь надо сделать только одно действие — поднять приоритет php-файлов, чтобы они обрабатывались в первую очередь. В диспетчере служб IIS нажимаем по названию нашего сайта и в окне справа выбираем раздел «Документ по умолчанию». В появившемся списке необходимо переместить index.php в начало:

Установка PHP (2)

Пользователи Windows 7 64-бит, внимание! Вам необходимо произвести одно дополнительное действие. Откройте раздел «Пулы приложений». Выделите DefaultAppPool и откройте «Дополнительные параметры» (через правый клик или в крайней правой колонке). В разделе Общие необходимо найти опцию «Разрешить выполнение 32-битных приложений» (Enable 32-bit Applications) и установить в положение True. Если уже созданы дополнительные пулы для уже существующих сайтов, то для каждого из них нужно проделать ту же операцию.

Теперь необходимо провести тестирование PHP. В корневую папку веб-сайта (c:inetpubwwwroot) необходимо поместить файл index.php со следующим содержанием:

<?php phpinfo()?>

Открываем сайт в браузере (http://localhost). Если все работает правильно, вы увидите страницу с информацией об установке PHP:

Тестируем PHP

Установка MySQL

Инструкция по установке MySQL на Windows вынесена в отдельную статью.

FAQ

При запуске сайта возникает ошибка: «Процесс не может получить доступ к файлу, так как он используется другим процессом. (Исключение из HRESULT: 0×80070020)».
Эта ошибка говорит о том, что порт, к которму осуществлена привязка сайта (по умолчанию 80-й), уже занят другим приложением. Очень часто такая ошибка возникает, если установлен другой веб-сервер (например Apache).
Чтобы выяснить какой процесс занимает 80-й порт, в командной строке введите: netstat -ano -p tcp
В колонке «Локальный адрес» ищем запись вида 0.0.0.0:80, далее смотрим какой «PID» соответствует этой записи. В «Диспетчере задач» открываем вкладку Процессы (опцию «Отображать процессы всех пользователей» должна быть отмечена). Далее переходим в меню Вид -> «Выбрать столбцы» отметь «ИД проесса (PID)». Теперь с помощью PID можно выяснить какой процесс занимает порт.
Еще одним из решений этой проблемы является привязка сайта к альтернативному порту (например 8080).
При запуске php-скрипта появляется ошибка: Warning: fopen(путь_к_файлу): failed to open stream: Permission denied in путь_к_файлу.
Проблема в том, что группа пользователей IIS_IUSRS имеет права только на чтение. Открыть свойства папки, в которой распологаются файлы веб-сайта (по умолчанию wwwroot), закладка Безопасность. В списке находим группу IIS_IUSRS и даем ей права полного доступа.
Как установить кодировку сайта.
Откройте «Диспетчер служб IIS», выберите нужный веб-сайт.В настройках сайта откройте раздел «Заголовки ответов HTTP». Нажмите ссылку Добавить. В открывшемся окне в поле Имя введите: Content-type, в поле Значение введите: text-html; charset=windows-1251 (см. скриншот). Вместо windows-1251 можно прописать любую другую кодировку.

Кодировка сайта

Ссылки по теме:

Настройка веб-сервера Apache + PHP + MySQL на Windows 7
Установка MySQL на Windows 7
Настройка ftp-сервера (IIS) на Windows 7
Настройка WebDAV на IIS (Windows 7)
Настройка DDNS — как сделать постоянный доступ к веб-серверу, если провайдер Интернет предоставляет только динамические внешние ip-адреса.

Источник