[{"data":1,"prerenderedAt":293},["ShallowReactive",2],{"projects-list-en":3},[4,168],{"id":5,"title":6,"alt":7,"article":8,"body":9,"date":149,"description":150,"extension":151,"github":152,"image":153,"locale":154,"meta":155,"navigation":156,"path":157,"seo":158,"stem":159,"tags":160,"technologies":165,"__hash__":167},"projects/en/projects/blog.md","Blog","Personal Federico Ibba blog",null,{"type":10,"value":11,"toc":136},"minimark",[12,17,21,25,28,33,46,63,67,82,86,92,96,115,119],[13,14,16],"h2",{"id":15},"description","Description",[18,19,20],"p",{},"Throughout my career as a frontend engineer, I have always wanted to create my own personal blog and portfolio: a place to showcase my projects and share my thoughts, ideas, and aspirations. My very first attempt at building my portfolio can be traced back to 2019, when I was exploring Static Site Generation in React using Gatsby.",[13,22,24],{"id":23},"nuxt-ecosystem","Nuxt ecosystem",[18,26,27],{},"In my last three years as a Software Engineer at TUI Musement, I've been using Nuxt as a framework in frontend projects, so it was an easy choice for my own project. The Nuxt ecosystem is full of libraries and solutions that often have integrations in place, which simplifies the developer experience.",[29,30,32],"h3",{"id":31},"nuxt-content","Nuxt Content",[18,34,35,40,41,45],{},[36,37,32],"a",{"href":38,"target":39},"https://content.nuxt.com/","_blank"," is a git-based headless Content Management System (CMS) that works as a module for the Nuxt framework. It enables users to build content-driven websites by managing content directly through files in a ",[42,43,44],"code",{},"content/"," directory. In my case, I will be writing Markdown files for two types of content:",[47,48,49,57],"ul",{},[50,51,52,56],"li",{},[53,54,55],"strong",{},"Projects",": like the page you're reading right now, this section introduces a project with its technical specifications;",[50,58,59,62],{},[53,60,61],{},"Articles",": a blog article in which I discuss something I've implemented, including the thoughts, reasoning, and ideas that led me to certain decisions.",[29,64,66],{"id":65},"nuxt-ui","Nuxt UI",[18,68,69,73,74,76,77,81],{},[36,70,72],{"href":71,"target":39},"https://nuxt.com/blog/nuxt-ui-v4","Nuxt UI v4"," is an open-source component library. It integrates easily with ",[53,75,32],{},", and some components are designed for this purpose, like ",[36,78,80],{"href":79,"target":39},"https://ui.nuxt.com/docs/components/content-toc","ContentToc",", the menu at the top of the page you're reading.",[29,83,85],{"id":84},"nuxt-i18n","Nuxt i18n",[18,87,88,91],{},[36,89,85],{"href":90,"target":39},"https://i18n.nuxtjs.org/"," helped me serve the website in two languages, Italian and English. It provides a simple solution for implementing language prefix-based routing.",[29,93,95],{"id":94},"nuxt-seo","Nuxt SEO",[18,97,98,101,102,105,106,109,110,114],{},[36,99,95],{"href":100,"target":39},"https://nuxtseo.com/"," is a collection of modules that handles all aspects of organic traffic, helping to set up things like ",[42,103,104],{},"robots.txt"," and ",[42,107,108],{},"sitemap.xml"," files. It also offers a nice library, ",[36,111,113],{"href":112,"target":39},"https://nuxtseo.com/docs/og-image/getting-started/introduction","OG Image",", which creates a dynamic Open Graph image that is displayed when a link is shared in messaging and social media applications. Try sharing this project page!",[13,116,118],{"id":117},"deploy","Deploy",[18,120,121,122,126,127,130,131,135],{},"The website is published using ",[36,123,125],{"href":124,"target":39},"https://docs.github.com/en/pages","Github Pages"," with a CI/CD pipeline that runs when pushing to the ",[53,128,129],{},"main"," branch. Kudos to Nuxt for offering a lot of ",[36,132,134],{"href":133,"target":39},"https://nuxt.com/deploy","presets"," for building and releasing easily, depending on your favorite service.",{"title":137,"searchDepth":138,"depth":138,"links":139},"",2,[140,141,148],{"id":15,"depth":138,"text":16},{"id":23,"depth":138,"text":24,"children":142},[143,145,146,147],{"id":31,"depth":144,"text":32},3,{"id":65,"depth":144,"text":66},{"id":84,"depth":144,"text":85},{"id":94,"depth":144,"text":95},{"id":117,"depth":138,"text":118},"2025-09-15T00:00:00.000Z","How I've implemented my personal blog and portfolio","md","https://github.com/federicoibba/federicoibba.github.io","/images/projects/blog.jpg","en",{},true,"/en/projects/blog",{"title":6,"description":150},"en/projects/blog",[161,162,163,164],"Javascript","Typescript","Nuxt","Vue",[161,162,163,164,166],"Tailwind CSS","CzzlkQXuQ_R7SXb4SCOHqNbBrgmDmXbHRfFApJe86JA",{"id":169,"title":170,"alt":170,"article":171,"body":172,"date":274,"description":275,"extension":151,"github":276,"image":277,"locale":154,"meta":278,"navigation":156,"path":279,"seo":280,"stem":281,"tags":282,"technologies":289,"__hash__":292},"projects/en/projects/food-rag.md","Nutritional Information RAG","/a-nutritional-llm-assistant-using-rag",{"type":10,"value":173,"toc":268},[174,176,188,192,233,237,260,262],[13,175,16],{"id":15},[18,177,178,179,182,183,187],{},"This project provides a ",[53,180,181],{},"Retrieval-Augmented Generation (RAG",")** service to extract nutritional information for food items using both OpenAI and open-source models, such as Qwen and Llama. In the first phase, experiments were conducted in Jupyter notebooks to validate the approach; in the final phase, the results were deployed as a serverless service on ",[36,184,186],{"href":185,"target":39},"https://modal.com/","modal.com",".",[13,189,191],{"id":190},"how-it-works","How it Works",[193,194,195,201,211,217,223],"ol",{},[50,196,197,200],{},[53,198,199],{},"Data Preparation:"," The dataset is cleaned and relevant columns are selected in the first notebook.",[50,202,203,206,207,187],{},[53,204,205],{},"Vector Store Creation:"," Food descriptions are first transformed into vectors, then stored in ",[36,208,210],{"href":209,"target":39},"https://www.mongodb.com/","MongoDB",[50,212,213,216],{},[53,214,215],{},"Vector Search Index Creation:"," A search index is created for querying foods based on name similarity.",[50,218,219,222],{},[53,220,221],{},"RAG Pipeline:"," Given a food description, the system retrieves the most relevant entries from the vector store and uses a language model (OpenAI, Llama, or Qwen) to extract the proper food information.",[50,224,225,228,229,232],{},[53,226,227],{},"API Service:"," The FastAPI-based service exposes a ",[42,230,231],{},"/get_nutritional_data"," endpoint (POST) that accepts a food description and returns nutritional information in JSON format. A total of three services have been deployed: a GPT-4o mini one that performs API requests to OpenAI using its API key, and two open-source model-based services using very small models from Qwen and Llama.",[13,234,236],{"id":235},"project-structure","Project Structure",[47,238,239,248,254],{},[50,240,241,105,244,247],{},[42,242,243],{},"datasets/food.csv",[42,245,246],{},"datasets/food_dataset.csv",": Raw and processed food nutrition datasets used as the data source for the project.",[50,249,250,253],{},[42,251,252],{},"notebooks/",": the folder contains all the experiments and the vector database creations.",[50,255,256,259],{},[42,257,258],{},"services/",": directory with all the services created.",[13,261,118],{"id":117},[18,263,264,265,267],{},"The service is deployed online using ",[36,266,186],{"href":185,"target":39},", a serverless compute platform designed for AI and Machine Learning applications. They offer a generous free tier for experimenting, starting from $5 to $30 monthly credits.",{"title":137,"searchDepth":138,"depth":138,"links":269},[270,271,272,273],{"id":15,"depth":138,"text":16},{"id":190,"depth":138,"text":191},{"id":235,"depth":138,"text":236},{"id":117,"depth":138,"text":118},"2024-07-20T00:00:00.000Z","A RAG service to extract nutritional information for food items using both OpenAI and open-source models.","https://github.com/federicoibba/nutritional-information-rag","/images/projects/rag.jpg",{},"/en/projects/food-rag",{"title":170,"description":275},"en/projects/food-rag",[283,284,285,210,286,287,288],"Python","RAG","LLM","OpenAI","Llama","Qwen",[283,210,284,285,286,287,288,290,291],"FastAPI","modal","EwZyfpGBrvlgJg7NJurA93PHW4EIUc8D_OWI--RDch0",1763894162830]