Представим, что у вас получился классный сайт.
Мой вот здесь.
Я щелкну файл index.html,
у меня в него добавлены изображения,
есть специальный файл CSS,
с которым вы пока не знакомы, но ничего страшного.
Давайте посмотрим, как выглядит мой сайт.
Готово.
Вот небольшая страница обо мне тут я применила немного оформления.
Но если вы посмотрите в верхний угол,
вы увидите, что сайт не размещен в сети.
То, что здесь написано, file:// и т.д.,
указывает, что я не могу поделиться им с другими людьми.
Я могу отправить им свой код,
могу сказать: «Посмотрите!
Я сделала веб-страницу!», а потом отправить
этот файл и все изображения,
но это очень муторно.
Поэтому давайте разместим этот сайт в сети через учетную запись GitHub Pages.
Вернемся сюда,
к учетной записи GitHub. Если вы ее еще не создали, ничего страшного.
У меня есть видео на эту тему.
Создайте учетную запись и возвращайтесь.
Как бы то ни было,
я собираюсь впервые разместить что-то в сети.
Опять нажимаю знак «плюс» в верхнем углу, выбираю «Новый репозиторий».
Это такая новая папка, наполненная кодом.
В прошлый раз мне нужно было внимательно отнестись к имени репозитория, но не сейчас.
Назову этот...
например, sample, все строчными буквами.
Вы можете вставить дефис,
но никаких специальных символов.
Я оставлю просто как sample.
Очень важно выбрать «Инициализировать этот репозиторий с помощью README».
Я нажму эту кнопку.
А затем «Создать репозиторий».
Сейчас GitHub создает новый сайт, в который я смогу загрузить код.
Те, кто использует GitHub,
я имею в виду активно,
многое делают с помощью
командных строк, многое нужно запоминать.
Но мы этого делать не будем.
Мы всего лишь размещаем код на GitHub Pages.
Итак, нажмем «Загрузить файлы».
Тут нужно быть внимательнее.
Если я нажму «Выбрать файлы»,
я смогу выбрать несколько файлов,
этот и этот, например,
но я не смогу загрузить всю папку.
Видите, если я нажму CSS и «Открыть»,
проводник снова предложит выбрать файлы.
Но мне нужно все, что есть в этой папке.
Итак, я нажала «Добавить».
Теперь я перейду сюда,
вернусь на папку назад
и перетащу сразу всю папку.
Так я смогу загрузить нужное количество файлов.
Ошибка, которую я часто допускаю, — я забываю
прокрутить страницу вниз и выбрать «Подтвердить изменения».
Это первый из двух шагов по размещению сайта.
Первый шаг — загрузка файлов.
Опять же, это может занять несколько минут.
Пока файлы загружаются...
Оп, все загрузилось.
Теперь я нажму
«Настройки» здесь вверху. Отлично.
Теперь мне нужно указать,
что я не хочу, чтобы пользователи видели мой код
при посещении страницы.
Я хочу, чтобы они видели саму страницу.
Я вернусь сюда,
прокручу вниз,
прокручу мышью.
Я ищу раздел GitHub Pages.
Выбираем «Нет» и указываем «основная ветвь».
Никогда не знаешь, сработало или нет.
Обновляем.
Нажимаем сюда и прокручиваем вниз.
Если я перейду к GitHub Pages, здесь теперь будет указано,
что код уже загружен.
Нажимаем эту ссылку.
Довольно часто бывает указано,
что ничего еще не загружено или что-то в этом духе.
Сейчас я сделаю следующее:
я вернусь к коду и еще раз посмотрю
название папки, которую я перетащила.
О, это была папка sampler.
Какое имя файла?
Надеюсь, index.html. Да, точно.
Перейду сюда.
И теперь при нажатии
выдается ошибка 404.
Не переживайте, такое будет случаться часто.
Прежде всего нужно проверить,
не допустили ли вы опечатку.
Да, есть такое. Я написала sample вместо sampler.
Давайте добавим сюда r.
Теперь я нажму Enter, и передо мной откроется мой сайт. Отлично.
Таким образом,
два этапа создания учетной записи GitHub — это загрузка
файла и изменение ссылки GitHub Pages для его подключения.
После этого
можно загрузить неограниченное число файлов.
Сейчас я сделаю кое-что по-быстрому.
Я вернусь в учетную запись GitHub
и сделаю это еще раз, но чуть-чуть по-другому.
Перехожу на github.com.
Создаю еще один репозиторий.
Назову его
sample2 и в этот раз
забуду нажать кнопку с README.
Нажимаем «Создать репозиторий».
Теперь я нигде не вижу область для загрузки файлов!
Это может сбить с толку.
Если вы забыли это сделать, прокрутите страницу до ссылки README.
Нажмите. Это создаст файл README.
Прокрутим вниз.
Просто чтобы вы знали, «Подтвердить новый файл» —
это то же самое, что сохранить файл, как на рабочем столе.
Теперь я могу загружать файлы.
Я сделаю это еще раз и покажу вам
более простой способ. Вернусь сюда.
Вместо того, чтобы перетащить всю папку sampler,
я просто выделю ее содержимое и перетащу его.
Все файлы загружаются.
Я нажимаю «Подтвердить изменения».
Пока загрузка выполняется,
я хочу, чтобы вы задумались, каким был второй шаг.
Что нужно сделать следующим.
Этот шаг — перейти в настройки и добавить GitHub Pages.
Давайте перейдем в настройки.
Вот они здесь.
Прокрутите вниз, выберите «основная ветвь» и сохраните.
Поскольку я немного ленивая,
я просто снова прокручу вниз,
и вот — ссылка на мой сайт.
Я нажму ее. Опять же, если появится ошибка 404,
обычно этому есть две причины: либо вы что-то неправильно
написали... Здесь это явно не подходит: мы просто щелкнули,
ничего не писали.
Или нужно подождать еще пару минут, пока GitHub
все не загрузит. И третья причина: иногда так происходит,
я не уверена, с чем это связано,
но GitHub как будто забывает найти файл index.html.
Нажимаю Enter. И вуаля.
Итак, GitHub Pages — это прекрасный бесплатный сервис, на котором
вы можете разместить код и поделиться вашей страницей.
Все наверняка будут поражены, какую великолепную работу вы проделали.