Amazing-Space-Invader

не стоит так делать

Потому что на ваши картинки от отдает 404, т.к. единственная статика которую он знает (исходя из вашего куска кода) - это /front-end/add.html

Если картинки в отдельной папке, имеет смысл натравить express.static и на них

app.use(express.static(__dirname + '/front-end/images'));

Или так

app.use('/images',express.static(__dirname + '/front-end/images'));

а нужен ли фрейворк для таких задач?
я вот счас только подумал сделать сервис и контроллер обычными js обьектами
плюс применить какой-то простой шаблонизатор

В таком случае советую React+Redux
Очень доволен, после backbone и беглого взгляда на ember(Хороший, но реальный мастодонт)
Если заинтересует в комментариях скину ссылочки на книжечки по реакту и редаксу... реально можно начать что-то писать через пару вечеров, понимание придет конечно позже... но старт относительно быстрый

devop = developer + operator
то есть, он должен быть как разработчик, но еще и эксплуатант

У вас приведено 2 куска кода из 2х разных миров:
1) это код из мира фронтенда, в котором вы выполняете запрос на /api/user/
2) это код из мира бэкэнда, в котором вы обрабатываете роут ???/user (почему ???, потому что не видно главного файла сервера, но если представить, что вы разбираете какой-то рабочий пример, скорее всего это и есть обработчик /api/user роута)

API (wikipedia)

Как это завязать на API

1. Делается сервер (на любом из языков), который в принципе является набором роутов, например:

GET на роут /products - отдает все продукты
 POST на роут /products/add - создает новый продукт
 GET на роут /proudcts/1231rh8fdf - отдает один продукт с id 1231rh8fdf
 DELETE ...
 PUT ...

2. Пишется клиент, если в рамках реакт-редукса, то главное в вашем вопросе, это то что вы уже привели - запросы на определенный роут в action creator.
Например:

export function signIn(email, password) {
  return dispatch => {

    dispatch({
      type: USER_SIGN_IN_REQUEST,
    })

    const data = {
      session: {
        email,
        password,
      },
    }

    httpPost(`http://${API_ROOT_V1}/api/sessions`, data)
      .then((data) => {
        dispatch({
          type: USER_SIGN_IN_SUCCESS,
          data: data.account,
        })
      })
      .catch((err) => {
        console.warn(`Sign in error: ${err}`) //eslint-disable-line no-console
        dispatch({
          type: USER_SIGN_IN_FAILURE,
          err,
        })
      })
  }
}

Этот action creator (создатель действий) делает POST запрос на API-сервер (можно и так называть сервер в частном порядке) вместе с логином и паролем. Далее сервер обрабатывает этот запрос (то есть ищет совпадение роута и метода (get/post/put..) и выполняет необходимые операции, после этого выдает ответ (например, json с данными о юзере) и вы эти данные устанавливаете в ваш reducer.

Все что вам нужно, это действительно, разобраться что же такое API и с чем его едят. Конкретных статей на это, к сожалению, дать не могу. Может быть кто-то подскажет дельные.

Итого: что такое API в проекте на React - вопрос не корректный. Правильный вопрос: как вы взаимодействуете с API в приложениях написанных на react, либо: как написать API на языке ХХХ (пример на англ для node.js и express - https://scotch.io/tutorials/build-a-restful-api-us...