Можно ли написать в React компонент на js, вместо jsx?

Да, абсолютно можно написать компонент React на чистом JavaScript вместо JSX. JSX является просто синтаксическим расширением JavaScript, которое предоставляет более декларативный и удобочитаемый способ описания UI компонентов в React. Однако сам React не зависит от JSX, и вы можете использовать JavaScript для написания компонентов без проблем.

Если вы предпочитаете использовать JavaScript, вам нужно будет использовать функцию React.createElement(), чтобы создать элементы React. Эта функция принимает три аргумента: тип элемента (может быть строкой, функцией или классом), объект с атрибутами элемента (также известного как props) и дочерние элементы (которые могут быть другими элементами React или просто строками).

Давайте рассмотрим пример. Вот как выглядит простой компонент React, написанный с использованием JSX:

import React from 'react';

const MyComponent = () => {
  return <div>Hello, World!</div>;
};

export default MyComponent;

Теперь давайте перепишем этот компонент на чистом JavaScript с использованием React.createElement():

import React from 'react';

const MyComponent = () => {
  return React.createElement('div', null, 'Hello, World!');
};

export default MyComponent;

Оба этих примера эквивалентны и создадут один и тот же компонент, который будет отображать текст "Hello, World!" внутри <div>.

Хотя использование JSX более распространено и рекомендуется при разработке с React, вы всегда можете использовать JavaScript для создания компонентов, если вам это более удобно или на вашем проекте есть ограничения на использование JSX. React предлагает эту гибкость, чтобы разработчики могли выбрать тот способ, который лучше всего соответствует их потребностям.