Пошаговое руководство для начинающих по началу работы с хостингом Firebase
Являетесь ли вы программистом, художником, музыкантом, бизнесменом, предпринимателем, вы хотели бы иметь свой веб-сайт. Кроме того, если вы студент, во многих случаях вам будет полезно иметь портфолио.
Как насчет веб-портфолио, а не распечатанного резюме?
Мы все знаем, что веб-сайты содержат HTML. Даже если вы не знакомы с веб-конфигурациями HTML, вы можете пройти онлайн-учебники и легко освоиться с ними.
После того, как вы закончите свой веб-сайт, вы можете разместить его. Я оставлю вам веб-конфигурацию; так что вы можете создать его, как вы предпочитаете. Но я расскажу вам, как разместить его БЕСПЛАТНО.
Требования:
- Настроенный сайт.
- учетная запись Gmail.
- Доступ к консоли Firebase.
Я полагаю, что теперь у вас есть свой веб-сайт, и если у вас нет учетной записи Gmail, создайте ее в самом начале.
Откроем Firebase по этой ссылке.
Нажмите кнопку Войти и введите свои учетные данные Gmail. После завершения процесса входа нажмите кнопку Перейти к консоли.
Теперь вы могли видеть это окно; поэтому нажмите Добавить проект ( + ), чтобы продолжить.
Затем дайте подходящее имя и создайте свой проект. (например: myFirebaseHosting)
Перейдя сюда, нажмите Хостинг и Начать работу соответственно.
Теперь вам будет предложено установить Firebase CLI на свой компьютер. Прежде чем начинать этот процесс, убедитесь, что вы установили Node на свой компьютер. Если на вашем компьютере нет Node, щелкните ссылку ниже, чтобы установить Node на свой компьютер.
Откройте командную строку на компьютере с Windows/терминале на Mac. Затем введите приведенную ниже команду, чтобы установить Firebase CLI.
Если вы используете компьютер Windows:
$ npm install -g firebase-tools
Если вы используете Mac:
$ sudo npm install -g firebase-tools
Когда вы закончите до этого момента, введите приведенную ниже команду, чтобы проверить версию Firebase, и она вернет результат, если вы правильно выполнили описанный выше процесс.
$ firebase -V
Теперь введите приведенную ниже команду на своем терминале и введите свои учетные данные для входа в Firebase.
$ firebase login
Хорошо, теперь пришло время открыть ваш веб-проект с помощью текстового редактора. Я предпочитаю VS Code, потому что он содержит терминал, поэтому я могу работать в одном окне.
Перейдите в корневой каталог проекта, затем введите приведенную ниже команду, чтобы инициализировать Firebase в вашем проекте.
$ firebase init
Вам нужно выбрать Хостинг. Чтобы выбрать его, используйте клавишу со стрелкой вниз, чтобы перейти вниз, и клавишу пробела, чтобы выбрать параметр. Затем выберите Использовать существующий проект и выберите свой проект Firebase, который мы создали ранее (в моем случае это myFirebaseHosting).
Затем вам будет предложено выбрать общедоступный каталог; если ваш проект содержит только HTML, CSS и JS, оставьте его общедоступным и нажмите Enter, чтобы продолжить. Если вы используете для проекта такие фреймворки, как Angular, VueJS, вы можете соответствующим образом выбрать общедоступный каталог.
Затем введите N, потому что в вашем проекте могут быть разные страницы; так что это не одностраничное приложение.
Инициализация вашей firebase завершена. Итак, вы можете увидеть публичный каталог внутри папки вашего проекта. Перейдите в общий каталог и удалите файл index.html; вам это не нужно, потому что у вас есть собственный файл index.html.
Затем переместите все свои файлы HTML, CSS, JS в общий каталог. Теперь все ваши настроенные файлы находятся внутри общего каталога со страницей 404.html (ошибка).
Хорошо, теперь вы почти готовы опубликовать свой сайт. Прежде чем развертывать его, давайте протестируем веб-сайт локально. Введите приведенную ниже команду на своем терминале, чтобы протестировать ее локально.
$ firebase serve
Теперь пришло время развернуть ваш сайт. Введите приведенную ниже команду на своем терминале. (нажмите control+c, чтобы завершить предыдущий процесс)
$ firebase deploy
Щелкните соответствующую ссылку, чтобы открыть свой проект, и теперь он доступен по всему миру.
Снова перейдите в консоль Firebase, и там вы увидите все доступные ссылки для вашего веб-сайта и истории развертывания вашего проекта.
Теперь ваш сайт работает; так что вы можете поделиться им с друзьями. Я рекомендую вам повторить этот процесс еще два-три раза, чтобы ознакомиться с хостингом firebase. Тогда вы сможете легко разместить свой сайт в будущем.
Спасибо за прочтение. Если у вас есть какие-либо вопросы, не стесняйтесь оставлять ответ ниже.
