react

Использование Redux с Nest.js

См. статью: https://redux.js.org/usage/nextjs

Прочие материалы

Прочие материалы см. по ссылкам ниже

useCallback:

• Полезен чтобы не вызывать ререндер компонента, если функция передается в него как пропс (в если такая ситуация возможно обычно этот хук надо использовать)
• Если же функция просто определена на уровне компонента и ререндер уже начался, то плюса в производительности не будет

Подробнее можно почитать: https://habr.com/en/articles/529950/

Кратко о задаче

Требуется реализовать страницу, содержащую таблицу с перечнем товаров, по которым можно будет искать, редактировать их и добавлять новые.

Т.е. это только одна страница, но на ней довольно много всего

Что использовать

Рекомендуется использовать:

• React.js
• Typescript (создаем проет в этом режиме)
• Redux

Подробнее

Использовать React/Redux

NMP https://www.npmjs.com/package/json-server

Заметки у нас на сайте по тэгу json-server

• 1) Как начать - сразу после запуска приложения (минимального) стоит прочитать основную документацию
• 2) Тренировочная задача

sh: react-scripts: not found

Основная тема: https://fkn.ktu10.com/?q=node/16517

Возможный вариант:

docker-compose.yml:

version: '3.9'
services:
  frontend:
    working_dir: /var/www
    volumes:
      - '.:/var/www'
    ports:
      - "3000:3000"

Dockerfile:

FROM node:18.15-alpine
WORKDIR /var/www
COPY package.json ./
COPY package-lock.json ./
RUN npm ci
COPY ../ .
CMD npm start

Проблемы и решения для node_modules/

Всего есть две задачи/проблемы:

Можно написать обертку вида:

Для обработки отдельно одинарного и двойного клика, можно использовать такой пользовательский хук: