JavaScript с годами становится все более популярным языком, а его сообщество быстро растет, и разработчики постоянно разрабатывают и ежедневно создают инструменты для этого языка.
Поначалу сложно решить, какую библиотеку или фреймворк стоит начать изучать, чтобы ваша фронтенд разработка стремительно развивалась.
Эта статья посвящена показу преимуществ использования нескольких интерфейсных фреймворков/библиотек JavaScript и, в конечном итоге, дает более четкое представление о них.
React
React – это не совсем фреймворк, а скорее библиотека JavaScript для создания пользовательских интерфейсов.
Он имеет открытый исходный код и поддерживается Facebook и сообществом индивидуальных разработчиков.
Позднее он стал опенсорсным и выпущен для широкой публики в 2013 году, и с тех пор приобрел широкую популярность.
Некоторые из его функций включают следующее:
- Предоставляет реактивные, настраиваемые и повторно используемые компоненты
- Использует виртуальный DOM
- Очень быстрый
- На основе компонентов
- Односторонняя привязка данных
- Возможность повторного использования кода
- За ним стоит яркая и процветающая экосистема.
- Удобное управление состоянием
Установка и использование
React можно использовать двумя разными способами:
- Через CDN
- Использование Node.JS
Через CDN
Вы можете обратиться к их официальному сайту, чтобы получить ссылку на скрипт, которую вы можете включить в тег заголовка в своей разметке HTML.
Выбирайте ссылки в зависимости от вашей цели.
Например, при использовании в среде разработки:
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
И для продакшена:
<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
Использование Node.JS
sudo npm i -g create-react-app --save-dev
После завершения установки введите следующую командуcreate-react-app my-first-react-application
Приведенная выше команда установит все необходимые библиотеки, необходимые для правильной работы React, включая сервер разработки, веб-пакет и babel.
Перейдите в папку приложения my-first-response-application и выполните следующую команду
npm start
Vue.js
Vue.js – это прогрессивная среда JavaScript для создания интерактивных пользовательских интерфейсов и одностраничных приложений.
Этот фреймворк с базовой библиотекой, ориентированный на уровень представления.
Vue популярен, потому что он поддерживает одностраничные приложения.
В отличие от React, Vue использует необработанный HTML, а не JSX.
Vue.js является опенсорсным и изначально был создан Эван Ю и публично выпущен в феврале 2014 года.
Ниже приведены некоторые из функций.
- Он предоставляет реактивные и составные компоненты представления.
- Использует виртуальный DOM
- Сосредоточен на основной библиотеке (например, на маршрутизации и управлении состоянием)
- Область видимости в CSS обрабатывается без CSS-In-J
- Односторонняя привязка внутри компонентов.
- Поддержка основных дополнений
- Возможность повторного использования кода
Установка и использование
Вы можете использовать Vue.js в интерфейсе либо через CDN, либо с Node.js.
Чтобы использовать способ CDN, вы можете добавить следующий скрипт в раздел заголовка HTML-страницы.
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>