Разработка фронтенд-приложений не так проста, как думает большинство людей / клиентов: D. На самом деле это зависит от нескольких сценариев, таких как сложность приложения, осведомленность и готовность использовать сторонние библиотеки, которые мы можем использовать для служебных функций, хотим ли мы использовать структуру JavaScript или нет, пригодность выбранной структуры JavaScript и т. Д.

Обычно мы используем сторонние библиотеки для экономии времени и энергии на разработку. Это касается не только JavaScript, даже с такими языками, как C #, Java и многие другие языки, мы используем сторонние библиотеки, чтобы сделать жизнь разработчика безболезненной. Как они могут нам помочь?

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

Как добавить библиотеки?

В JavaScript уже встроены некоторые служебные функции, например Math.random (). Мы можем использовать эти функции, а также сторонние служебные функции. jQuery, moment, lodash, axios - это некоторые из широко используемых, известных сторонних библиотек. Есть несколько способов добавить библиотеку в проект.

  • Сеть доставки контента (CDN)
  • Загрузите файлы JavaScript и добавьте эти файлы в проект и ссылку (уменьшенная версия уменьшает размер файла, следовательно, быстрее загружается)
  • установка npm (с библиотеками / фреймворком javascript)

В моей предыдущей статье JavaScript: сетевые (Http) запросы я упомянул, чтобы обсудить библиотеку axios и то, как мы можем использовать ее для HTTP-запросов. Так что я полагаю, что сейчас самое время для этого.

Иллюстрация: Axios

Axios - это библиотека JavaScript (HTTP-клиент на основе обещаний), которую мы можем использовать для асинхронных HTTP-запросов к конечным точкам REST и выполнять операции CRUD.

Первый шаг - получить ссылку на CDN для axios и добавить ее в проект.

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="./app.js"></script>
// app.js is the file we write our javascript code
// Important: axios library import should be before the app.js

Пример вызова axios

async function getUsers(){
  try{
   const response = 
   await axios.get('https://jsonplaceholder.typicode.com/users');
   console.log(response.data);
  }catch(error){
   alert(error.message);
  }
}

Важные моменты

  • Не включает функции, которые никогда не используются (влияют на размер пакета)
  • Подумайте о безопасности и уязвимости
  • Проверить поддержку браузера
  • Всегда используйте ухоженные библиотеки
  • Документация
  • Гибкость использования
  • Вклад