Thursday, 11 May 2017

Generating HTML based on a JSON file

I'm making a nodejs based web app that you can upload and play music from, so far I have it so you can upload the songs and the title and artist information, as well as the filename is stored in a json file. What I am wanting to do is to basically go through the json file, and for each object create a unordered list item that gets put on my index.html. Here is an example of what the JSON looks like:

    {
    "filename": "The Weeknd - Starboy (Lyric) ft. Daft Punk.mp3",
    "title": "Star Boy",
    "artist": "The Weeknd"
    }

On my html page I have an empty unordered list

    <div id="song-area">
      <ul id="playlist">

      </ul>
    </div>

Which is what I'm wanting to populate with the songs so that they can be clicked and played. Does anyone have any suggestions on how I could go about achieving this?



via pittcrew