title: Displaying error message from backend to the end user in the front end
body: <p>I have a general design based question regarding displaying error message from then backend to the end user in the front end. Not sure where to look for this.
  So the error response would be something like this</p>
  
  <pre><code>Error Status: 400 (Bad Request)
  {
      value: "+++",
      errorMessage: value "+++" fails to match alpha numeric pattern
  
  }
  </code></pre>
  
  <p>Now in the front end I don't want to show message directly from the backend. Since it could be of technical nature 
  (I would log that error message from the backend). I want to display a better user friendly message something like.</p>
  
  <pre><code>"Invalid entry '+++' Numbers and texts are only allowed."
  </code></pre>
  
  <p>My question is how to go about this. One method I could think of is to return errorType in the response. 
  I will then check the error type in the front end, and then display message from the front end accordingly.
  So my response from the backend would be something like this,</p>
  
  <pre><code>Error Status: 400 (Bad Request)
  {
      value: "+++",
      errorMessage: value "++++" fails to match alpha numeric pattern
      errorType: INVALID_PATTERN
  }
  </code></pre>
  
  <p>In the front end I would have some ENUM like</p>
  
  <pre><code>ERROR_TYPES: [
  {
      INVALID_PATTERN: "Invalid entry &lt;variable&gt; Numbers and texts are only allowed."
  }]
  </code></pre>
  
  <p>Is this a good approach? What is a best practice for something like this?</p>
  
  <p>If you could provide some references that I could dig deeper into, would be much appreciated.</p>
  
  <p>P.S. I am using the MEAN stack
  Thanks</p>