[{"data":1,"prerenderedAt":728},["ShallowReactive",2],{"navigation":3,"\u002Fposts\u002Fthe_move_to_vuejs-content":42,"\u002Fposts\u002Fthe_move_to_vuejs-surround":658,"repo-ColinMietka\u002Fdashboard-app-gitlab":662,"repo-ColinMietka\u002FColinMietka.gitlab.io-gitlab":690,"repo-ColinMietka\u002Flvdp-app-gitlab":710},[4],{"title":5,"path":6,"stem":7,"children":8,"page":41},"Posts","\u002Fposts","posts",[9,13,17,21,25,29,33,37],{"title":10,"path":11,"stem":12},"Agents, MCP, RAG, Knowledge Graphs, all open source and local","\u002Fposts\u002Fagents_mcp_rag_local_foss","posts\u002Fagents_mcp_rag_local_foss",{"title":14,"path":15,"stem":16},"DeGoogle your phone","\u002Fposts\u002Fdegoogle_your_phone","posts\u002Fdegoogle_your_phone",{"title":18,"path":19,"stem":20},"Homelab Automation","\u002Fposts\u002Fhomelab_automation","posts\u002Fhomelab_automation",{"title":22,"path":23,"stem":24},"How I discovered Static Site Generators","\u002Fposts\u002Fhow_i_discovered_ssg","posts\u002Fhow_i_discovered_ssg",{"title":26,"path":27,"stem":28},"My Linux Journey","\u002Fposts\u002Fmy_switch_to_linux","posts\u002Fmy_switch_to_linux",{"title":30,"path":31,"stem":32},"Own your Data","\u002Fposts\u002Fown_your_data","posts\u002Fown_your_data",{"title":34,"path":35,"stem":36},"Self-host your AI assistant","\u002Fposts\u002Fself_host_your_ai_assistant","posts\u002Fself_host_your_ai_assistant",{"title":38,"path":39,"stem":40},"The move to Vue.js","\u002Fposts\u002Fthe_move_to_vuejs","posts\u002Fthe_move_to_vuejs",false,{"id":43,"title":38,"body":44,"date":642,"description":643,"extension":644,"image":645,"meta":646,"navigation":647,"path":39,"readingTime":648,"seo":649,"stem":40,"tags":650,"__hash__":657},"content\u002Fposts\u002Fthe_move_to_vuejs.md",{"type":45,"value":46,"toc":619},"minimark",[47,52,56,61,69,89,96,104,114,118,136,140,143,147,157,164,168,178,185,216,225,238,260,263,267,282,286,289,293,296,299,308,319,323,338,341,348,351,355,358,362,365,449,453,456,461,464,487,490,496,500,507,521,524,544,547,550,554,557,563,574,580,609,612,616],[48,49,51],"h2",{"id":50},"motivations","Motivations",[53,54,55],"p",{},"Let's start from the very beginning. I think I should explain the reason why I wanted to\nlearn a new language.",[57,58,60],"h3",{"id":59},"an-old-project-not-going-anywhere","An old project not going anywhere",[53,62,63,64,68],{},"At the center of it all is an old project that has never seen the light, and probably never will.\nI guess it's a rather common thing for people to have ",[65,66,67],"em",{},"pet projects",", always in development,\nnever finished, and that with the year passing, will never find the success they wished for\nwhen starting. For me, it is linked to a non-profit association about bike touring. The initial\nidea was to build a community platform where cyclist can share bike touring experiences, in a blog post\nform along with technical statistics like elevation, duration, GPS traces. We started the project\nwith friends and family more than 10 years ago, when this kind of platform did not exist yet but obviously,\nas time got by, we didn't put enough effort into it.",[53,70,71,72,76,77,80,81,84,85,88],{},"I remember the first bad decision of going to ",[73,74,75],"strong",{},"WordPress",". It was not suited, at least at the time, to\nbuild this kind of collaborative website on it's free version. We ended up stopping development.\nI also remember the lockdown period when I got some free time... I'd grown a little and was more\nproficient with development skills. I produced a complete version in pure ",[73,78,79],{},"HTML\u002FCSS"," and ",[73,82,83],{},"PHP"," using\n",[73,86,87],{},"Bootstrap",". I was functionnal, not feature complete at all and probably insecure even if I put many efforts\nin setting up complete user management flow with email and encrypted token and passwords.",[53,90,91,92,95],{},"A few years have passed since this version already. I got back into it, not randomly, but after I\ndiscovered ",[73,93,94],{},"FastAPI"," in a project at work. I remember testing Flask a few years back but this relatively new\nframework, very popular as I'm writing now, made me want to go back to my pet project and abandon the PHP.\nMy python is not perfect but much better than my PHP. With FastAPI, I could build a safer backend,\nand maybe finish what I started 10 years ago.",[53,97,98],{},[99,100],"img",{"alt":101,"src":102,"title":103},"LVDP Logo","\u002Fposts\u002Fthe_move_to_vuejs\u002Flogo.png","The Voyageurs du Peloton - LVDP Logo.",[53,105,106,107,80,110,113],{},"Now you see the catch. If I'm to develop a good backend, I should probably build a\ngood frontend too. I'll explain later why I went to ",[73,108,109],{},"Vue.js",[73,111,112],{},"Nuxt.js",". But tldr. is\nthat I wanted a recent JavaScript framework growing in popularity to go along FastAPI.",[57,115,117],{"id":116},"this-website","This website",[53,119,120,121,124,125,128,129,131,132,135],{},"The pet project was a good reason on its own (obviously, as a pet project), but it was not the only one.\nI discovered later that in the Nuxt framework, you have the possibility to build static sites.\nThis website was made almost 2 years ago using ",[73,122,123],{},"Hugo"," and a theme called ",[73,126,127],{},"Blowfish",". At the time, I wanted to\nmove away from my old ",[73,130,87],{}," version and use a modern way to build my personal pages.\nHugo and ",[73,133,134],{},"Gitlab Pages"," made this possible, but I never intended to learn any Go or dive into Hugo.\nI'm curious about the frontend\u002Fweb frameworks but not at the point of learning them just for their own sake.\nThe newly acquired Vue.js and Nuxt.js skills made me improve this website, gain more control over its design\nand content options, and it's for the best. I'm even (almost) at feature parity with what I was using\nfrom Blowfish, wonderful in my book.",[57,137,139],{"id":138},"professional-inquiries","Professional inquiries",[53,141,142],{},"Last but not least, I thought that if I learn a new language or framework on my own, I should probably aim\nat something that I could use professionally. Not too hard to understand... I'm a data scientist\u002Fengineer.\nFor almost 10 years, I've built data and machine learning pipelines for industrial clients, often working\nwith frontend developer colleagues that delivered my transforms in dashboards. Context and environments\nvary between clients but something never changes, JavaScript is at the center of the whole frontend stack.\nAnother presonal project I had was to build a data dashboard template project. Something that I could re-use\nas a fast developement prototype base. Initially built with Dash\u002FPlotly in python, I wanted to move to\na more production ready enviroment. Not that Dash is not great, it just lacks design options and\nthe resulting visual appeal that often makes the difference with a client.",[48,144,146],{"id":145},"first-steps","First steps",[53,148,149,150,80,153,156],{},"Now you have the context and my thought process for going to JavaScript. I head before about\n",[73,151,152],{},"React",[73,154,155],{},"Angular"," and I started searching for the one framework I wanted to learn.",[53,158,159],{},[99,160],{"alt":161,"src":162,"title":163},"Vue.js Logo","\u002Fposts\u002Fthe_move_to_vuejs\u002FVue.js_logo.svg","The Vue.js Logo.",[57,165,167],{"id":166},"why-vuejs-and-nuxtjs","Why Vue.js and Nuxt.js ?",[53,169,170,171,177],{},"I needed to make the right choice, learn the right framework because, I don't want, or have time to learn multiple.\nI started by documenting a little what was popular in late 2025-early 2026. Depending on sources, you find\nalways the same top trending frameworks, some established for years and some rather new and promising.\nI decided I want something rather new. It was the same reasoning I had when learning some FastAPI. Of course\nDjango and Flask were more popular, well documented and established as references. But all top seeds are meant\nto fall when a better underdog gains trust in communities. I read about ",[172,173,109],"a",{"href":174,"rel":175},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FVue.js",[176],"nofollow",",\ncreated in 2014 and gaining user base ever since. It's also open source, a mandatory criteria for me.\nI also liked the single file component (SFC) design. It seemed perfectly suited for a beginner as each component would\nhave its logic and rendering in one place. It has obviously many features that I won't discuss in details here,\npartly because I'm still discovering them and thus not able to give a trusted opinion.",[53,179,180],{},[99,181],{"alt":182,"src":183,"title":184},"Nuxt Logo","\u002Fposts\u002Fthe_move_to_vuejs\u002Flogo-green-white_fond.svg","The Nuxt Logo.",[53,186,187,188,193,194,199,200,204,205,80,210,215],{},"Another decision I took was to use a UI framework. It came to me that a major benefit of the component driven structure\nis that you can use pre-made ones, already tailored and styled. My basic idea was that I don't want to focus on\nCSS and website design, I'm not a designer at all. If I can use a library of basic components that just need a\nfew configuration tweaks, it'll be perfect. Then again you have many options but one of them was\n",[172,189,192],{"href":190,"rel":191},"https:\u002F\u002Fui.nuxt.com\u002F",[176],"NuxtUI",". It goes along with ",[172,195,198],{"href":196,"rel":197},"https:\u002F\u002Fnuxt.com\u002F",[176],"Nuxt"," which is a full-stack web framework\nbased on ",[172,201,109],{"href":202,"rel":203},"https:\u002F\u002Fvuejs.org\u002F",[176],", ",[172,206,209],{"href":207,"rel":208},"https:\u002F\u002Fnitro.build\u002F",[176],"Nitro",[172,211,214],{"href":212,"rel":213},"https:\u002F\u002Fvite.dev\u002F",[176],"Vite",".",[53,217,218,219,224],{},"Nuxt is inspired by Next.js, which is a similar framework based on React. According to their\n",[172,220,223],{"href":221,"rel":222},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FNuxt",[176],"Wikipedia page",":",[226,227,228,235],"blockquote",{},[53,229,230,231,234],{},"The main advantage of Nuxt over using Vue alone is its universal rendering system. The framework works as\nboth an in-browser single-page application (SPA), and as a server-rendered static website, by ",[65,232,233],{},"hydrating"," a\nserver-rendered page to a full SPA after it is loaded.\nThis allows websites to have the search engine optimization and performance benefits of a server-rendered\nsite in addition to the interactivity of a client-rendered application.\nNuxt largely abstracts the server-rendering features from the developer, and it's therefore able to have a\nsimilar development experience to a traditional SPA using Vue's single-file component (SFC) system.",[53,236,237],{},"In addition to its universal rendering mechanism, Nuxt also provides many other benefits and quality-of-life\nfeatures, such as path-based routing, hot module replacement (HMR), TypeScript support out of the box,\nand middleware and server logic.",[53,239,240,241,245,246,204,248,251,252,255,256,259],{},"For a beginner like me, it offers many quality of life advantages along the potential to use it's related UI module\nto speed up the development. It uses the project structure and path for routing, has layout and middleware options\nand a built-in server called Nitro. It makes it a full-stack option for many websites. They also have a ",[242,243,244],"code",{},"generate","\ncommand to build static sites that can be hosted simply in a shared hosting provider like the one I have.\nOf course, the static build feature is not helping build my blogging platform but the ",[73,247,94],{},[73,249,250],{},"SQLModel",",\n",[73,253,254],{},"Postgres"," backend that I built can have a server to server exchange with Nitro, Nuxt's internal server.\nNuxt also leverages ",[73,257,258],{},"TypeScript"," for type safty which reminded me for pydantic on the python side.",[53,261,262],{},"I went for Nuxt and NuxtUI. Of course, everybody won't agree on the choice, but I figured it was an excellent\nentry point into the Web Frameworks world.",[57,264,266],{"id":265},"on-the-difficulty-to-find-tutorials-for-beginners","On the difficulty to find tutorials for beginners",[53,268,269,270,275,276,281],{},"I don't know if it's because I was completely new to this field, but it seemed to me that finding good\nbeginner-friendly tutorials was not an easy part. I guess it is also a downside of working with a high level\nabstraction framework, some of the internal details are hidden from you. It makes it simpler to develop, but it\nkind of prevents you from understanding in details what is really happening behind the scenes. It can also be me\nthat wants to understand more deeply the things I work with even if it would take me much more time to do so.\nIt's been a few weeks of work with these tools already, on different project, using a variety of related modules\nand libs like ",[172,271,274],{"href":272,"rel":273},"https:\u002F\u002Fcontent.nuxt.com\u002F",[176],"Nuxt Content",", and ",[172,277,280],{"href":278,"rel":279},"https:\u002F\u002Funovis.dev\u002F",[176],"Unovis",". And I feel like I've\nbarely scratched the surface, not really being able to grasp the intricacies of the development that I made.\nAnother reason for that is what will discuss next: the use of AI.",[48,283,285],{"id":284},"should-you-use-ai-to-learn-a-new-languageframework","Should you use AI to learn a new language\u002Fframework ?",[53,287,288],{},"Let's not pretend, I used AI to guide me when coding on all 3 projects mentioned earlier. Why not ? It's been\ngetting better at coding lately and as I said, I had trouble finding adapted tutorials. I suspect the AI surge\nto be partly responsible for that by the way. The good old StackOverflow seems deserted these days.\nI'll try to be objective about what AI helped me with, and what it didn't.",[57,290,292],{"id":291},"the-pros","The pros",[53,294,295],{},"I did in weeks what would have taken months. It's as simple as that. It produces tokens faster than I can type\nin the end. Not all the produced code is at the level of quality I want or need for my projects, but it produces\nexamples and snippets that suits what you asked for.",[53,297,298],{},"For example, to learn basic JavaScript syntax (loops, if statements, function declaration), it replaced web\nsearches and StackOverflow for me basically.",[53,300,301,302,307],{},"Another useful way for the AI was the CSS design. NuxtUI leverages\n",[172,303,306],{"href":304,"rel":305},"https:\u002F\u002Ftailwindcss.com\u002F",[176],"Tailwind CSS",", a CSS framework with built-in classes easy to use. Except I hate CSS,\nI'm not a designer, I have no interest in learning more than the basic thing. AI was great here, with the\nright prompting and some back and forth, it assisted me in the design and completely offloaded this part of the work.",[53,309,310,311,314,315,318],{},"I also found myself asking for ",[65,312,313],{},"good practices"," a couple of times. It's a common pattern when working with a new\nlanguage\u002Fframework: how should I proceed ? What is a common way to do it ? What are good practices ? All these\nquestions that could be answered by an experienced developer, that you could find on the web mostly can now be\nanswered by AI. Should you trust the answer ? Clearly ",[73,316,317],{},"No"," ! But the answer given guides your web research\nand fast-tracks you to what you need. If the answer was correct, you'll find sources to corroborate, if not, you'll\nfind sources to contradict it.",[57,320,322],{"id":321},"the-cons","The cons",[53,324,325,326,329,330,333,334,337],{},"Will these pros overcome what's next ? Probably not, and let's explain why. First I had multiple experiences where the\ncode produced was clearly wrong, bypassing basic security concerns, not answering the initial\ngoal. I suppose it's still a relatively growing field, and even with the large cloud models, answer quality\nand code quality standards are not always met. The ",[65,327,328],{},"Vibe Coding"," trend that we see in 2025-2026, where ",[65,331,332],{},"non-technical","\npeople use AI to code is a ",[73,335,336],{},"trap",". From my point of view, you still can not leave the chair and let AI code, you absolutely\nneed to check, question, modify all that was produced. And if you have in mind your project maintenance and quality\nyou have to be able to understand all that was produced.",[53,339,340],{},"If you keep that in mind, generated code becomes a burden. It felt to me like I shifted the focus when learning.\nWithout AI, I would have spent more time searching for answers on the web to build a few bricks of code.\nAll of it would be clear to me and adding features would take time. With AI, adding features is instantaneous, but\nunderstanding them takes more time as you didn't write the code at your own learning pace.",[53,342,343,344,347],{},"In the end, I found myself with 3 projects in a reasonable state. It has more features, has better visuals, and with the\nAI back and forth, implements what I wanted to implement. The counterpart is that the understanding of the language and\nframework behind are not as deep as they could be. I chose to ",[73,345,346],{},"not keep"," code that I don't understand, just a good practice.\nBut would I be able to reproduce without the AI help now ? Not so sure.",[53,349,350],{},"A quick note: Even if I am a fervent advocate for local AI, here I felt the limits of my own GPU power. Local open source\nmodels that I could run locally did not cut it in terms of quality. I used cloud AI instead, it just made me feel bad.\nI am following regularly the release of new open source small scale models and their quality (could be a future post).\nThey are rapidly improving in early 2026, and I hope they are the future for many reasons.",[48,352,354],{"id":353},"a-summary-of-my-learnings","A summary of my learnings",[53,356,357],{},"After this AI discussion, let's go back to Vue & Nuxt. Here are details about the different libs I have used and\nexperimented, along with a list of the main features of my 3 projects.",[57,359,361],{"id":360},"frameworks-and-libs","Frameworks and libs",[53,363,364],{},"First, let's put aside all the backend development regarding FastAPI, MinIO, and PostgreSQL. I'll probably  discuss them\nin another post. Here is the list of what I discovered and used:",[366,367,368,377,385,395,405,413,423,439],"ul",{},[369,370,371,376],"li",{},[73,372,373],{},[172,374,192],{"href":190,"rel":375},[176],": for UI components and layout. It serves as the backbone of each application, it provides a consistent UI\nstyle via Tailwind CSS and is perfectly integrated with the Nuxt project structure.",[369,378,379,384],{},[73,380,381],{},[172,382,274],{"href":272,"rel":383},[176],": the CMS module for creating and managing content. It is handling the blog section of this site and most\nof the basic content pages on the bicycle touring app.",[369,386,387,394],{},[73,388,389],{},[172,390,393],{"href":391,"rel":392},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Fauth-utils",[176],"Nuxt-Auth-Utils",": is used for authentication and authorization. It provides a simple and secure way to handle user\nsessions in Nuxt application. An encrypted cookie containing JWT tokens is populated by the backend access and refresh\nroutes. It is implemented in the blogging platform in the user management flows.",[369,396,397,404],{},[73,398,399],{},[172,400,403],{"href":401,"rel":402},"https:\u002F\u002Fpinia.vuejs.org\u002F",[176],"Pinia",": A local store used to handle state management in an application. In the dashboard application template, it\nsaves the filtering state of the application that is passed to the backend as input to dynamically update charts and KPIs.",[369,406,407,412],{},[73,408,409],{},[172,410,280],{"href":278,"rel":411},[176],": A framework-agnostic modern charting library. It provides a wide range of chart types, and basic utils in a modular way.",[369,414,415,422],{},[73,416,417],{},[172,418,421],{"href":419,"rel":420},"https:\u002F\u002Fmotion.dev\u002Fdocs\u002Fvue",[176],"Motion-v",": A popular library for animations and transitions. It's Vue and Nuxt integration enables a few animations\nmake the site feel modern and responsive.",[369,424,425,438],{},[73,426,427,432,433],{},[172,428,431],{"href":429,"rel":430},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Fmdc",[176],"MDC"," & ",[172,434,437],{"href":435,"rel":436},"https:\u002F\u002Ftiptap.dev\u002F",[176],"TipTap Editor",": Markdown editor and renderer components for Vue.js. They are integrated in NuxtUI and Nuxt Content.\nThey are at the center of the user content management, the bike touring articles that people can submit to the platform.",[369,440,441,448],{},[73,442,443],{},[172,444,447],{"href":445,"rel":446},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Fturnstile",[176],"Turnstile",": A captcha service by Cloudflare used for protecting forms from spam.",[57,450,452],{"id":451},"main-features-in-different-apps","Main Features in different apps",[53,454,455],{},"As I said in the beginning, I mainly worked on 3 different applications, each with its own unique features and\nfunctionalities.",[457,458,460],"h4",{"id":459},"personal-website","Personal Website",[53,462,463],{},"A high-performance personal website, blog, and interactive CV built with Nuxt UI, and Nuxt Content.\nDesigned to showcase technical leadership, research background, and engineering expertise.",[366,465,466,469,472,475,478,481,484],{},[369,467,468],{},"UI Components: Nuxt UI with Tailwind CSS",[369,470,471],{},"Content Engine: Nuxt Content",[369,473,474],{},"Animations & Responsive Design with motion-v and Tailwind CSS",[369,476,477],{},"Continuous Integration and Deployment with Gitlab CI\u002FCD: Gitlab Pages, remote hosting, docker images",[369,479,480],{},"SEO Optimizations with Nuxt built-in capabilities",[369,482,483],{},"Lint, typing, and testing pipelines with ESLint, Typecheck and Vitest",[369,485,486],{},"Renovate bot for dependency management",[53,488,489],{},"This project is in a mature state, with feature parity with the previous Hugo version and complete CI\u002FCD pipeline in place.",[491,492],"repo",{":show-thumbnail":493,"platform":494,"repo":495},"true","gitlab","ColinMietka\u002FColinMietka.gitlab.io",[457,497,499],{"id":498},"les-voyageurs-du-peloton-bike-touring-blogging-platform","Les Voyageurs du Peloton - Bike Touring blogging platform",[53,501,502,503,506],{},"The ",[65,504,505],{},"pet project"," - participative blogging platform for bike touring enthusiasts. It allows travelers to register, document\ntheir trips, and share their cycling experiences with the community. It is built with",[366,508,509,515],{},[369,510,511,514],{},[73,512,513],{},"Frontend",": Nuxt 4 (Vue.js) with NuxtUI & Nuxt Content.",[369,516,517,520],{},[73,518,519],{},"Backend",": FastAPI with SQLModel & Pydantic.",[53,522,523],{},"and features:",[366,525,526,529,532,535,538,541],{},[369,527,528],{},"Participative Blogging: Users can create, edit, and share bike touring stories.",[369,530,531],{},"Secure Authentication: * Registration with email verification.",[369,533,534],{},"JWT-based auth with Refresh Tokens for seamless sessions.",[369,536,537],{},"Secure \"Forgot Password\" workflows.",[369,539,540],{},"Responsive UI: Built with NuxtUI for a mobile-first experience, perfect for riders on the go.",[369,542,543],{},"Hybrid Content: Combines dynamic user data from the DB with static\u002Fguided content via Nuxt Content.",[53,545,546],{},"This project is obviously a work in progress, and I doubt I'll ever finish it but that's not the point. Besides, it\nseems a lot of work for only one person to get to a feature complete application and to maintain it.",[491,548],{":show-thumbnail":493,"platform":494,"repo":549},"ColinMietka\u002Flvdp-app",[457,551,553],{"id":552},"dashboard-app-template","Dashboard App Template",[53,555,556],{},"A high-performance analytics dashboard designed to visualize data.\nThe application leverages Polars for lightning-fast data processing and Nuxt 4 & Unovis for a reactive,\ncomponent-driven user experience.\nThe current data topic is charging station distribution and growth in France.",[53,558,559],{},[99,560],{"alt":561,"src":562,"title":561},"Charging Points Dashboard App","\u002Fposts\u002Fthe_move_to_vuejs\u002Fscreenshot_1.png",[366,564,565,568,571],{},[369,566,567],{},"Lazy Polars Integration: The backend uses LazyFrame processing, ensuring that data filtering, grouping,\nand aggregations are only executed at the last possible moment. This allows for efficient handling of relatively large\ndatasets without high memory overhead.",[369,569,570],{},"Rust-Powered Speed: By using Polars instead of Pandas, data operations are multi-threaded and significantly faster,\nproviding near-instant feedback for dashboard queries.",[369,572,573],{},"FastAPI with Pydantic Schemas: All backend routes are strictly protected by Pydantic models.\nThis ensures that incoming filters from the frontend and outgoing data for charts are validated against specific schemas\nbefore transmission.",[53,575,576],{},[99,577],{"alt":578,"src":579,"title":578},"Charging Points Dashboard Map","\u002Fposts\u002Fthe_move_to_vuejs\u002Fscreenshot_2.png",[366,581,582,585,588,591,594,597,600,603,606],{},[369,583,584],{},"Nitro Server Proxy: A Nuxt Nitro server-side bridge handles requests between the frontend and the FastAPI backend.\nThis layer acts as a gatekeeper, validating backend responses against TypeScript interfaces to prevent runtime UI errors.",[369,586,587],{},"Pinia Global Store: A centralized store manages the state of all active filters.",[369,589,590],{},"Debounced Filtering: Filter updates are debounced. This prevents \"request spam\"\nby waiting 500ms after the user stops interacting before triggering a backend refresh.",[369,592,593],{},"Dynamic Metadata Sync: On initialization, the dashboard automatically fetches global metadata to synchronize\nthe UI components with the actual range of the underlying dataset.",[369,595,596],{},"Nuxt UI v4 Standard: Built using the latest UDashboard component suite.",[369,598,599],{},"Optimized Performance: Long lists (e.g., thousands of France cities) are handled via Virtual Scrolling to maintain UI performance.",[369,601,602],{},"Reactive KPIs: Core metrics update instantly as filters change.",[369,604,605],{},"Reactive charts: Chart react to filter as well but are also source of the filtering engine for improved interactivity.",[369,607,608],{},"Data Table: Visualize current dataset state with a responsive table that updates dynamically as filters are applied.",[491,610],{":show-thumbnail":493,"platform":494,"repo":611},"ColinMietka\u002Fdashboard-app",[48,613,615],{"id":614},"conclusion","Conclusion",[53,617,618],{},"After these few weeks of immersion into the Nuxt.js ecosystem, I am proud of what's been accomplished,\nthe codebase has grown significantly and the projects feels more professional than they were before. But it's not all\ndone yet, and I fear they journey is just starting ! Hopefully, if you're still reading this post, you might find some\ninspiration to start your own projects with Nuxt.js. In the meantime, my list of issues\u002Ftodos is still long...",{"title":620,"searchDepth":621,"depth":621,"links":622},"",2,[623,629,633,637,641],{"id":50,"depth":621,"text":51,"children":624},[625,627,628],{"id":59,"depth":626,"text":60},3,{"id":116,"depth":626,"text":117},{"id":138,"depth":626,"text":139},{"id":145,"depth":621,"text":146,"children":630},[631,632],{"id":166,"depth":626,"text":167},{"id":265,"depth":626,"text":266},{"id":284,"depth":621,"text":285,"children":634},[635,636],{"id":291,"depth":626,"text":292},{"id":321,"depth":626,"text":322},{"id":353,"depth":621,"text":354,"children":638},[639,640],{"id":360,"depth":626,"text":361},{"id":451,"depth":626,"text":452},{"id":614,"depth":621,"text":615},"2026-04-28","A while back, I decided to learn some JavaScript to go along my improvements on the FastAPI backend side. I started a few things, never finished. But trecently I got back into it and the result are worth sharing.","md","\u002Fposts\u002Fthe_move_to_vuejs\u002Ffeatured.svg",{},true,19,{"title":38,"description":643},[651,198,652,653,654,655,656],"Vue","SSG","Blog","JavaScript","Gitlab","CI\u002FCD","WwN7cBLdNfklZvo3Oa4fwD9hXxJDqefqAFgwKBiTb5A",[659,661],{"title":18,"path":19,"stem":20,"description":660,"children":-1},"It seems everyone building a homelab goes through this phase. This is my take on homelab automation, extensively using gitlab CI\u002FCD powers and Renovate bot.",null,{"id":663,"description":664,"name":665,"name_with_namespace":666,"path":665,"path_with_namespace":611,"created_at":667,"default_branch":668,"tag_list":669,"topics":675,"ssh_url_to_repo":676,"http_url_to_repo":677,"web_url":678,"readme_url":679,"forks_count":680,"avatar_url":661,"star_count":680,"last_activity_at":681,"visibility":682,"namespace":683},81326348,"A high-performance analytics dashboard designed to visualize data.\r\nThe application leverages Polars for lightning-fast data processing and Nuxt 4 & Unovis for a reactive,\r\ncomponent-driven user experience.\r\nThe current data topic is charging station distribution and growth.","dashboard-app","Colin Mietka \u002F dashboard-app","2026-04-15T09:16:43.814Z","main",[112,670,671,672,673,674],"dashboard","data visualization","fastapi","polars","unovis",[112,670,671,672,673,674],"git@gitlab.com:ColinMietka\u002Fdashboard-app.git","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Fdashboard-app.git","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Fdashboard-app","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Fdashboard-app\u002F-\u002Fblob\u002Fmain\u002FREADME.md",0,"2026-04-23T09:03:34.719Z","public",{"id":684,"name":685,"path":686,"kind":687,"full_path":686,"parent_id":661,"avatar_url":688,"web_url":689},68571072,"Colin Mietka","ColinMietka","user","\u002Fuploads\u002F-\u002Fsystem\u002Fuser\u002Favatar\u002F14794192\u002Favatar.png","https:\u002F\u002Fgitlab.com\u002FColinMietka",{"id":691,"description":692,"name":693,"name_with_namespace":694,"path":695,"path_with_namespace":696,"created_at":697,"default_branch":668,"tag_list":698,"topics":702,"ssh_url_to_repo":703,"http_url_to_repo":704,"web_url":705,"readme_url":706,"forks_count":680,"avatar_url":707,"star_count":680,"last_activity_at":708,"visibility":682,"namespace":709},56858760,"A high-performance personal website, blog, and interactive CV built with Nuxt, Nuxt UI and Nuxt Content. \r\nDesigned to showcase technical leadership, research background, and engineering expertise.","ColinMietka.gitlab.io","Colin Mietka \u002F ColinMietka.gitlab.io","colinmietka.gitlab.io","ColinMietka\u002Fcolinmietka.gitlab.io","2024-04-15T08:49:54.631Z",[112,699,700,701],"javascript","ssg","vue.js",[112,699,700,701],"git@gitlab.com:ColinMietka\u002Fcolinmietka.gitlab.io.git","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Fcolinmietka.gitlab.io.git","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Fcolinmietka.gitlab.io","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Fcolinmietka.gitlab.io\u002F-\u002Fblob\u002Fmain\u002FREADME.md","https:\u002F\u002Fgitlab.com\u002Fuploads\u002F-\u002Fsystem\u002Fproject\u002Favatar\u002F56858760\u002Favatar.png","2026-04-28T14:22:14.769Z",{"id":684,"name":685,"path":686,"kind":687,"full_path":686,"parent_id":661,"avatar_url":688,"web_url":689},{"id":711,"description":712,"name":713,"name_with_namespace":714,"path":713,"path_with_namespace":549,"created_at":715,"default_branch":668,"tag_list":716,"topics":720,"ssh_url_to_repo":721,"http_url_to_repo":722,"web_url":723,"readme_url":724,"forks_count":680,"avatar_url":725,"star_count":680,"last_activity_at":726,"visibility":682,"namespace":727},69974900,"LVDP is a participative blogging platform for bike touring enthusiasts. It allows travelers to register, document their trips, and share their cycling experiences with the community.","lvdp-app","Colin Mietka \u002F lvdp-app","2025-05-19T14:22:41.029Z",[112,717,672,718,719,701],"docker","postgresql","python",[112,717,672,718,719,701],"git@gitlab.com:ColinMietka\u002Flvdp-app.git","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Flvdp-app.git","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Flvdp-app","https:\u002F\u002Fgitlab.com\u002FColinMietka\u002Flvdp-app\u002F-\u002Fblob\u002Fmain\u002FREADME.md","https:\u002F\u002Fgitlab.com\u002Fuploads\u002F-\u002Fsystem\u002Fproject\u002Favatar\u002F69974900\u002Flvdp_hero.png","2026-04-10T14:32:37.850Z",{"id":684,"name":685,"path":686,"kind":687,"full_path":686,"parent_id":661,"avatar_url":688,"web_url":689},1777387548247]