LITMIR.BIZ

Скачать книгу

начало работы с проектами на 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 в. tsx11, чтобы использовать синтаксис TypeScript.

      Теперь вы можете продолжить разработку вашего приложения с поддержкой TypeScript.

      Примечание: Создать приложение на React и Typescript можно сразу, задав команду: npx create-react-app – template typescript my-app

      2.5 Заключение

      Настройка разработочного окружения для React и TypeScript представляет собой важный первый этап при создании веб-приложений. Этот процесс включает в себя установку Node. js и npm, а также использование инструмента Create React App, который делает разработку более удобной и эффективной. Node. js обеспечивает среду выполнения JavaScript на сервере, а npm – управление пакетами, необходимыми для проекта. Кроме того, настройка TypeScript добавляет строгую типизацию, способствуя предсказуемости и надежности кода. Это особенно важно при работе с крупными и сложными проектами.

      После завершения этой начальной конфигурации вы будете готовы приступить к созданию компонентов и приложений с использованием React и TypeScript. Эта начальная конфигурация обеспечивает вам устойчивую основу для разработки.

      В следующих главах мы подробно рассмотрим техники создания мощных веб-приложений в стеке React и TypeScript.

      Глава 3. Понятие компонента в React

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

      3.1 Понятие компонента в React

      В React, компонент – это основная строительная единица пользовательского интерфейса. Он представляет собой независимую и переиспользуемую часть интерфейса, которая может содержать в себе как структуру (HTML-элементы), так и логику.

      Компоненты в React могут быть разделены на два типа:

      – Функциональные компоненты: Это

Скачать книгу