[{"data":1,"prerenderedAt":100},["ShallowReactive",2],{"site-info":3,"\u002Fwriting\u002Fhow-to-use-vue-js-environment-modes-with-a-node-js-mock-data-layer":55},{"id":4,"title":5,"baseTitle":6,"body":7,"city":14,"description":11,"extension":15,"firstName":16,"lastName":17,"meta":18,"navigation":19,"path":35,"resumeUrl":36,"role":37,"seo":38,"socialLinks":39,"state":52,"stem":53,"__hash__":54},"siteInfo\u002Fsite-information.md","Site Information","| Front-End Software Engineer | Cincinnati, OH",{"type":8,"value":9,"toc":10},"minimark",[],{"title":11,"searchDepth":12,"depth":12,"links":13},"",2,[],"Cincinnati","md","Dave","Berning",{},[20,23,26,29,32],{"name":21,"to":22},"About","\u002Fabout",{"name":24,"to":25},"Work","\u002Fwork",{"name":27,"to":28},"Writing","\u002Fwriting",{"name":30,"to":31},"Endorsements","\u002Fendorsements",{"name":33,"to":34},"Contact","\u002Fcontact","\u002Fsite-information","\u002Fresume","Front-End Software Engineer",{"description":11},[40,44,48],{"label":41,"href":42,"icon":43},"LinkedIn","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Fdavidberning\u002F","simple-icons:linkedin",{"label":45,"href":46,"icon":47},"GitHub","https:\u002F\u002Fgithub.com\u002Fdaveberning","simple-icons:github",{"label":49,"href":50,"icon":51},"Email","mailto:hello@daveberning.io","lucide:mail","OH","site-information","Riwsk3KNMBr9V9OmxgoWlnFymJ_mfMFTDiaiIADNjUo",{"id":56,"title":57,"body":58,"category":81,"description":82,"extension":15,"externalUrl":83,"featuredImage":84,"meta":85,"navigation":86,"path":87,"platform":88,"publishedAt":89,"readingTime":90,"seo":91,"status":92,"stem":93,"tags":94,"updatedAt":11,"__hash__":99},"writing\u002Fwriting\u002Fhow-to-use-vue-js-environment-modes-with-a-node-js-mock-data-layer.md","How To Use Vue.js Environment Modes with a Node.js Mock Data Layer",{"type":8,"value":59,"toc":79},[60,69,72],[61,62,63,64,68],"p",{},"This tutorial tackles a common frontend workflow problem: building a Vue.js interface before the real backend is ready. It shows how to use ",[65,66,67],"strong",{},"Vue environment modes"," to swap configurations cleanly and pair the app with a lightweight Node.js mock data layer during development.",[61,70,71],{},"The article walks through creating environment-specific modes, setting up mock data, iterating over that data inside the app, and using computed properties to load the right source per environment. That gives teams a practical way to keep moving on the frontend while API work is still in progress.",[61,73,74,75,78],{},"For developers interested in ",[65,76,77],{},"Vue environment variables, mock APIs, Node.js development tooling, and parallel frontend-backend workflows",", this guide offers a pragmatic pattern you can reuse.",{"title":11,"searchDepth":12,"depth":12,"links":80},[],"Tutorial","Learn how to use Vue environment modes with a Node.js mock API so frontend development can move faster before the real backend is ready.","https:\u002F\u002Fwww.digitalocean.com\u002Fcommunity\u002Ftutorials\u002Fhow-to-use-vue-js-environment-modes-with-a-node-js-mock-data-layer","\u002Fwriting\u002Fvuejs.webp",{},true,"\u002Fwriting\u002Fhow-to-use-vue-js-environment-modes-with-a-node-js-mock-data-layer","DigitalOcean","2021-02-11",6,{"title":57,"description":82},"published","writing\u002Fhow-to-use-vue-js-environment-modes-with-a-node-js-mock-data-layer",[95,96,97,98],"JavaScript","Vue","Node.js","Mock APIs","21-cO3lhlHnREteM4rEDtaPIdE_5V63uz2sCHt6rck8",1775364557128]