How can I handle async data fetching errors in a vanilla JS app to ensure smooth interop with different APIs?

<!-- BEGIN COPY / PASTE -->
        async function fetchData(url) {
            try {
                const response = await fetch(url);
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                const data = await response.json();
                return data;
            } catch (error) {
                console.error('Fetch error:', error);
                return null; // or handle the error as needed
            }
        }

        // Example usage
        fetchData('https://api.example.com/data')
            .then(data => {
                if (data) {
                    console.log('Data fetched successfully:', data);
                } else {
                    console.log('No data returned');
                }
            });
        <!-- END COPY / PASTE -->