I'm using angular as my frontend to do a login panel and send a post request to the backend which is a express API. My domain has a SSL already, so the safety between the transfer should be good.
But I'm wondering when I open the devtool and check the request payload, the plaintext of the loginname and password is show up.
Do I need to encrypt the payload before sending post request to make it invisible? If needed, what library I can use for this?
No you do not need to encrypt the payload. SSL will do that for you. The payload would be secure between the client and the server.
Devtools can be only opened on the local instance of chrome client. Dev Tools only starts capturing data when it is open and if a request is made. Cannot be used in man-in-the-middle attack.
With the exception of TLS/SSL. You cannot perform secure encryption of payloads on a client, only on a server. Instead you rely on encoding data on the client and then on the server you check to verify the encoded data has not been changed in flight. Take a look at JWTs “json web tokens” for authflows between client and server.