Create brand-new re-designed site without affecting live site?

I've been teaching myself web development and was given the chance to completely re-design a company website. The site itself is managed on WordPress which I have no experience in. So I would like to use this as a good opportunity to further develop my skills and learn more about CMS in general.

The website is fairly oldskool and basic with minimal content and functionality. As far as I'm aware, it also doesn't use a database. So I believe it can benefit from being revamped into a modern responsive layout. I already made a mock one-page scrollable site that uses a Slider library (pageable) on my local machine.

From what I've researched so far, a one way would be to create a staging site to play around with. However, this method seems to be most common with only minor changes to a site.

To clarify, I'm still very new to WordPress and unsure how to approach this, so I'd like to formulate solid plan before starting.

What would be the best method to creating a new 'development' site where I can start fresh with a blank site without compromising the live site?