Update contents of a div element with animation styling

Question

I'm building a personal portfolio webpage with React and I'm trying to update the content of the div element but when the elements are updated, I want to involve styling, (like the old content to exit on the left and the new content to enter from the left) Sorry for my bad English. This is the part I'm trying to update and add styling

I've tried to use the componentDidMount method with a function that changes the heading but I don't know how to add animations/styling...

export default class Home extends Component {
skills_section_update = () => {
    let heading = document.getElementById('heading');

    const headings = [
        {
            head: 'Web Development'
        },
        {
            head: 'Game Development'
        }
    ];
    const update_head = (index) => {
        heading.innerText = headings[index].head;
    };
    update_head(1);
}
componentDidMount = () => {
    setInterval(this.skills_section_update, 2000);
};

I'm new to React so any help would be much appreciated. :)