Automatically update PHP application Badge Counter without page refresh

I am in need of assistance with my current PHP badge counter, a task which requires the counter to update automatically when new records are detected in my notification table. I want the counter to reflect unread messages from notification table for the logged in username.

Here's the script for the table.

CREATE TABLE `notifications` (
`id` int(11) NOT NULL,
`title` varchar(250) NOT NULL,
`message` text NOT NULL,
`is_read` int(11) DEFAULT 0,
`publish_date` timestamp NOT NULL DEFAULT current_timestamp() ON UPDATE current_timestamp(),
`username` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

ALTER TABLE `notifications`
ADD PRIMARY KEY (`id`);

ALTER TABLE `notifications`
MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;


Expectation:
- Single Page with script to test
- Use sample table for data needed to test.

To make sure the system doesn't focus on irrelevant data, the counter should exclude any read messages and strictly display only unread ones.

To succeed in this task, a deep understanding of PHP and real-time updates is paramount as well as a good grasp of database handling. Experience with managing and working with notification systems is a plus.

My application is build with PHP 8.2, Bootstrap 4.x
However, we can upgrade to Boostrap 5 if needed.