На прошлой неделе Шиме Видас пожаловался в Твиттере, что на мобильном устройстве сложно вставить блок текста . Я предложил использовать pastebin.com, но перед вставкой требуется много нажатий. Затем Шиме пошутил, что мы должны создать pastebinzero.com, и все, что ему нужно, это полноэкранный режим.
Так что я потратил буквально минуту, чтобы построить это. В моем браузере ничего, кроме входа в GitHub. От настройки до написания кода с поддержкой автозаполнения и до хостинга. Вы можете увидеть его во всей красе на https://codepo8.github.io/pastebinzero и посмотреть код на https://github.com/codepo8/pastebinzero .
И вы тоже можете это сделать. Вот как.
Если вы хотите увидеть это в виде видео, посмотрите следующее двухминутное пошаговое руководство.
В противном случае, вот шаги для запуска, сборки и размещения любого проекта на основе HTML /CSS/JavaScript на GitHub.
- Перейдите в свой профиль GitHub, нажмите «Репозитории» и нажмите кнопку «Создать».
- Вам нужно назвать репозиторий, так как позже это также будет частью URL -адреса. GitHub автоматически сообщит вам, доступно ли имя репо или нет. Убедитесь, что ваш репозиторий общедоступен, и нажмите «Создать репозиторий». Если вы не хотите показывать исходный код, а хотите, чтобы люди видели только результат, вы также можете сохранить его в тайне. Сгенерированные страницы GitHub всегда общедоступны.
- Это создало репозиторий, и вы получаете всю информацию о том, что делать дальше. А пока нажмите ссылку «создание нового файла».
- Назовите файл `index.html` и введите что-нибудь в качестве содержимого. Сейчас это не важно, так как этот редактор в порядке, чтобы сделать несколько быстрых исправлений, но не режет горчицу. Нажмите кнопку «Зафиксировать новый файл», и вы получите новый файл.
- Перейдите на вкладку «Настройки» и выберите пункт меню «Страницы». Обязательно выберите ветку «main» в раскрывающемся меню и нажмите «Сохранить». Это делает то, над чем вы работаете, доступным в виде URL -адреса в Интернете.
- Вернитесь в раздел «Код» репозитория и нажмите кнопку «.». Это загружает код Visual Studio в браузер с открытым проектом. Теперь вы можете написать свой проект, используя всю мощь VS Code, включая автодополнение и IntelliSense.
- Когда вы закончите, перейдите к опции `Source Control` в коде VS, введите сообщение фиксации и нажмите галочку. Это зафиксирует изменения в репозитории.
- Вы можете увидеть, когда ваш продукт доступен онлайн, на вкладке «Действия» вашего репозитория. Проверьте рабочий процесс «Сборка и развертывание страниц». Он показывает желтый счетчик, пока страница не будет готова. Когда он превратится в зеленую галочку, ваша страница готова.
Для демонстрации видео код доступен по адресу https://github.com/codepo8/greencircle , а версию в браузере можно увидеть по адресу https://codepo8.github.io/greencircle , где `codepo8` — мой пользователь GitHub. имя и `greencircle` имя репозитория
Почему не codepen, jsbin, codeandbox, jsfiddle…?
Есть десятки мест, где вы можете размещать и редактировать проекты онлайн, и у каждого из них есть свои преимущества и недостатки. Мне очень нравится этот способ, поскольку он дает мне полную функциональность кода Visual Studio, и мой проект находится в системе контроля версий. Я владею всем кодом и могу скачать его в любое время. Я также могу позволить другим людям раскошелиться и изменить его.
Многие из этих функций также доступны на других платформах, и мне очень нравится, что вы можете сразу увидеть результаты своих проектов по мере их кодирования. Но это похоже на отличное комплексное решение, требующее только одного входа в систему, которое мне в любом случае нужно для большей части моей работы. Кстати, если вы хотите, чтобы ваш проект сразу отображался внутри VS Code в браузере, вы также можете установить расширение Codeswing: https://ift.tt/TRh5XqO.