Такие читатели, как вы, помогают поддерживать MUO. Когда вы совершаете покупку по ссылкам на нашем сайте, мы можем получать партнерскую комиссию.

Angular — это надежная среда JavaScript для создания одностраничных приложений. Google разработал программное обеспечение и поддерживает его вместе с участниками со всего мира.

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

Давайте узнаем больше об Angular, клонировав проект с GitHub и запустив его локально.

Предпосылки для клонирования

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

  • У вас должна быть установлена ​​стабильная версия Node.js. Если нет, учись как установить Nodejs на Ubuntu или установить Nodejs в Windows.
  • Вам следует установить Git.
  • У вас должна быть учетная запись GitHub.

1. Установить диспетчер пакетов узла

Менеджер пакетов узлов (npm) — это программный репозиторий для пакетов JavaScript. npm имеет CLI (интерфейс командной строки), который выполняет различные задачи. Вы можете использовать интерфейс командной строки для загрузки, установки и развертывания программного обеспечения.

Когда вы устанавливаете Node.js, он поставляется с пакетом npm. Чтобы проверить версии пакетов Node.js и npm, запустите в терминале следующее:

Чтобы проверить версию установленного Node.js, распечатайте версию с помощью следующей команды:

узел --версия

Вы можете проверить версию npm, используя ту же опцию:

нпм --версия

2. Установите угловой интерфейс командной строки

Вы можете использовать Angular CLI для выполнения различных задач разработки. Задачи включают создание приложений, тестирование и развертывание. Чтобы установить Angular CLI, выполните следующую команду:

$ нпм установить -g @угловой/cli

Чтобы проверить версию Angular CLI, выполните команду:

$ нг версия

3. Найдите проект на GitHub

Вы будете клонировать Giphy-Реплика проект с гитхаба:

Перейдите к зеленой кнопке с надписью Код. Нажмите на него, чтобы открыть раскрывающийся список. Скопируйте ссылку HTTP или SSH. Любой из этих двух подойдет.

4. Клонировать проект локально

Сначала создайте папку и назовите ее Angular-Clone.. Не забудьте перейти в папку с помощью следующей команды:

cd Угловой-Клон

Затем запустите git клон Команда для копирования проекта в вашу папку.

мерзавец клон https://github.com/Reuben-Kipkemboi/Giphy-Replica.git

Затем проверьте папку Angular-Clone, чтобы увидеть, находится ли внутри клон Giphy-Replica. Бегать лс для отображения содержимого папки:

лс

Перейдите в папку:

CD Giphy-Реплика

На этом этапе вы можете проверить файлы проекта в редакторе кода по вашему выбору или просмотреть их через веб-интерфейс GitHub.

5. Установить npm-пакеты

Вам необходимо установить все пакеты и зависимости из клонированного проекта, чтобы запустить его. Чтобы установить пакеты, запустите:

нпм установить

Если вы столкнулись с какими-либо отчетами об уязвимостях, исправьте их с помощью:

исправление аудита npm

6. Откройте проект в браузере

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

нг служить

Затем откройте http://localhost: 4200/ в браузере для просмотра проекта.

Вы можете использовать Angular CLI для автоматического открытия проекта в браузере:

$ нг служить -о

Эта команда создает приложение, запускает сервер и следит за обновлениями файлов.

В вашем браузере вы должны увидеть сайт Giphy-Replica:

Зачем клонировать проект Angular?

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

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