Kirill Mager

С точки зрения React, эти два компонента эквивалентны. В официальной документации React ничего не сказано о планах отказываться от компонентов классов в ближайшем будущем. Поэтому можете не беспокоиться  —  переписывать весь код вам не придётся. Но отвечая на Ваш вопрос, изучив документацию React и Medium, а также поучавствовав в коммерческих проектах, хочу отметить, что хорошей практикой будет поддержка кодовой базы в едином стиле насколько это возможно. Пусть не сразу, пусть постепенно, но переход к функциональным компонентам будет верным. Функциональные компоненты позволяют писать код элегантнee.

Советую почитать интересную свежую статью, где сравниваются функциональные и классовые компоненты и рассматриваются Хуки.

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

"Мы намерены охватить все возможные варианты использования классов в хуках, но мы всё ещё будем поддерживать классовые компоненты в обозримом будущем. В Facebook десятки тысяч компонентов, написанных в виде классов, и у нас нет абсолютно никаких планов их переписывать. Вместо этого мы начинаем использовать хуки в новом коде параллельно с классами" — документация React

Для этого в React есть хук useEffect (https://ru.reactjs.org/docs/hooks-effect.html)

Чтобы получить JSON при первой загрузке страницы нужно импортировать хук useEffect. У этого хука (хук = функция) есть 2 обязательных параметра - первый это функция (callback) и второй массив зависимостей (если его оставить пустым, хук сработает всего один раз, как Вам и требуется в задании).

Предлагаю пример кода ниже:
С помощью fetch делаем get запрос за данными, сервер вернет данные и после мы из них получаем json с помощью соответствуюего метода и затем выводим в консоль

import React, { useEffect } from 'react';

const Page = () => {
  useEffect(() => {
    fetch('https://jsonplaceholder.typicode.com/todos/1')
      .then(response => response.json())
      .then(json => console.log(json))
  }, []);

export default Page;