Sobes.tech
Назад к задачам
Junior — Senior
24

Проверка кода React‑компонента App

Компании, где спрашивали:

HolyWeb
Получайте помощь с лайвкодингом в реальном времени с Sobes Copilot
Условие задачи

Необходимо выполнить ревью React‑компонента. Оценить правильность вывода информации, корректность использования свойства key, порядок сортировки данных и возможные места для оптимизации.

import "./styles.css";
import { Person } from "./Person";
import { useEffect, useState } from "react";

const people = [
  {
    id: 2,
    name: "Виктор",
    lastName: "Вью",
    age: 26,
  },
  {
    id: 3,
    name: "Константин",
    lastName: "Ангулрин",
    age: 20,
  },
  {
    id: 1,
    name: "Илия",
    lastName: "Реактова",
    age: 23,
  },
];

export default function App() {
  const now = new Date().toLocaleTimeString();
  const [currentTime, setCurrentTime] = useState(now);

  const personsList = people.map(({ name, lastName, id }) => (
    <Person key={id} name={name} lastName={lastName} id={id} />
  ));

  useEffect(() => {
    setInterval(() => setCurrentTime(new Date().toLocaleTimeString()), 1000);
  }, []);

  console.log("render App");

  return (
    <div className="App">
      Time: {now}
      {personsList}
    </div>
  );
}