[{"data":1,"prerenderedAt":117},["ShallowReactive",2],{"project-\u002Fportfolio\u002Fwebsite\u002Ffnbg-ltd":3},{"id":4,"title":5,"archived":6,"body":7,"carousel":99,"category":100,"description":101,"displayOrder":102,"extension":103,"featured":6,"features":104,"fullImage":99,"image":107,"imageAlt":108,"meta":109,"mockup":110,"navigation":111,"path":112,"repo":99,"seo":113,"stem":114,"subhead":115,"url":17,"__hash__":116},"projects\u002Fportfolio\u002Fwebsite\u002Ffnbg-ltd.md","FNBG Ltd",false,{"type":8,"value":9,"toc":94},"minimark",[10,23,26,29,41,56,65,70,91],[11,12,13,14,22],"p",{},"This is a website for my Business, ",[15,16,21],"a",{"href":17,"rel":18,"target":20},"https:\u002F\u002Fwww.fnbg.co.uk",[19],"noopener","_blank","FNBG Business Telecoms",",\nand was what led me to my interest in web development.",[11,24,25],{},"As part of starting the business there are all sorts of things that you need to\nget set-up, and one of the most important, I felt, was a website.",[11,27,28],{},"My business site started its life as a Google Site which, as anyone who has used\nthe service will know, has severe limitations. The frustrations grew as the site,\nalthough functional, was far from easy on the eye. In addition to this, at a time\nwhen mobile and tablet browser use were on the rise, the site was a calamity.",[11,30,31,32,36,37,40],{},"I started to learn ",[33,34,35],"em",{},"HTML"," and ",[33,38,39],{},"CSS"," and proceeded to create my first static site.",[11,42,43,44,47,48,51,52,55],{},"Over the last couple of years I have implemented ",[33,45,46],{},"Twitter Bootstrap",", some ",[33,49,50],{},"PHP","\nincludes for ease of management \u002F maintenance, as well as a little ",[33,53,54],{},"AJAX"," for\nrequesting additional content while keeping the initial page size low and\nrequesting content from my (shamefully out-of-date) Blogger Site.",[11,57,58,59,64],{},"A later version of the site was built with a static site generator called\n",[15,60,63],{"href":61,"rel":62},"https:\u002F\u002Fmetalsmith.io\u002F",[19],"Metalsmith",", allowing me to\ncreate dynamically generated pages and use build tools such as SCSS, whilst getting\nthe speed and security benefits of a static website. I removed Bootstrap, wrote all\nthe CSS using flexbox and took my first steps into Progressive Web Apps (PWA).",[66,67,69],"h2",{"id":68},"the-current-site","The Current Site",[11,71,72,73,78,79,84,85,90],{},"The site has now been rebuilt with ",[15,74,77],{"href":75,"rel":76,"target":20},"https:\u002F\u002Fnuxt.com\u002F",[19],"Nuxt JS",",\nstyled with ",[15,80,83],{"href":81,"rel":82,"target":20},"https:\u002F\u002Ftailwindcss.com\u002F",[19],"Tailwind CSS","\nand powered by ",[15,86,89],{"href":87,"rel":88,"target":20},"https:\u002F\u002Fwww.datocms.com\u002F",[19],"DatoCMS",".",[11,92,93],{},"Moving the content into a headless CMS means pages can be updated without touching\nthe code, while Nuxt keeps the site fast and search-engine friendly. Tailwind\nreplaces the hand-written stylesheets with a utility-first approach that keeps the\nCSS small and the design consistent across every page.",{"title":95,"searchDepth":96,"depth":96,"links":97},"",2,[98],{"id":68,"depth":96,"text":69},null,"website","A Nuxt JS, Tailwind and DatoCMS website designed and developed for FNBG Business Telecoms in Edinburgh.",1,"md",[77,105,83,89,106],"Vue JS","Responsive Design","\u002Fimages\u002Fprojects\u002Fweb\u002Ffnbg.jpg","FNBG Ltd - Business Telecoms Website",{},"\u002Fimages\u002Fprojects\u002Fweb\u002Ffnbg-mockup.png",true,"\u002Fportfolio\u002Fwebsite\u002Ffnbg-ltd",{"title":5,"description":101},"portfolio\u002Fwebsite\u002Ffnbg-ltd","A Fast, CMS-Driven Business Website","uhTLqQpD-5LcSNRhKBV37rKSJYp_5xvETT-I6yfRbOo",1794397053154]