How to use Javascript to auto-update the year of publication on your website

In this tutorial you will learn how to use Javascript to auto-update the year of publication on your website.

Sometimes I like to browse through different websites just to check out design trends and get some inspiration. From my general observation, it seems like the year of publication on most websites will be outdated for example you will notice Copyright 2017 in 2021 instead of Copyright 2021.

Now imagine you've many projects that you have built and you've to edit the code to update the year of publication on each website manually. It's a very tedious and time-consuming task which however, can easily be evaded by using Javascript. Since we're almost done with 2021, this short and simple tutorial will explain how Javascript can be implemented to automatically change the year of publication on any website whenever the year changes.

HTML

footer>
    <span>
        &copy;<time></time> Mywebsite. All rights reserved. 
    </span>
</footer>

Vanilla Javascript

const date = new Date()
const currentYear = date.getFullYear()
const time = document.querySelector('time')

time.setAttribute('datetime', date)
time.innerHTML = currentYear

React JS

Assuming that you already know how to create a new react-app using npx create-react-app example-app, let's dive right into the code.

export default function Footer(){
    return (
        <Copyright />
    )

    function Copyright(){
        const time = new Date()

        return (
            <footer>
                <span>
                    &copy;<time dateTime={time}> 
                    {time.getFullYear()}</time> Website. All 
                    rights reserved.
                </span>
            </footer>
        )
    }
}   

Voila! That's all you need to do and the year of publication on your projects will be auto updated by Javascript.