--- title: Best Vue.js posts — December 2024 | daily.dev description: The most upvoted Vue.js posts from December 2024, curated by the daily.dev community. canonical: https://daily.dev/tags/vuejs/best-of/2024/12 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/vuejs/best-of/2024/12 og:type: website og:site_name: daily.dev og:title: Best Vue.js posts — December 2024 | daily.dev og:description: The most upvoted Vue.js posts from December 2024, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of Vue.js — December 2024 1. 1 [](https://daily.dev/posts/my-new-portfolio-as-a-full-stack-developer-1xmint87n "my new portfolio as a full stack developer") Article Game Developers · 2y my new portfolio as a full stack developer After gaining experience in web and backend development, the author expanded their skills to include ElectronJS, CapacitorJS, and Docker to create and deploy cross-platform applications. Using inspiration from designer Yanka Darelova, the author built an application with Vue 3 Composition APIs, TypeScript, and Sass/SCSS, adding an ExpressJs backend and Mongo database. The app is secure, utilizing Nginx for load balancing and SSL encryption, and is available for exploration at baderidris.com. 368 97 2. 2 [](https://daily.dev/posts/web-performance-optimization-techniques-gmzo8gyox "Web Performance Optimization Techniques") Article Trendyol Tech · 2y Web Performance Optimization Techniques Fast-loading websites are essential for user experience, search engine ranking, and revenue. Techniques for optimizing web performance include reducing dependencies, dynamic imports, tree shaking, image optimization, async components, and server-side compression. Tools like Google Lighthouse, PageSpeed Insights, and WebPageTest can help assess performance and identify areas for improvement. Effective strategies such as using CDNs, caching, and minimizing bundle sizes contribute to faster load times and enhanced user satisfaction. 81 3. 3 [](https://daily.dev/posts/10-tips-to-write-cleaner-vue-js-code-d91mqfqnd "10 Tips to Write Cleaner Vue.js Code") Article DEV · 2y 10 Tips to Write Cleaner Vue.js Code Transitioning to new projects in Vue.js can be challenging, but following best practices helps maintain clean, modular, and readable code. This post provides 10 actionable tips for writing cleaner Vue code, including using the Composition API, adhering to naming conventions, managing UI state locally, leveraging slots, and more. Implementing these guidelines improves code maintenance, scalability, and ease of debugging, benefiting both current and future developers. 54 2 4. 4 [](https://daily.dev/posts/create-your-own-shadcn-style-library-with-jsrepo-wc6kd7yka "Create your own shadcn-style library with jsrepo") Article All ShadCN · 2y Create your own shadcn-style library with jsrepo jsrepo is a versatile tool designed to help you build libraries in frameworks like React, Svelte, Vue, and TypeScript. It simplifies the process by resolving both local and remote dependencies, making code reuse easier. 53 1 5. 5 [](https://daily.dev/posts/vercel-s-v0-ai-the-easiest-way-to-build-web-apps-pjgwqrpho "Vercel's V0 AI: The Easiest Way to Build Web Apps") Article habr · 2y Vercel's V0 AI: The Easiest Way to Build Web Apps Vercel's V0 is a generative AI tool that transforms user input into production-ready code for web app development. Supporting frameworks like React, Vue, and Svelte, V0 allows users to describe their web applications in plain language or upload mockups, and the AI generates the app designs and code. It features text-to-app generation, image integration, responsive design, and Figma integration. While V0 simplifies the development process, manual refinement may be needed for complex interactions and large code blocks. Various pricing plans are available, starting with a free tier offering 200 credits. 48 1 6. 6 [](https://daily.dev/posts/lighthouse-is-a-chore--fmityovf5 "Lighthouse is a chore!") Article ITNEXT · 2y Lighthouse is a chore! Regularly measuring and improving website performance and accessibility scores using Lighthouse CI can significantly enhance SEO. Running Lighthouse manually can be inconsistent and time-consuming, but automation via Lighthouse CI CLI and proper GitHub configuration eliminates these hassles. The post walks through setting up a Vuejs project, adding a Lighthouse configuration, and configuring GitHub to run Lighthouse checks on pull requests. 45 1 [See all Vue.js archives](/tags/vuejs/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/tags/vuejs/best-of/2024/12#page","url":"https://daily.dev/tags/vuejs/best-of/2024/12","name":"Best Vue.js Posts — December 2024","description":"The most upvoted Vue.js posts from December 2024, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/tags/vuejs/best-of/2024/12#items","numberOfItems":6,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/my-new-portfolio-as-a-full-stack-developer-1xmint87n","name":"my new portfolio as a full stack developer"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/web-performance-optimization-techniques-gmzo8gyox","name":"Web Performance Optimization Techniques"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/10-tips-to-write-cleaner-vue-js-code-d91mqfqnd","name":"10 Tips to Write Cleaner Vue.js Code"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/create-your-own-shadcn-style-library-with-jsrepo-wc6kd7yka","name":"Create your own shadcn-style library with jsrepo"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/vercel-s-v0-ai-the-easiest-way-to-build-web-apps-pjgwqrpho","name":"Vercel's V0 AI: The Easiest Way to Build Web Apps"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/lighthouse-is-a-chore--fmityovf5","name":"Lighthouse is a chore!"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Tags","item":"https://daily.dev/tags"},{"@type":"ListItem","position":3,"name":"Vue.js","item":"https://daily.dev/tags/vuejs"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/tags/vuejs/best-of"},{"@type":"ListItem","position":5,"name":"December 2024"}]}]} ```