minusmo / My-Music-DB

A single page application introducing My favorite musics

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

About This Project

A Single Page Application Introducing My favorite musics. I really love musics and also love to make my own favorite music DB. I think it will be great to introduce my favorite musics to my friends in the world and share my fantastic experience with the musics. It doesn't have a living backend for serving my favorite music data. But in the future, I will make a server for this. Of course, my music DB will be updated whenever I find new great music.

Built with

  • HTML5
  • CSS3
  • Javascript(ES6)
  • Web Components(custom elements)

Tested with

  • Mocha.js
  • Chai.js

Usage

Here's what you can do with this application

  • See details about each music album(ready)
  • Search a music(not yet)
  • Sort musics By few options(ready)
  • Filter musics By few options(not yet)

To-Do

  • Add Search Interface
  • Add Sort Interface
  • Add Filter Interface
  • Fix Responsive Design
  • Add Favicon
  • Update Browser Tests

Site Performance

It is measured by lighthouse in Google Chrome Devtools

Before Improvement

Desktop Performance Before Desktop Mobile Performance Before Mobile

After Improvement

Desktop Performance After Desktop Mobile Performance After Mobile

How was it improved

Site Performance is improved by using webpack. I bundled the JS modules and minimized the JS code to main.js in dist directory. But still needs to be improved for mobile Devices.

Contact

About

A single page application introducing My favorite musics


Languages

Language:JavaScript 76.3%Language:CSS 13.2%Language:HTML 10.5%