Michael Hoffmann
@Mokkapps
Followers
6,157
Following
766
Media
1,958
Statuses
8,661
I'm helping developers to become @vuejs & @nuxt_js experts I'm running these side projects: 💌 @weekly_vue_news 🖼️ @CodeSnapDev
München, Bayern
Joined February 2012
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
DG X ORM KORNNAPHAT
• 507837 Tweets
Jets
• 190835 Tweets
Adams
• 148114 Tweets
Rodgers
• 115342 Tweets
#السعوديه_البحرين
• 101363 Tweets
Ghana
• 85262 Tweets
Bloomberg
• 73339 Tweets
سالم
• 62998 Tweets
Tuchel
• 59896 Tweets
Fields
• 57074 Tweets
Raiders
• 55083 Tweets
Jerry
• 54426 Tweets
World Cup
• 32456 Tweets
Economic Club of Chicago
• 31555 Tweets
Krypto
• 31386 Tweets
منصور
• 29013 Tweets
Amari Cooper
• 25093 Tweets
كاس العالم
• 24531 Tweets
iPad mini
• 20041 Tweets
Mike Williams
• 18291 Tweets
Tapia
• 18210 Tweets
Russ
• 17476 Tweets
James Gunn
• 15642 Tweets
المنتخب السعودي
• 13770 Tweets
Pinned Tweet
Hi, welcome to my Twitter account! 👋
I'm a Senior Frontend Developer specializing in
@vuejs
&
@nuxt_js
.
Here I publish daily content on Vue & Nuxt, and I run a weekly newsletter about these topics (
@weekly_vue_news
).
Follow for expert insights and tips!
6
2
76
Developer team fixing a production bug on Friday after the deployment 😉
27
197
1K
🛠️ franken/ui
👉🏻 Franken UI is a collection of copy-pastable components that are HTML-first and framework agnostic.
14
121
877
🛠️ Better Commits
👉🏻 A CLI for writing better commits, following the conventional commit guidelines.
22
78
529
I don’t like 🙅♂️
Backend code should not be in the same file as frontend code
What do you think about this?
164
25
480
🛠️ Tailwind Prettier Plugin
👉🏻 A Prettier plugin for Tailwind CSS v3.0+ that automatically sorts classes based on their recommended class order
6
49
347
📕 Deep Cloning Objects in JavaScript, the Modern Way
👉🏻 The structured clone function, which is built into the JavaScript runtime, can be used to make deep copies of objects in JavaScript.
4
37
293
🛠️ Float UI
👉🏻 Float UI is an open-source and free Tailwind UI library for HTML, React, Vue, and Svelte, with production-ready templates.
4
63
271
🛠️ Radix Vue
👉🏻 Radix Vue is a Vue port of Radix UI.
👉🏻 Unstyled, accessible components for building high‑quality design systems and web apps in Vue.
4
31
260
🛠️ driver.js
👉🏻 Powerful, highly customizable vanilla JavaScript engine for page tours and contextual help systems.
👉🏻 No external dependencies, light-weight, supports all major browsers and highly customizable.
2
35
248
I recommend creating new
@vuejs
components with these files:
⭐ Button.vue - Vue SFC component
⭐ Button.test.ts - Vitest + testing library unit tests
⭐ Button.stories.ts - Storybook stories
⭐ Button.types.ts - TypeScript types
⭐ index.ts - Re-exports (barrel)
Your opinion?
24
27
246
💚 Vue 3.3 will provide the defineModel compiler macro
For more details, checkout my article:
5
36
215
🛠️ Vue Rewards
👉🏻 Rewards your users with the rain of confetti, emoji or balloons in seconds.
1
31
198
💡 Vue Tip: Show inlay hints in VS Code for missing props
👉🏻 The Volar extension can show inlay hints for missing components props
👉🏻 Disabled by default, enable it in the settings "Vue > Inlay Hints: Missing Props"
👉🏻 In JSON: ""vue.inlayHints.missingProps": true"
3
24
192
🛠️ extension.js
👉🏻 An easy way to create cross-browser web extensions without any build configuration.
👉🏻 It's plug-and-play and has built-in support for TypeScript, WebAssembly, React, and modern JavaScript.
5
34
183
📕 Vueform is Now Open-Source 🔥
👉🏻 Vueform has become open-source and available on GitHub under MIT license, including all its elements and features.
3
41
174
📕 Why I chose Vue over React
👉🏻 The author explains why he chose the best frontend framework available.
1
25
172
🛠️ Chrono
👉🏻 A natural language date parser in JavaScript.
👉🏻 It is designed to handle most date/time formats and extract information from any given text.
2
19
170
🛠️ Una UI
👉🏻 Una UI is an atomic UI Framework powered by the UNOCSS engine.
👉🏻 It provides components and presets for creating stunning user interfaces with ease.
5
22
162
💚 Vue 3 will allow you to define emits in defineEmits() in a more ergonomic way
How do you like it?
7
21
153
📕 VueFire is now stable
👉🏻 VueFire, a first class Vue and Firebase experience — including support for Nuxt, is now stable
1
25
156
📕 date-fns v3
👉🏻 Full TypeScript rewrite
👉🏻 No more runtime type checking
👉🏻 Minimal size is now 200 bytes!
👉🏻 and more...
3
15
151
📕 Nuxt 3.9 is out
👉🏻 Vite 5
👉🏻 Interactive server components
👉🏻 New composables
👉🏻 A new loading API
👉🏻 And more...
1
18
151
📕 App structure for big Vue projects
👉🏻 The author describe what he thinks has been the more intuitive easy to work and maintain folder structure in medium to large
@vuejs
applications.
2
25
145
🛠️ UI Lib Picker
👉🏻 Pick the right UI Library for your Vue 3 or Nuxt 3 Project.
5
25
145
📕 Vite 5.0 is out!
👉🏻 v5 now uses Rollup 4, removes many deprecated features, and requires Node 18+
1
12
143
📹 Vue 3 & Composition API - Full Project
👉🏻 Build an expense tracker application from scratch using Vue.js 3 and the composition API with the latest syntax from version 3.2.
1
24
136
🛠️ Shadcn for Vue
👉🏻 A community-led Vue port of the React-oriented "shadcn/ui" component library.
👉🏻 A suite of attractive components built with Tailwind CSS and Radix UI that you can easily "copy and paste" into your apps.
4
13
128
💡 React, Vue, Angular and Svelte use different techniques to conditionally render elements.
❓Which do you prefer?
(Thanks for all the feedback on my last post, this version should hopefully be correct ☺️)
59
16
129
🛠️ Nuxt I18n v8.0 released
👉🏻 After two years of development, a stable release of Nuxt I18n for Nuxt 3 is available.
0
11
124
🛠️ Nuxt API Party
👉🏻 Connect with any API securely with server proxy & dynamic composable names.
0
20
123
🛠️ The next iteration of Vue DevTools
👉🏻 Enhance your Vue development journey with an amazing experience!
5
16
121
💡 Volar Tip (VS Code Extension)
👉🏻 You can now extract simple parts of your template into a new component
👉🏻 Select the code inside template and press CMD + . to show the context menu
2
21
116
📕 6 Advanced TypeScript Tricks for Clean Code
👉🏻 Six advanced TypeScript tips will be covered here, along with examples showing how each one works step by step and their benefits.
👉🏻 Covers topics like decorators, namespaces, mixins and more.
1
26
114
🛠️ VueEmail
👉🏻 A collection of high-quality, unstyled components for creating beautiful emails using Vue and TypeScript.
👉🏻 I use it for
@weekly_vue_news
6
21
115
📕 Vue Patterns
👉🏻 Free guide for Vue patterns that can significantly help in writing clean, efficient, and maintainable code.
👉🏻 Includes patterns like composables, provide/inject, and more.
1
16
114
If you care about privacy (which you definitely should) you should use
@duckduckgo
instead of Google as your default search engine
6
30
104
📕 Modern HTML email (tables no longer required)
👉🏻 The new Outlook switches rendering engines from Microsoft Word to Edge
3
21
109
🛠️ TypeStat
👉🏻 TypeStat converts JavaScript into TypeScript and modifies TypeScript types in existing code. 👉🏻 It can add and remove types without changing runtime behavior.
👉🏻 It can also infer types and annotate missing nulls and undefineds.
3
13
110
🛠️ Svgl
👉🏻 A library of free-to-use SVG logos.
3
20
107
🛠️ Nuxt Templates
👉🏻 Nuxt now provides a list of community templates that can help you get up and running in a new application in a few seconds.
2
20
107
💡 Nuxt Tip
👉🏻 Since 3.7, you can define your route rules within the page component you want them applied to
0
16
103
📕 A simple Vue form validation composable with Zod
👉🏻 In this article, you'll see how to create a simple Vue composable for form validation with just a few lines of code
👉🏻 The composable uses Zod under the hood to validate form data.
0
22
102
🛠️ Uno UI
👉🏻 A Vue.js based UnoCSS UI library including a comprehensive collection of prebuilt, ready-to-use components.
0
15
101
📕 Vue Docs Chatbot
👉🏻 A chatbot trained on the entire Vue.js documentation markdown files.
10
25
99
📕 Ref vs. Reactive: What to Choose Using Vue 3 Composition API?
👉🏻 In this article, I'll explain how you can choose whether to utilize reactive, ref, or both to adding a reactive state to Vue components .
3
18
98
🛠️ Pinia Colada
👉🏻 An opinionated yet flexible data fetching layer on top of Pinia.
👉🏻 It's still experimental and not ready for production.
4
12
101
📕 Good Ways To Organize Large Vue.js Project
👉🏻 It can be difficult to keep a large Vue.js project structured, but there are a number of tactics you can employ to do so.
👉🏻 Here are some helpful tips for structuring a sizable Vue.js project.
4
14
99
📕 Good practices and Design Patterns for Vue Composables
👉🏻 This article summarise good practices and design patterns about Vue composables.
4
26
100
💡 Nuxt Tip: Import Meta
👉🏻 "process.server" and "process.client" are deprecated
👉🏻 You should use the "import.meta" object instead
2
14
97
💡 Nuxt Quick Tip: Run with HTTPS locally
👉🏻 Listen with https protocol with a self-signed certificate by default.
8
16
96
Which frontend framework will have the biggest community in 5 years?
React
1713
Vue
1766
Angular
222
Svelte
391
39
14
93
📕 Minimizing Nuxt 3 Docker Images
👉🏻 In this blog post, you'll learn how to minimize Nuxt 3 Docker images
👉🏻 Starting with a basic unoptimized image that is 1.4 Gigabyte large and ending with an image that's only 164 MB in size.
1
18
95
🛠️ Heat.js
👉🏻 It has no dependencies, and is small, responsive, and themeable.
0
11
94
🛠️ Schedule-X
👉🏻 A Material Design calendar and date picker.
👉🏻 Available in the form of React, Vue or plain JS components.
4
10
93
📕 Awesome Software and Architectural Design Patterns
👉🏻 This repository contains a curated list of software and architecture-related design patterns.
0
25
89
💡 TypeScript: Prefer Record over a Switch Statement
👉🏻 Easier to read
👉🏻 Cleaner code
👉🏻 If you forget a case, your code won't compile
1
11
92
💡 Vue Tip: Chaining Event Modifiers
By chaining multiple event modifiers together, you can create sophisticated event handling scenarios with ease.
3
11
91
🛠️ Unlighthouse
👉🏻 Unlighthouse scans your entire site using Google Lighthouse, with a modern UI, minimal config and smart sampling.
👉🏻 It takes two minutes on average and is open source.
0
23
92
📕 The Concise TypeScript Book
👉🏻 This book enhances understanding and proficiency in TypeScript for both beginner and experienced developers.
1
30
91