Перевод состоит из двух частей:
-
Сама страница, текст, которой приходит с бэка по REST API запросу с указанием нужного языка
-
Перевод вспомогательных компонентов: кнопки, элементы навигации, отдельные заголовки.
Так же нам нужно переключение с английского языка на французский и обратно.
Для удобства работы будем использовать библиотеку Axios (установка npm i axios).
В корне проекта в папке store заводим инстанс, который отвечает за первичную настройку запросов:
apiInstance.ts
import axios from 'axios';
const URL = process.env.NEXT_PUBLIC_API_URL;
const instance = axios.create({
baseURL: `${URL}/api/`,
});
export default instance;