React и TypeScript: Практическое руководство. Быстрый старт. Ирина Кириченко

Чтение книги онлайн.

      – Code Runner: Позволяет запускать код (в том числе, скрипты) прямо из редактора без переключения в терминал.

      Для установки расширений откройте Visual Studio Code. Перейдите во вкладку «Extensions» (или нажмите Ctrl+Shift+X). В поисковой строке введите название и найдите соответствующий плагин. Нажмите кнопку «Install» (Установить) рядом с расширением.

      После установки, убедитесь, что установленные вами плагины активированы.

      2.3 Создание проекта с использованием Create React App

      Create React App – это инструмент, который позволяет быстро создать новый проект React с предустановленной конфигурацией и набором инструментов для разработки. Это отличное решение, как для начинающих, так и для опытных разработчиков, позволяя сэкономить время и значительно упростить рабочий процесс.

      Удобство использования Create React App:

      – Быстрый старт. Разработка нового приложения на React занимает всего несколько минут. CRA создает стандартную структуру проекта и настраивает сборку.

      – Готовая конфигурация. CRA предоставляет настройку для Webpack, Babel и других инструментов, сэкономив ваше время на ручной настройке.

      – Автоматическое обновление зависимостей. CRA следит за обновлениями зависимостей и предупреждает о несовместимостях. Это позволяет легко поддерживать приложение в актуальном состоянии.

      – Простое развертывание. CRA предоставляет средства для удобного развертывания приложения на различных хостинг-платформах.

      – Простой интерфейс командной строки: CRA предоставляет команды, такие как npm start для разработки и npm build для создания оптимизированной версии приложения.

      Таким образом, Create React App облегчает начало работы с проектами на React и позволяет разработчикам сосредотачиваться на написании кода и создании приложения, не тратя много времени на конфигурацию инструментов.

      Для создания проекта с использованием Create React App выполните следующие шаги:

      – Откройте терминал в вашем редакторе кода и выполните следующую команду для установки Create React App глобально на вашем компьютере:

      npm install -g create-react-app

      – Создайте новый проект React, заменяя my-app на имя вашего проекта:

      npx create-react-app my-app

      Эта команда создаст новую директорию my-app с начальной структурой проекта.

      – Перейдите в директорию проекта:

      cd my-app

      – Запустите разработческий сервер:

      npm start

      Это запустит сервер разработки и откроет ваше приложение в браузере.

      2.4 Установка TypeScript

      Теперь, когда у вас есть проект React, созданный с помощью Create React App, вы можете добавить поддержку TypeScript.

      Шаги для установки TypeScript в проект:

      – Остановите разработческий сервер, если он запущен, нажав Ctrl + C в терминале.

      – Выполните следующую команду для установки TypeScript и связанных инструментов:

      npm install – save typescript @types/node @types/react @types/react-dom @types/jest

      – Переименуйте файлы в вашем проекте с расширением. js в. tsxСКАЧАТЬ