[{"data":1,"prerenderedAt":880},["ShallowReactive",2],{"nav-pages":3,"footer-socials":160,"page-projects\u002F":183,"$wAqIHDRXVI":204},[4,127],{"id":5,"title":6,"body":7,"crumbs":115,"description":119,"extension":120,"icon":117,"meta":121,"navigation":122,"path":123,"seo":124,"stem":125,"__hash__":126},"pages\u002Fpages\u002F1.index.md","Home",{"type":8,"value":9,"toc":109},"minimark",[10,15,19,24,27,61,64,96,99,103],[11,12,14],"h1",{"id":13},"my-portfolio","My Portfolio",[16,17,18],"p",{},"Hi there, welcome to my portfolio website.",[20,21,23],"h2",{"id":22},"who-am-i","Who am I?",[16,25,26],{},"I'm George, a software engineer with an interest in self-hosting, programming, and hardware.",[16,28,29,30,37,38,43,44,49,50,55,56,60],{},"I studied BSC Computer Science at ",[31,32,36],"a",{"href":33,"rel":34},"https:\u002F\u002Fwww.cardiff.ac.uk\u002F",[35],"nofollow","Cardiff University",", the projects I did during my time there can be found on my ",[31,39,42],{"href":40,"rel":41},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger?tab=repositories",[35],"Forgejo"," or ",[31,45,48],{"href":46,"rel":47},"https:\u002F\u002Fgithub.com\u002Frandomman552",[35],"GitHub"," though I have migrated most of these to my self-hosted Forgejo instance. For my dissertation I created a website to show sensor information in Cardiff University's new Abacws building, which you can see the code for ",[31,51,54],{"href":52,"rel":53},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger\u002FAbacws-Data-Vis",[35],"here"," or my deployment of ",[31,57,54],{"href":58,"rel":59},"https:\u002F\u002Fabacws.ggrainger.uk\u002F",[35],".",[16,62,63],{},"In my spare time I maintain a Linux server in my house, on which I self-host a couple of things including:",[65,66,67,76,88],"ul",{},[68,69,70,71],"li",{},"My own personal cloud storage using ",[31,72,75],{"href":73,"rel":74},"https:\u002F\u002Fnextcloud.com\u002F",[35],"NextCloud",[68,77,78,79,83,84],{},"My ",[31,80,82],{"href":40,"rel":81},[35],"code"," using ",[31,85,42],{"href":86,"rel":87},"https:\u002F\u002Fforgejo.org\u002F",[35],[68,89,90,95],{},[31,91,94],{"href":92,"rel":93},"https:\u002F\u002Fheadscale.net\u002Fstable\u002F",[35],"HeadScale"," for easy, self-hosted VPN access",[16,97,98],{},"In my spare time, I also write some code for Arduino's here and there, the connection between software and hardware is always fun to play with. I work for a company based in North Yorkshire that makes robotic automation systems, so I've got to work with some really cool hardware.",[20,100,102],{"id":101},"what-is-this-site-for","What is this site for?",[16,104,105,106,60],{},"I wanted a place to write about interesting projects I've worked on, here it is. You can check them out ",[31,107,54],{"href":108},"\u002Fprojects",{"title":110,"searchDepth":111,"depth":111,"links":112},"",2,[113,114],{"id":22,"depth":111,"text":23},{"id":101,"depth":111,"text":102},[116],{"name":6,"icon":117,"href":118},"material-symbols:home-rounded","\u002F","Welcome to George's portfolio website","md",{},true,"\u002Fpages",{"title":6,"description":119},"pages\u002F1.index","iJZaQtML6AUZWO7oOxOQo8ckoA7ZFdLQwhAci4MVMik",{"id":128,"title":129,"body":130,"crumbs":150,"description":154,"extension":120,"icon":153,"meta":155,"navigation":122,"path":156,"seo":157,"stem":158,"__hash__":159},"pages\u002Fpages\u002F2.projects.md","Projects",{"type":8,"value":131,"toc":148},[132,135,138,145],[11,133,129],{"id":134},"projects",[16,136,137],{},"My recent projects can be found below.",[16,139,140,141,144],{},"Can't find anything that interests you? Check out my ",[31,142,42],{"href":40,"rel":143},[35]," for some other things I've made that didn't make the cut (or that I haven't finished).",[146,147],"card-project-grid",{},{"title":110,"searchDepth":111,"depth":111,"links":149},[],[151,152],{"name":6,"icon":117,"href":118},{"name":129,"icon":153,"href":108},"material-symbols:deployed-code","View my projects here",{},"\u002Fpages\u002Fprojects",{"title":129,"description":154},"pages\u002F2.projects","ZvgQ8iafkO8Vo_2oMkyd_n-BCCp-tAooB16GjR_rLf4",[161,169,175],{"id":162,"extension":163,"icon":164,"link":165,"meta":166,"name":42,"stem":167,"__hash__":168},"socials\u002Fsocials\u002Fforgejo.yml","yml","devicon-plain:forgejo","https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger",{},"socials\u002Fforgejo","eLo2tedWGBfxJY_VmYmV0uFkIDhRuQvm4fmj_5QD7f0",{"id":170,"extension":163,"icon":171,"link":46,"meta":172,"name":48,"stem":173,"__hash__":174},"socials\u002Fsocials\u002Fgithub.yml","mdi:github-box",{},"socials\u002Fgithub","umA4vGSgNhkainXfqvtesFnwEcchjMuYOaVvJl409do",{"id":176,"extension":163,"icon":177,"link":178,"meta":179,"name":180,"stem":181,"__hash__":182},"socials\u002Fsocials\u002Flinkedin.yml","mdi:linkedin","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Fgeorge-grainger552\u002F",{},"LinkedIn","socials\u002Flinkedin","bTHOxI-WAMN6H2Ub1ipKl89w3nM34aSFOrB4ziV6Nhc",{"id":128,"title":129,"body":184,"crumbs":199,"description":154,"extension":120,"icon":153,"meta":202,"navigation":122,"path":156,"seo":203,"stem":158,"__hash__":159},{"type":8,"value":185,"toc":197},[186,188,190,195],[11,187,129],{"id":134},[16,189,137],{},[16,191,140,192,144],{},[31,193,42],{"href":40,"rel":194},[35],[146,196],{},{"title":110,"searchDepth":111,"depth":111,"links":198},[],[200,201],{"name":6,"icon":117,"href":118},{"name":129,"icon":153,"href":108},{},{"title":129,"description":154},[205,389],{"id":206,"title":207,"body":208,"coverImage":379,"description":380,"extension":120,"liveDemo":219,"meta":381,"navigation":122,"ogImage":382,"path":383,"publishedAt":384,"seo":385,"sourceCode":386,"stem":387,"__hash__":388},"projects\u002Fprojects\u002Fboids.md","Boids Simulation",{"type":8,"value":209,"toc":370},[210,214,221,226,230,238,242,245,248,275,278,286,289,293,300,309,313,316,319,323,326,360,364,367],[20,211,213],{"id":212},"demo","Demo",[16,215,216,217,60],{},"A video demonstration of the simulation in action can be seen below. To try it out yourself, click ",[31,218,54],{"href":219,"rel":220},"https:\u002F\u002Fggrainger.epicpages.dev\u002Flibgdx-boids\u002F",[35],[222,223],"prose-video",{"alt":224,"src":225},"Video of the simulation in action.","\u002Fvideos\u002Fprojects\u002Fboids\u002Fdemo.mp4",[20,227,229],{"id":228},"project-goals","Project Goals",[16,231,232,233,60],{},"In this project, I produced a Boids simulation using the libGDX framework.\nThis project was inspired by a similar project developed by Sebastian Lague, which can be found on ",[31,234,237],{"href":235,"rel":236},"https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=bqtqltqcQhw",[35],"YouTube",[20,239,241],{"id":240},"what-are-boids","What are Boids?",[16,243,244],{},"Boids are an algorithmic approach to simulation of flocking behaviour such as that found in flocks of birds or schools of fish.",[16,246,247],{},"They achieve this by following a series of simple rules which are defined in the report above\nand are as follows:",[249,250,251,259,267],"ol",{},[68,252,253,254],{},"Collision Avoidance\n",[65,255,256],{},[68,257,258],{},"Avoid collisions with nearby flock mates.",[68,260,261,262],{},"Velocity Matching\n",[65,263,264],{},[68,265,266],{},"Attempt to match velocity with nearby flock mates.",[68,268,269,270],{},"Flock Centering\n",[65,271,272],{},[68,273,274],{},"Attempt to stay close to nearby flock mates.",[16,276,277],{},"These are in order of decreasing precedence,\nmeaning that Collision Avoidance is the most important, and Flock Centering is the least important.",[16,279,280,281,60],{},"The Boids algorithm was originally developed by Craig Reynolds in 1986, for more information see this Wikipedia ",[31,282,285],{"href":283,"rel":284},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FBoids",[35],"article",[16,287,288],{},"In addition to the basic Boids algorithm, this simulation also implements a simple obstacle avoidance system using raycasting to detect and avoid obstacles.",[20,290,292],{"id":291},"libgdx","libGDX",[16,294,295,299],{},[31,296,292],{"href":297,"rel":298},"https:\u002F\u002Flibgdx.com\u002F",[35]," is a cross-platform Java game development framework that works cross platform on Windows, Linux, macOS, Android, iOS, and browsers.\nUnlike game engines such as Unity, libGDX is only a framework. It doesn't enforce much in the way of structure, instead expecting you to build out your solution as you see fit.\nIt handles rendering, input, audio, and includes Box2D for physics.",[16,301,302,303,308],{},"I used libGDX on a ",[31,304,307],{"href":305,"rel":306},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger\u002Fcm2305-group-11",[35],"previous group project"," at university and was familiar with it at the time I made this project, which made it the obvious choice.",[20,310,312],{"id":311},"spatial-partitioning","Spatial partitioning",[16,314,315],{},"To improve performance of this boid implementation, we make use of spatial partitioning.\nThis prevents us from having to loop over every other boid, per boid, for each frame.\nInstead, each boid may simply loop over it's list of neighbours for force calculations.",[16,317,318],{},"This implementation uses the underlying Box2D physics engine with sensor fixtures so that boids can only \"perceive\" other boids that are within a certain radius of them.",[20,320,322],{"id":321},"configuration","Configuration",[16,324,325],{},"The simulation can be dynamically configured using a series of tools built into the simulation UI, the following tools are available:",[65,327,328,336,344,352],{},[68,329,330,331],{},"Force Configuration\n",[65,332,333],{},[68,334,335],{},"Configure the scalar for each of the three boid rules\u002Fforces.",[68,337,338,339],{},"Debug Overlay\n",[65,340,341],{},[68,342,343],{},"Includes overlays to view the underlying physics engine, and forces acting on each boid.",[68,345,346,347],{},"Boid Spawner\n",[65,348,349],{},[68,350,351],{},"Create and remove boids from the simulation.",[68,353,354,355],{},"Obstacle Spawner\n",[65,356,357],{},[68,358,359],{},"Create and remove obstacles from the simulation.",[20,361,363],{"id":362},"results","Results",[16,365,366],{},"The simulation works well for a few hundred boids, but performance with large number of boids could be improved.\nThere are a couple of ways to improve performance.\nWe could offload the boid calculations to separate threads, or even create a GPU compute shader to handle the calculations for us (which would be significantly faster).",[16,368,369],{},"LibGDX is a great framework, but it's not as widely used as more popular game engines.\nIn a future project, I would like to explore using other engines such as Unity, Unreal, or Godot to see what I'm missing.",{"title":110,"searchDepth":111,"depth":111,"links":371},[372,373,374,375,376,377,378],{"id":212,"depth":111,"text":213},{"id":228,"depth":111,"text":229},{"id":240,"depth":111,"text":241},{"id":291,"depth":111,"text":292},{"id":311,"depth":111,"text":312},{"id":321,"depth":111,"text":322},{"id":362,"depth":111,"text":363},"\u002Fimages\u002Fprojects\u002Fboids\u002Fcover.png","Implementing a Boids simulation to model flocking behavior using LibGDX.",{},null,"\u002Fprojects\u002Fboids","2026-08-02 15:56:00",{"title":207,"description":380},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger\u002Flibgdx-boids","projects\u002Fboids","h74L8CFRmKaWv4k0auVJPPEk3FRYXnbGSLmypdd6jl4",{"id":390,"title":391,"body":392,"coverImage":871,"description":872,"extension":120,"liveDemo":382,"meta":873,"navigation":122,"ogImage":382,"path":874,"publishedAt":875,"seo":876,"sourceCode":877,"stem":878,"__hash__":879},"projects\u002Fprojects\u002Fportfolio-website.md","Portfolio Website",{"type":8,"value":393,"toc":859},[394,396,399,402,416,420,435,438,553,557,562,575,578,629,636,645,650,690,700,704,707,710,749,753,762,771,791,795,802,810,841,844,848],[20,395,229],{"id":228},[16,397,398],{},"In this project, I aimed to create a simple portfolio website (this one) for me to showcase my work.",[16,400,401],{},"I had a few requirements in mind for this:",[65,403,404,407,410,413],{},[68,405,406],{},"Minimalistic and responsive design",[68,408,409],{},"Statically hosted",[68,411,412],{},"Simple styling",[68,414,415],{},"Dark mode (the most important feature)",[20,417,419],{"id":418},"architecture","Architecture",[16,421,422,423,428,429,434],{},"To start with, I needed to decide what I was going to use to build the site.\nI've worked with ",[31,424,427],{"href":425,"rel":426},"https:\u002F\u002Fnuxt.com\u002F",[35],"Nuxt.js"," and used ",[31,430,433],{"href":431,"rel":432},"https:\u002F\u002Fstrapi.io\u002F",[35],"Strapi"," as a backend CMS for a previous project,\nbut I found Strapi to be a heavy and unwieldy product that doesn't do anything particularly hard.\nAs I'm going to be the only person making edits to the site, I can use something that requires more technical knowledge and is simpler.",[16,436,437],{},"I decided on:",[65,439,440,452,471,490,514,527,540],{},[68,441,442,446,447],{},[31,443,445],{"href":425,"rel":444},[35],"Nuxt"," for the framework.\n",[65,448,449],{},[68,450,451],{},"Full stack framework for building SSR and SSG applications.",[68,453,454,459,460],{},[31,455,458],{"href":456,"rel":457},"https:\u002F\u002Fcontent.nuxt.com\u002F",[35],"Nuxt Content"," for content management.\n",[65,461,462,465,468],{},[68,463,464],{},"Much simpler than Strapi (opinion warning).",[68,466,467],{},"Git based CMS, data is stored alongside code.",[68,469,470],{},"Markdown based.",[68,472,473,478,479],{},[31,474,477],{"href":475,"rel":476},"https:\u002F\u002Fnuxtseo.com\u002F",[35],"Nuxt SEO"," for SEO utilities.\n",[65,480,481,484,487],{},[68,482,483],{},"Automatically generates OG images for link previews.",[68,485,486],{},"Automatically handles sitemap generation.",[68,488,489],{},"Automatically handles robots.txt generation.",[68,491,492,497,498],{},[31,493,496],{"href":494,"rel":495},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Ficon",[35],"Nuxt Icon"," for icons.\n",[65,499,500],{},[68,501,502,503,508,509,60],{},"Large ",[31,504,507],{"href":505,"rel":506},"https:\u002F\u002Ficones.js.org\u002F",[35],"library"," of icons from ",[31,510,513],{"href":511,"rel":512},"https:\u002F\u002Ficonify.design\u002F",[35],"Iconify",[68,515,516,521,522],{},[31,517,520],{"href":518,"rel":519},"https:\u002F\u002Fimage.nuxt.com\u002F",[35],"Nuxt Image"," for image optimization.\n",[65,523,524],{},[68,525,526],{},"Optimizes images and generates srcsets.",[68,528,529,534,535],{},[31,530,533],{"href":531,"rel":532},"https:\u002F\u002Ftailwindcss.com\u002F",[35],"TailwindCSS"," for styling.\n",[65,536,537],{},[68,538,539],{},"Utility based CSS framework.",[68,541,542,547,548],{},[31,543,546],{"href":544,"rel":545},"https:\u002F\u002Fpages.cloudflare.com\u002F",[35],"Cloudflare Pages"," for hosting.\n",[65,549,550],{},[68,551,552],{},"Free hosting for static sites, with a global CDN.",[20,554,556],{"id":555},"project-structure","Project Structure",[558,559,561],"h3",{"id":560},"styling","Styling",[16,563,564,565,570,571,574],{},"Styling is done using TailwindCSS, tailwind provides a series of extensible utility classes that can be applied to elements to style them.\nThis differs from a more traditional CSS framework like ",[31,566,569],{"href":567,"rel":568},"https:\u002F\u002Fgetbootstrap.com\u002F",[35],"Bootstrap",", which takes a component based approach.\nIn a component based framework, you style elements using a component class such as ",[82,572,573],{},"btn"," which then styles that component like a button.\nWith a utility based framework, you compose utility classes together to style an element.",[16,576,577],{},"Both approaches have their pros and cons.",[65,579,580,604],{},[68,581,582,583],{},"Component based:\n",[65,584,585,596],{},[68,586,587,588],{},"Pros:\n",[65,589,590,593],{},[68,591,592],{},"Simple to use, just add a class to an element.",[68,594,595],{},"Easy to understand how an element will look.",[68,597,598,599],{},"Cons:\n",[65,600,601],{},[68,602,603],{},"Limited styling options, you are limited to the components provided by the framework.",[68,605,606,607],{},"Utility based:\n",[65,608,609,619],{},[68,610,587,611],{},[65,612,613,616],{},[68,614,615],{},"More flexible.",[68,617,618],{},"Can compose utility classes together to create any style you want.",[68,620,598,621],{},[65,622,623,626],{},[68,624,625],{},"Long class names on elements.",[68,627,628],{},"Harder to figure out exactly how an element will appear.",[16,630,631,632,635],{},"I find the drawbacks of the utility based approach can be mitigated by taking a component based approach to building the site.\nE.g. you can build an ",[82,633,634],{},"XButton"," component that uses utility classes for styling, but as it is encapsulated into a component it is easy to re-use across an application.",[16,637,638,639,644],{},"I designed a few components using tailwind to re-use throughout the site, this can be found on the ",[31,640,643],{"href":641,"title":642},"\u002Fdev","SUPER SECRET PAGE","dev"," pages deployed with this site.",[646,647,649],"h4",{"id":648},"dark-mode","Dark Mode",[16,651,652,653,656,657,661,662,667,668,673,674,677,678,680,681,684,685,60],{},"Dark mode is natively supported by TailwindCSS, and can be enabled by simply adding a ",[82,654,655],{},"dark"," (with some ",[31,658,321],{"href":659,"rel":660},"https:\u002F\u002Ftailwindcss.com\u002Fdocs\u002Fdark-mode#toggling-dark-mode-manually",[35],") class to the body of the page.\nI used the library ",[31,663,666],{"href":664,"rel":665},"https:\u002F\u002Fvueuse.org\u002F",[35],"vueuse"," to check the user's preferred color scheme and allow switching between light and dark mode.\nThey have a handy ",[31,669,672],{"href":670,"rel":671},"https:\u002F\u002Fvueuse.org\u002Fcore\u002FuseColorMode\u002F",[35],"utility"," called ",[82,675,676],{},"useColorMode"," that handles this for you using local storage and media queries.\nYou just need to handle the addition and removal of the ",[82,679,655],{}," class on the body yourself, which I handled with a ",[82,682,683],{},"DarkModeSwitch"," ",[31,686,689],{"href":687,"rel":688},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger\u002FWebsite\u002Fsrc\u002Fbranch\u002Fmaster\u002Fapp\u002Fcomponents\u002FDarkModeSwitch.vue",[35],"component",[16,691,692,693,696,697,699],{},"You can do this yourself instead of relying on an external library, all you need to do is check the user's preferred color scheme using the ",[82,694,695],{},"window.matchMedia"," API and store the preference in local storage.\nThen you can add or remove the ",[82,698,655],{}," class on the body based on the stored preference.",[558,701,703],{"id":702},"content","Content",[16,705,706],{},"Nuxt Content allows you to configure multiple content sources, with different queryable fields.\nAt runtime, each of these sources gets loaded into an SQLite database, which can then be queried from the application.\nThis allows for easy filtering and sorting of content.",[16,708,709],{},"For this site, I have divided the content into the following collections.\nI will probably end up expanding this list in the future, but for now this is sufficient.",[65,711,712,730,741],{},[68,713,714,715],{},"Pages\n",[65,716,717,720],{},[68,718,719],{},"Pages to render on the site and show in the navigation bar.",[68,721,722,723,726,727,729],{},"Includes the ",[31,724,725],{"href":118},"home"," and ",[31,728,134],{"href":108}," pages.",[68,731,732,733],{},"Projects\n",[65,734,735],{},[68,736,737,738,740],{},"Projects to showcase on the ",[31,739,134],{"href":108}," page (like this one).",[68,742,743,744],{},"Socials\n",[65,745,746],{},[68,747,748],{},"Social links to show in the footer.",[558,750,752],{"id":751},"pages","Pages",[16,754,755,756,758,759,761],{},"Nuxt uses file based routing, where the file structure of the ",[82,757,751],{}," directory is used to generate routes for the site.\nThe ",[82,760,751],{}," directory is very simple for now, with only 3 templates in use.",[763,764,769],"pre",{"className":765,"code":767,"language":768},[766],"language-text","app\u002F\n└── pages\u002F\n    ├── projects\u002F\n    │   └── [slug].vue\n    ├── [...path].vue\n    └── dev.vue\n","text",[82,770,767],{"__ignoreMap":110},[16,772,773,776,777,780,781,783,784,787,788,790],{},[82,774,775],{},"dev.vue"," page is a development page used for testing components.\nThe ",[82,778,779],{},"[...path].vue"," page is a catch all that renders the matching page from the ",[82,782,751],{}," collection,\nand the ",[82,785,786],{},"projects\u002F[slug].vue"," page is used to render the matching project from the ",[82,789,134],{}," collection.",[558,792,794],{"id":793},"deployment","Deployment",[16,796,797],{},[798,799],"img",{"alt":800,"src":801},"Diagram of deployment infrastructure","\u002Fimages\u002Fprojects\u002Fportfolio-website\u002Fdeployment.png",[16,803,804,805,809],{},"I host my code on my own self-hosted ",[31,806,42],{"href":807,"rel":808},"https:\u002F\u002Fcode.ggrainger.uk\u002F",[35]," instance, which has CI\u002FCD support using Forgejo actions.\nWhen code is pushed to the repository, the site is built statically and then deployed to one of the following environments.",[65,811,812,828],{},[68,813,814,815],{},"Staging:\n",[65,816,817,825],{},[68,818,819,820,60],{},"Deployed to ",[31,821,824],{"href":822,"rel":823},"https:\u002F\u002Fcodeberg.org\u002Fgit-pages\u002Fgit-pages",[35],"git pages",[68,826,827],{},"Open source equivalent to GitHub pages.",[68,829,830,831],{},"Production:\n",[65,832,833,838],{},[68,834,819,835,60],{},[31,836,546],{"href":544,"rel":837},[35],[68,839,840],{},"Cloud hosted, so downtime on my server will not take the website down.",[16,842,843],{},"At the moment, these two environments are always updated together when I push to the repository.\nLong term, it would be better to have a separate staging branch or a manual trigger for production deployments.\nBut for my purposes, this is good enough.",[20,845,847],{"id":846},"conclusion","Conclusion",[16,849,850,851,855,856,858],{},"Well there you have it, some background information on how this site was built.\nYou can check out the source code for this site ",[31,852,54],{"href":853,"rel":854},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger\u002FWebsite",[35],".\nMore ",[31,857,134],{"href":108}," to come soon (hopefully)!",{"title":110,"searchDepth":111,"depth":111,"links":860},[861,862,863,870],{"id":228,"depth":111,"text":229},{"id":418,"depth":111,"text":419},{"id":555,"depth":111,"text":556,"children":864},[865,867,868,869],{"id":560,"depth":866,"text":561},3,{"id":702,"depth":866,"text":703},{"id":751,"depth":866,"text":752},{"id":793,"depth":866,"text":794},{"id":846,"depth":111,"text":847},"\u002Fimages\u002Fprojects\u002Fportfolio-website\u002Fcover.png","Building and deploying a portfolio website using Nuxt, TailwindCSS and Nuxt Content.",{},"\u002Fprojects\u002Fportfolio-website","2026-07-04 23:22:00",{"title":391,"description":872},"https:\u002F\u002Fcode.ggrainger.uk\u002Fggrainger\u002Fportfolio-website","projects\u002Fportfolio-website","OuwwvjdGpecRASVMy1_KB357WC2_C_L9t0wVa22GnNs",1785882542223]