Login system and user credentials

I’m building a React app that requires users authentication (just to be logged in) to access some of the resources. I’d like to persist the user credentials with the secure & HttpOnly cookies. And there is my question: Is it a good idea to make the “is the user logged in” checking on client side (for e.g. by just by examining the document.cookie for login/password cookie) to speed up the app by not engaging the server site just to check if the cookies was set?

To be honest I don’t understand your question.

The data (resources) which should only be visible to logged in users comes from the backend. So the backend needs to know if the user is logged in anyway. How will you check that only in the frontend (Even if this is never a good idea)

I’m not so sure if the backhand really have to know if the user is logged in - i can check on client side if there is a login cookies at all. If there isn’t - just render the login form but when the cookies are set then use the backhand call to check if the data from cookies is valid and if so response with protected content. All I’d like to is to release the server from doing such obvious task like just cheeking if the cookies are set.

It’s not just about checking that a cookie is set, it’s also about the value of the cookie. It should not be possible to just create any random cookie and have the system see me as logged in.

In order to do that you need to store some information in a database, which the frontend itself cannot do. Sure there are things like IndexDB and such, but those can be directly tampered with by the user and as such must not be used for authentication purposes.

Again,

Where do you get the protected content from? The data must be anywhere on the server. So if it’s possible to get this protected site content from the server bei just calling n URL and the server is providing the data it is not protected data.

You cannot load all data (even protected data) and only show the not protected one if the user is not logged in. Everything which is coming to the browser can be seen by the user even if it is not in the browsers window.

Did you ever used the browsers developer tools?