[{"data":1,"prerenderedAt":83},["ShallowReactive",2],{"project-\u002Fportfolio\u002Fecommerce\u002Fgranite-setts-direct":3},{"id":4,"title":5,"body":6,"carousel":61,"category":62,"description":63,"displayOrder":64,"extension":65,"featured":66,"features":67,"fullImage":61,"image":74,"imageAlt":75,"meta":76,"mockup":77,"navigation":66,"path":78,"repo":61,"seo":79,"stem":80,"subhead":81,"url":21,"__hash__":82},"projects\u002Fportfolio\u002Fecommerce\u002Fgranite-setts-direct.md","Granite Setts Direct",{"type":7,"value":8,"toc":56},"minimark",[9,14,26,29,44,53],[10,11,13],"h2",{"id":12},"server-side-rendered-headless-e-commerce-application","Server-side Rendered Headless E-Commerce Application",[15,16,17,18,25],"p",{},"I was approached by Granite Setts Direct Ltd to develop an e-commerce website to\nsell ",[19,20,24],"a",{"href":21,"rel":22},"https:\u002F\u002Fwww.granitesettsdirect.co.uk",[23],"nofollow","granite setts in the UK",".",[15,27,28],{},"On review of their competitors websites, we felt that there was a real opportunity\nto make the online buying process faster and more enjoyable for the customer. Traditional\ne-commerce platforms felt slow and cumbersome to navigate so the aim was to create a\nfast and straight forward and uncluttered user experience.",[15,30,31,32,37,38,43],{},"After our initial discussions with the client we agreed that we would use Vue to create\nthe UI and the ",[19,33,36],{"href":34,"rel":35},"https:\u002F\u002Fnuxtjs.org\u002F",[23],"Nuxt JS"," framework to take advantage of server-side rendering. In order to\nintegrate the e-commerce functionality without the weight of a full blown E-Commerce\nframework, we integrated the ",[19,39,42],{"href":40,"rel":41},"https:\u002F\u002Fwww.elasticpath.com\u002F",[23],"ElasticPath"," headless E-Commerce API which made the overall site very\nlight-weight, fast and responsive. This also allowed us to take full control of the\nflow of the buying process.",[15,45,46,47,52],{},"Alongside the shop, the site's pages and blog are managed in\n",[19,48,51],{"href":49,"rel":50},"https:\u002F\u002Fprismic.io\u002F",[23],"Prismic",", a headless CMS, so the team can keep content up to\ndate and publish new articles without needing a developer.",[15,54,55],{},"To design the site I worked closely with the client to create a clean, uncomplicated\nvisual experience to allow to customer to focus on the product itself.",{"title":57,"searchDepth":58,"depth":58,"links":59},"",2,[60],{"id":12,"depth":58,"text":13},null,"ecommerce","A headless ecommerce website application designed and developed for Granite Setts Direct Ltd using a headless E-Commerce API",1,"md",true,[68,69,70,36,42,71,72,73],"HTML5","Tailwind CSS","Vue JS","Netlify","Prismic CMS","Ecommerce","\u002Fimages\u002Fprojects\u002Fweb-application\u002Fgranite-setts-direct.jpg","Granite Setts Direct - Headless Ecommerce Website",{},"\u002Fimages\u002Fprojects\u002Fweb-application\u002Fgranite-setts-direct-mockup.png","\u002Fportfolio\u002Fecommerce\u002Fgranite-setts-direct",{"title":5,"description":63},"portfolio\u002Fecommerce\u002Fgranite-setts-direct","E-Commerce Website","s2eDnobRISNOKshMvge6yZB4mAZdsh7NLCJdOGv4ZQw",1794324750618]