Yeorim Shim (Hayeon)'s profile

Landing page design and developing w/IC Mustache Loop


Challenge : To understand the logic of mustache, and to load Json object to my template.

How to achieve: First, I installed mustache node dependencies and created a JSON object. Then populated it with information about a set of 3 different contents. Loaded the JSON file using jQuery. Used the “sections” capabilities of Mustache to fill a ul element – (used an li element for each product item and display a title and description)​​​​​​​





Mobile Web Version - 


Coding - 
I created Mustache Template created with contents parts. Then applied Json array which includes all data for each sections(like title, description, and image paths) data using getElementById(), innerHTML, and render() method.




Desktop Web Version - 
Desktop Web

Thank you for your interest. Stay tuned for further progress!


Landing page design and developing w/IC Mustache Loop
Published:

Landing page design and developing w/IC Mustache Loop

Published: