Статья

На тему: «Инструменты и стек разработки веб-приложения на

основе библиотеки React»

Для разработки веб-приложения требуется наличие необходимых

инструментов, позволяющие начать непосредственно проектирование и

разработку.

Инструменты:

Visual Studio Code (VS Code) — текстовый редактор, разработанный

Microsoft для Windows, Linux и macOS. Позиционируется как «лёгкий»

редактор кода для кроссплатформенной разработки веб- и облачных

приложений. Включает в себя отладчик, инструменты для работы с Git,

подсветку синтаксиса, IntelliSense и средства для рефакторинга. Имеет

широкие возможности для кастомизации: пользовательские темы, сочетания

клавиш

и

файлы

конфигурации.

Распространяется

бесплатно,

разрабатывается как программное обеспечение с открытым исходным кодом,

но готовые сборки распространяются под проприетарной лицензией.

Допускается использование альтернатив в виде Atom,

Sublime

text,

Notepad++, Brackets и т.д.

Стек:

HTML

(HyperText Markup Language) — это язык гипертекстовой

разметки текста. Он нужен, чтобы размещать на веб-странице элементы:

текст, картинки, таблицы, видео и прочее.

При заходе на сайт, браузер подгружает HTML-файл с информацией о

структуре

и

контенте

веб-страницы.

HTML

выстраивая

визуальный

фундамент сайта, но не «запускает» сайт самостоятельно. Он указывает, где

располагаются элементы, какой у них будет базовый дизайн, откуда брать

стили для элементов и скрипты (обычно их пишут на JavaScript).

CSS. Для визуального оформления WEB-страницы создан язык CSS.

CSS переводится как каскадные таблицы стилей (Cascading Style Sheets).

Именно этот язык отвечает за то, как HTML-элементы будут выведены

пользователю в браузере.

JavaScript

–

это

язык

программирования,

который

используют

разработчики для создания интерактивных веб-страниц. Функции JavaScript

могут улучшить удобство взаимодействия пользователя с веб-сайтом: от

обновления ленты новостей в социальных сетях и до отображения анимации

и интерактивных карт. JavaScript является языком программирования для

выполнения на стороне клиента, что делает его одной из базовых технологий

во всемирной сети Интернет. Например, карусель изображения, выпадающее

по клику меню и динамично меняющиеся цвета элементов на веб-странице,

которые вы видите во время просмотра страниц в Интернете, выполнены при

помощи JavaScript.

React

— это JavaScript-библиотека для создания пользовательских

интерфейсов. Обратите внимание, что это именно библиотека, а не

фреймворк. React часто называют фреймворком, но это ошибка. Во-первых,

его использование ни к чему вас не обязывает, не формирует «фрейм»

проекта. Во-вторых, React выполняет единственную задачу: показывает на

странице компонент интерфейса, синхронизируя его с данными приложения,

и только этой библиотеки в общем случае недостаточно для того, чтобы

полностью реализовать проект.

Redux

— это инструмент для управления состоянием данных и

пользовательским

интерфейсом

в

приложениях

JavaScript

с

большим

количеством сущностей. Представляет собой библиотеку JavaScript.

React Router — решение для переключения и маршрутизации страниц

React. Библиотека стала одним из первых популярных проектов с открытым

исходным кодом на основе React.