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

$ npm install express --save

       body Моё приложение! 

Мы будем ссылаться на CSS из фреймворка Bootstrap через Bootstrap CDN, это поможет нам быстро сделать стилизацию для этой демонстрации.

Двинемся вперёд и создадим наш HTTP-сервер в Node с помощью Express. Удалите всё из файла server.js и добавьте то что нам понадобится:

// берём Express var express = require('express'); // создаём Express-приложение var app = express(); // создаём маршрут для главной страницы // http://localhost:8080/ app.get('/', function(req, res) < res.sendfile('index.html'); >); // запускаем сервер на порту 8080 app.listen(8080); // отправляем сообщение console.log('Сервер стартовал!');

Кроме этого файла больше ничего не требуется, чтобы использовать Express для запуска HTTP-сервера и отправки HTML-файла!

require() является основным путём вызова пакета в Node. После создания Express-приложения в app , мы можем определить маршрут с помощью переменной HTTP. app.get() создаёт GET маршрут /.

При создании маршрутов, мы всегда будем иметь доступ к req (запрос) и res (ответ). Запрос содержит информацию из браузера. Ответ — это то, что мы отправим обратно пользователю. Мы используем sendfile() , но гораздо больше вещей можно сделать, отправляя данные обратно в формате JSON с помощью res.json() .

Сервер запускается через app.listen() и туда же передаётся желаемый порт 8080.

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

$ nodemon server.js

Теперь мы можем посмотреть на наш сайт в браузере по адресу http://localhost:8080.

Всякий раз, когда мы запускаем сервер с Node, он будет размещён по адресу http://localhost:НОМЕР_ПОРТА.

Это очень лёгкий и быстрый способ создать HTTP-сервер и начать разработку. Node и Express могут применяться для создания удивительных приложений или при необходимости они просто запускают простой сервер для работы.

Отлично! Мы уже много сделали с Node:

• установили Node;
• обработали очень простой файл;
• использовали npm для установки пакета;
• создали HTTP-сервер с Express;
• отобразили HTML-файл.

Давайте сделаем следующий шаг и создадим приложение, которое на самом деле показывает соответствующие данные.

Как запустить сайт, что дальше после верстки?

я новичок. Взял готовый дизайн код для сайта. Я его сверстал, html+css+js, адапатировал. Теперь у меня есть готовый код. Но какие действия дальше? Нужно превратить верстку во что? Сайт простой из одной страницы. То есть готов изучать, платить за хостинг и тд, но не представляю что нужно для этого. WordPress?

Отслеживать
5,103 2 2 золотых знака 10 10 серебряных знаков 25 25 бронзовых знаков
задан 11 фев 2020 в 12:18
99 2 2 серебряных знака 5 5 бронзовых знаков

Запустить веб-сервер, настроив его на раздачу вашей одной страницы, и поделиться адресом веб-сервера с народом

11 фев 2020 в 12:39
Нужно прежде всего научиться пользоваться поисковыми системами.
11 фев 2020 в 14:58

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

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

Отслеживать
ответ дан 11 фев 2020 в 12:40
Andrei Fedorov Andrei Fedorov
5,791 1 1 золотой знак 9 9 серебряных знаков 31 31 бронзовый знак
А заливать что? Html или php?
11 фев 2020 в 13:14

Заливать всё, что там у вас имеется. Если у вас ‘html+css+js’ то откуда тут взяться php? Если весь сайт -ваша страничка — свёрстана в виде одного файла — его и грузите. Если же в html подключены css и js в виде отдельных файлов — грузите на хостинг их все. Включая файлы картинок, если таковые имеются.

11 фев 2020 в 13:28

То есть, если у меня простой лендинг и только форма работающая на js, то всё будет работать(в теории), в том числе мне смогут на емейл писать люди? Выходит я просто загружаю всё, что есть(верстку в виде html,ccs+js) и ничего более не нужно?(ну соответственно править я только через код смогу текст). Спасибо за ответ заранее.

11 фев 2020 в 13:42

@Алекс, то есть надо залить всё на хостинг, запустить и опробовать. Если локально всё работает, возможно сразу заработает и на хостинге. Впрочем, если вы у себя использовали какие-то сторонние библиотеки, то их необходимо и на хостинге подключить. Если же не заработает сразу, что вы там написали, смотрите логи ошибок и исправляйте. Порой на хостинге сразу из коробки включены не все модули php, например. Едва ли javascript лично отправляет письма. Скорее, он обрабатывает форму и передаёт её php-скрипту. Значит и php у вас есть, а это уже другая история.

Размещение на GitHub Pages — Основы HTML, CSS и веб-дизайна

Мы уже изучили вкратце такие темы, как хостинг и HTTP-запросы в уроке Хостинг курса «Введение в веб-разработку». Стоит освежить память, перечитав тот урок, если следующие термины вам не сразу понятны:

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

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

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

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

1. Операционная система делает запрос в жёсткий диск или оперативную память.
2. Жёсткий диск или оперативная память отдают содержимое файла.
3. Операционная система направляет содержимое файла в программу «браузер».
4. Браузер обрабатывает файлы (потому что знает как это делать, ведь файлы написаны по стандартам HTML и CSS) и формирует внешний вид.

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

GitHub

Если вы проходите наши курсы по порядку, в рамках программ обучения (например, «Бэкенд JS-программист» или «Фронтенд JS-программист»), то в скором будущем вас ожидает курс по Git. Один из уроков там будет посвящён GitHub.

GitHub — это хранилище кода. Кроме этого GitHub предоставляет бесплатный хостинг для статических файлов — как раз то, что нам нужно. Этот сервис называется GitHub Pages .

Страницы, размещённые на GitHub Pages, могут быть доступны на их поддомене (например, https://guides.hexlet.io/ru/) или на домене второго уровня (например, мой блог https://rakh.im/ ), если у вас есть свой домен.

Для полноценной работы с GitHub необходимо хотя бы базовое понимание Git. Но если вы совсем не знакомы с этой темой — ничего страшного! Прямо сейчас, чтобы разместить страницу на GitHub Pages, нам достаточно следовать простому алгоритму.

1. Зарегистрируйтесь на https://github.com/ , если ещё не сделали этого.
2. Создайте новый репозиторий с именем username.github.io , где username — ваш ник на GitHub.
3. Создайте новый файл. Когда репозиторий не пуст, то в верхнем правом углу есть кнопка «Create New File», но сейчас, когда ещё нет ни одного файла, создать первый можно по прямой ссылке https://github.com/username/username.github.io/new/master , где username — ваш ник.
4. Введите имя index.html и скопируйте туда содержание файла index.html, который у вас получился в предыдущем уроке.
5. Нажмите кнопку «Commit new file».
6. Повторите то же самое для файла style.css.
7. Подтвердите публикацию на GitHub Pages. В настройках репозитория: Settings -> Раздел Options -> Секция GitHub Pages.
8. Через несколько мгновений страница станет доступна по вашему адресу https://username.github.io

(Если вы умеете работать с Git и собираетесь делать всё локально, то при создании репозитория советую выбрать «Initialize this repository with a README» — в таком случае репозиторий сразу создастся непустым, и его можно будет клонировать. В противном случае нужно будет инициализировать репозиторий локально и добавить удалённый репозиторий).

Остались вопросы? Задайте их в разделе «Обсуждение»

Вам ответят команда поддержки Хекслета или другие студенты