All the required tools are free to download, I will be using the following:
Visual Studio Code Text Editor: https://code.visualstudio.com
Chrome Web Browser: https://www.google.co.uk/chrome/browser
We begin by creating the user interface with HTML. The we apply styling using CSS.
You will learn things such as:
- Creating HTML interfaces
- Styling with CSS
- Const and let
- ES6 Arrow Functions
- Event handlers
- Manipulating the DOM
- Performing calculations and storing in variables
- Looping through arrays
- HTML5 Audio Player default and custom settings
- How to create custom elements to control the audio element
- Setting the audio source dynamically
- Checking the readyState of the audio player
- Getting the value of slider inputs
- Calculating the value of the HTML progress element
- Basic debugging
- Including Fontawesome icons
- And much more!
So if you are looking to move on and put your skills into practice using with real projects, take this course now!
Hello, My name is Chris and I am a web developer and online teacher. I am passionate about what I do and about teaching others. I have started various online and offline businesses.
Whatever your reason for learning to build websites you have made an excellent career choice.
My personal motivation was to become my own boss and have more freedom and flexibility in my life. I also enjoy the technical challenge it provides and the way it constantly evolves. I built my first website back in 1999 and i have watched the web evolve into what it is today.
I try to make my courses enjoyable and try to remember what it was like when I was learning. I also believe the best way to learn is by doing and try to include as many practical examples as possible in my courses.
Thanks for taking an interest and I look forward to you joining me.
StartFinding songs to use in our app (1:35)
StartCreating the HTML structure (6:56)
StartAdding controls and icons (6:08)
StartStyling with CSS (7:00)
StartPlaying songs when clicked (5:27)
StartDisplay currently playing song (3:32)
StartPlay and pause controls (2:50)
StartThe volume slider (3:48)
StartUpdating the progress bar (7:01)
StartThank you (0:58)
StartKeep on learning