Setting up the sign up/ log in forms
  • Setting up your local server
  • Creating the login form
  • Creating the register form
Handling the user's submitted data
  • Intro to PHP - Handling form submission
  • Form sanitation - Cleaning the input
  • Separating our code
  • Preparing our validation functions
  • Creating the Account class
  • Validating the username
  • Validating the name and emails
  • Validating the passwords
  • Checking if the sign up was successful
  • Outputting error messages
  • Creating our Constants class
  • Remembering form values
Completing the sign up / log in process
  • Creating the users table
  • Connecting to our database from PHP
  • Inserting user details
  • Testing out the sign up process!
  • Query not working? Watch this video
  • Last remaining validation checks
  • Login handler
  • Sessions
Styling the registration page
  • Adding a background image
  • Styling the login container
  • Styling our text boxes
  • Input placeholder color
  • Styling the submit buttons
  • Buttons to switch between forms
  • Showing and hiding the forms on press
  • Showing only the relevant form when data is submitted
  • Show/hide button - mouse pointer
  • Right section content
  • Applying style to the right section content
  • 56,800+ icons FOR FREE - Icons8
  • Styling the error messages
  • Remembering the username after failed log in attempt
Creating the now playing bar
  • Quick overview of the index page
  • Now playing bar container
  • Creating the now playing bar element
  • Left, center and middle sections of the bar
  • All the icons for our site
  • Adding our player buttons
  • Making the play and pause buttons larger
  • Progress bar parent elements
  • The progress bar
  • Album artwork
  • Track info labels
  • Volume bar
Navigation menu
  • Page containers
  • Creating our navigation bar container
  • Navigation bar site logo
  • Navigation items
  • Navigation search icon
  • Navigation links color change on hover
Tables and data
  • Overview of our MySQL table structure
  • Creating our database tables
  • Inserting data into the artists, genres and albums tables
  • Inserting data into the songs table + FREE music files
  • Shortcut to inserting data into the songs table
'Music you might like' page
  • Organisational trick
  • Main view containers
  • Header and footer files
  • Getting albums from the database
  • Outputting the album artwork images
  • Styling the album artwork images
  • Styling the album title
  • Making the albums clickable links
Album page
  • Getting album id from url
  • Getting the artist of the album
  • Creating the Artist class
  • Creating the Album class
  • Album header section
  • Styling the header section
  • Displaying the number of songs in the album
  • Creating the Song class
  • Getting the songs on an album
  • Outputting the track count
  • Outputting the track name and artist name
  • Outputting the track duration
  • Styling the track list rows
  • Styling the track count
  • Track style finishing touches
The music player
  • Introduction to HTML5 Audio
  • Creating our initial playlist of 10 random songs
  • Including JQuery
  • Set track function setup
  • Set track function
  • Playing and pausing the song via buttons
  • Introduction to Ajax calls