Best practices for handling asynchronous API calls and loading states in vanilla JavaScript?

Hi everyone,

I am currently working on fetching data from an external API and rendering it dynamically, but I want to ensure my UI handles loading states and potential network errors smoothly without blocking the main thread.

What are the cleanest patterns or async/await structures you recommend for managing clean error handling and loading indicators in vanilla JavaScript projects?

Any examples or best practices would be really helpful. Thanks!