1<!DOCTYPE html> 2<html lang="en"> 3<head> 4<meta charset="utf-8"> 5<meta name="viewport" content="width=device-width, initial-scale=1"> 6<title>About</title> 7<link rel="stylesheet" href="/assets/built/screen.css?v=cf5cd01f5c"> 8<link rel="shortcut icon" href="/favicon.png" type="image/png" /> 9 <link rel="canonical" href="https://vuejsexamples.com/about/" /> 10 <meta name="referrer" content="no-referrer-when-downgrade" /> 11 12 <meta property="og:site_name" content="Vue.js Examples" /> 13 <meta property="og:type" content="website" /> 14 <meta property="og:title" content="About" /> 15 <meta property="og:description" content="Vue.js examples A nice collection of often useful examples done in Vue.js. On the whole, Vue.js examples is an embodiment of satisfying my own requirements with the idea of making it useful to the wider community of Vue developers. vuejsexamples's goal is to be the go-to website" /> 16 <meta property="og:url" content="https://vuejsexamples.com/about/" /> 17 <meta name="twitter:card" content="summary" /> 18 <meta name="twitter:title" content="About" /> 19 <meta name="twitter:description" content="Vue.js examples A nice collection of often useful examples done in Vue.js. On the whole, Vue.js examples is an embodiment of satisfying my own requirements with the idea of making it useful to the wider community of Vue developers. vuejsexamples's goal is to be the go-to website" /> 20 <meta name="twitter:url" content="https://vuejsexamples.com/about/" /> 21 <meta name="twitter:label1" content="Written by" /> 22 <meta name="twitter:data1" content="Vue.js Examples" /> 23 24
24<script type="application/ld+json"> 25{ 26 "@context": "https://schema.org", 27 "@type": "Article", 28 "publisher": { 29 "@type": "Organization", 30 "name": "Vue.js Examples", 31 "logo": { 32 "@type": "ImageObject", 33 "url": "https://vuejsexamples.com/content/images/2017/10/vuejs-3.png", 34 "width": 286, 35 "height": 60 36 } 37 }, 38 "author": { 39 "@type": "Person", 40 "name": "Vue.js Examples", 41 "image": { 42 "@type": "ImageObject", 43 "url": "//www.gravatar.com/avatar/1f87c1c5e9ccda422d03821987e2cbe5?s=250&d=mm&r=x", 44 "width": 250, 45 "height": 250 46 }, 47 "sameAs": [] 48 }, 49 "headline": "About", 50 "url": "https://vuejsexamples.com/about/", 51 "description": "Vue.js examples A nice collection of often useful examples done in Vue.js. On the whole, Vue.js examples is an embodiment of satisfying my own requirements with the idea of making it useful to the wider community of Vue developers. vuejsexamples's goal is to be the go-to website", 52 "mainEntityOfPage": { 53 "@type": "WebPage", 54 "@id": "https://vuejsexamples.com/" 55 } 56} 57 </script>
57 58 59
59<script src="/public/ghost-sdk.min.js?v=cf5cd01f5c"></script>
vendor: 1 bytes, line 59
59
60<script> 61ghost.init({ 62 clientId: "ghost-frontend", 63 clientSecret: "78394b42ebd9" 64}); 65</script>
65 66 <meta name="generator" content="Ghost 1.26" /> 67 <link rel="alternate" type="application/rss+xml" title="Vue.js Examples" href="https://vuejsexamples.com/rss/" /> 68 69<!-- Google tag (gtag.js) -->
vendor: 64 bytes, lines 69-70
69 70<script async src="https://www.googletagmanager.com/gtag/js?id=
70G-MZSGRS8R3P
vendor: 12 bytes, line 70
70"></script>
71<script> 72
vendor: 134 bytes, lines 72-76
72window.dataLayer = window.dataLayer || []; 73 function gtag(){dataLayer.push(arguments);} 74 gtag('js', new Date()); 75 76 gtag('config', '
76G-MZSGRS8R3P
vendor: 4 bytes, line 76
76');
77</script>
77 78
79<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5680150941998747" crossorigin="anonymous"></script>
79 80</head> 81<body class="page-template page-about"> 82<nav id="navbar" class="navbar is-fixed-top is-transparent" style=" 83 transform: translateY(0px); 84 "> 85 <div id="specialShadow" class="bd-special-shadow" style="opacity: 0; transform: scaleY(1);"></div> 86 87 <div class="container"> 88 89 <div class="navbar-brand"> 90 <a class="navbar-item" href="https://vuejsexamples.com"> 91 <img src="https://vuejsexamples.com/assets/vue.png" alt="Vue.js Examples" width="38" height="38"> 92 </a> 93 <a class="navbar-item " href="https://vuejsexamples.com"> 94 Vue.js Examples 95 </a> 96 <div id="navbarBurger" class="navbar-burger burger" data-target="navMenuIndex"> 97 <span></span> 98 <span></span> 99 <span></span> 100 </div> 101 </div> 102 <div id="navMenuIndex" class="navbar-menu"> 103 <div class="navbar-start"> 104 <div class="navbar-item has-dropdown is-hoverable"> 105 <a class="navbar-link " href="/tag/ui/"> 106 Ui 107 </a> 108 <div class="navbar-dropdown is-boxed"> 109<a class="navbar-item " href="/tag/scroll/">Scroll</a> 110<a class="navbar-item " href="/tag/list/">List</a> 111<a class="navbar-item " href="/tag/admin-template/">Admin-template</a> 112<a class="navbar-item " href="/tag/table/">Table</a> 113<a class="navbar-item " href="/tag/layout/">Layout</a> 114<a class="navbar-item " href="/tag/timeline/">Timeline</a> 115<a class="navbar-item " href="/tag/masonry/">Masonry</a> 116<a class="navbar-item " href="/tag/responsive/">Responsive</a> 117<a class="navbar-item " href="/tag/cards/">Cards</a> 118<a class="navbar-item " href="/tag/bootstrap/">Bootstrap</a> 119<a class="navbar-item " href="/tag/grid/">Grid</a> 120<a class="navbar-item " href="/tag/css/">Css</a> 121<a class="navbar-item " href="/tag/mobile/">Mobile</a> 122<a class="navbar-item " href="/tag/material-design/">Material-design</a> 123<a class="navbar-item " href="/tag/framework/">Framework</a> 124 125<a class="navbar-item " href="/tag/ui/">All UI</a> 126 127 </div> 128 </div> 129 <div class="navbar-item has-dropdown is-hoverable"> 130 <a class="navbar-link " href="#"> 131 Media 132 </a> 133 <div class="navbar-dropdown is-boxed"> 134<a class="navbar-item " href="/tag/slider/">Slider</a> 135<a class="navbar-item " href="/tag/maps/">Maps</a> 136<a class="navbar-item " href="/tag/images/">Images</a> 137<a class="navbar-item " href="/tag/movie/">Movie</a> 138<a class="navbar-item " href="/tag/music/">Music</a> 139<a class="navbar-item " href="/tag/carousel/">Carousel</a> 140<a class="navbar-item " href="/tag/echarts/">Echarts</a> 141<a class="navbar-item " href="/tag/video-player/">Video Player</a> 142<a class="navbar-item " href="/tag/player/">Player</a> 143 144 </div> 145 </div> 146 <div class="navbar-item has-dropdown is-hoverable"> 147 <a class="navbar-link " href="#"> 148 Elements 149 </a> 150 <div class="navbar-dropdown is-boxed"> 151<a class="navbar-item " href="/tag/wizard/">Wizard</a> 152<a class="navbar-item " href="/tag/drop/">Drop</a> 153<a class="navbar-item " href="/tag/drag/">Drag</a> 154<a class="navbar-item " href="/tag/time/">Time</a> 155<a class="navbar-item " href="/tag/icon/">Icon</a> 156<a class="navbar-item " href="/tag/circle/">Circle</a> 157<a class="navbar-item " href="/tag/rating/">Rating</a> 158<a class="navbar-item " href="/tag/dialog/">Dialog</a> 159<a class="navbar-item " href="/tag/overlay/">Overlay</a> 160<a class="navbar-item " href="/tag/tooltips/">Tooltips</a> 161<a class="navbar-item " href="/tag/popup/">Popup</a> 162<a class="navbar-item " href="/tag/alert/">Alert</a> 163<a class="navbar-item " href="/tag/svg/">Svg</a> 164 165 166 </div> 167 </div> 168 <div class="navbar-item has-dropdown is-hoverable"> 169 <a class="navbar-link " href="#"> 170 Input 171 </a> 172 <div class="navbar-dropdown is-boxed"> 173<a class="navbar-item " href="/tag/text/">Text</a> 174<a class="navbar-item " href="/tag/form/">Form</a> 175<a class="navbar-item " href="/tag/select/">Select</a> 176<a class="navbar-item " href="/tag/editor/">Editor</a> 177<a class="navbar-item " href="/tag/highlighting/">Highlighting</a> 178<a class="navbar-item " href="/tag/keyboard/">Keyboard</a> 179<a class="navbar-item " href="/tag/validation/">Validation</a> 180<a class="navbar-item " href="/tag/checkboxes/">Checkboxes</a> 181<a class="navbar-item " href="/tag/picker/">Picker</a> 182<a class="navbar-item " href="/tag/input/">Input</a> 183<a class="navbar-item " href="/tag/autocomplete/">Autocomplete</a> 184<a class="navbar-item " href="/tag/markdown/">Markdown</a> 185<a class="navbar-item " href="/tag/upload/">Upload</a> 186<a class="navbar-item " href="/tag/password/">Password</a> 187<a class="navbar-item " href="/tag/todo/">Todo</a> 188<a class="navbar-item " href="/tag/type/">Type</a> 189<a class="navbar-item " href="/tag/crop/">Crop</a> 190<a class="navbar-item " href="/tag/note/">Note</a> 191<a class="navbar-item " href="/tag/quote-machine/">Quote-machine</a> 192<a class="navbar-item " href="/tag/search/">Search</a> 193<a class="navbar-item " href="/tag/checklist/">Checklist</a> 194 </div> 195 </div> 196 197 <div class="navbar-item has-dropdown is-hoverable"> 198 <a class="navbar-link " href="/tag/menu/"> 199 Menu 200 </a> 201 <div class="navbar-dropdown is-boxed"> 202<a class="navbar-item " href="/tag/dropdown/">Dropdown</a> 203<a class="navbar-item " href="/tag/click-/">Click</a> 204<a class="navbar-item " href="/tag/router/">Router</a> 205<a class="navbar-item " href="/tag/switch/">Switch</a> 206<a class="navbar-item " href="/tag/tab/">Tab</a> 207<a class="navbar-item " href="/tag/pagination/">Pagination</a> 208<a class="navbar-item " href="/tag/navigation/">Navigation</a> 209 210 <a class="navbar-item " href="/tag/menu/">Menu</a> 211 </div> 212 </div> 213 214 <div class="navbar-item has-dropdown is-hoverable"> 215 <a class="navbar-link " href="/tag/menu/"> 216 Components 217 </a> 218 <div class="navbar-dropdown is-boxed"> 219<a class="navbar-item " href="/tag/emoji/">Emoji</a> 220<a class="navbar-item " href="/tag/progress/">Progress</a> 221<a class="navbar-item " href="/tag/toggle/">Toggle</a> 222<a class="navbar-item " href="/tag/accordion/">Accordion</a> 223<a class="navbar-item " href="/tag/notification/">Notification</a> 224<a class="navbar-item " href="/tag/qr-code/">Qr-code</a> 225<a class="navbar-item " href="/tag/documentation/">Documentation</a> 226<a class="navbar-item " href="/tag/avatar/">
226Avatar</a> 227<a class="navbar-item " href="/tag/modal/">Modal</a> 228<a class="navbar-item " href="/tag/loading/">Loading</a> 229<a class="navbar-item " href="/tag/clock/">Clock</a> 230<a class="navbar-item " href="/tag/calculator/">Calculator</a> 231<a class="navbar-item " href="/tag/calendar/">Calendar</a> 232<a class="navbar-item " href="/tag/pomodoro/">Pomodoro</a> 233<a class="navbar-item " href="/tag/lazyloading/">Lazyloading</a> 234 235 </div> 236 </div> 237 238 <div class="navbar-item has-dropdown is-hoverable"> 239 <a class="navbar-link " href="#"> 240 More 241 </a> 242 <div class="navbar-dropdown is-boxed"> 243<a class="navbar-item " href="/tag/games/">Games</a> 244<a class="navbar-item " href="/tag/miscellaneous/">Miscellaneous</a> 245<a class="navbar-item " href="/tag/animation/">Animation</a> 246<a class="navbar-item " href="/tag/color/">Color</a> 247<a class="navbar-item " href="/tag/cookie/">Cookie</a> 248<a class="navbar-item " href="/tag/open-source/">Open-source</a> 249<a class="navbar-item " href="/tag/blog/">Blog</a> 250<a class="navbar-item " href="/tag/pull/">Pull</a> 251<a class="navbar-item " href="/tag/app-tag/">App-tag</a> 252<a class="navbar-item " href="/tag/chat/">Chat</a> 253<a class="navbar-item " href="/tag/social/">Social</a> 254<a class="navbar-item " href="/tag/event-handling/">Event-handling</a> 255<a class="navbar-item " href="/tag/fetchapi/">Fetchapi</a> 256<a class="navbar-item " href="/tag/background/">Background</a> 257<a class="navbar-item " href="/tag/outside/">Outside</a> 258<a class="navbar-item " href="/tag/task/">Task</a> 259<a class="navbar-item " href="/tag/client/">Client</a> 260 </div> 261 </div> 262 263 264 </div> 265 266 <div class="navbar-end"> 267 <div class="gxx_search" id="bdcs"> 268 <form action="//www.google.com/search" method="get" target="_blank"> 269 <input type="search" name="q" value="" placeholder="Search" /> 270 <input type="hidden" name="ie" value="UTF-8" /> 271 <input type="hidden" name="oe" value="UTF-8" /> 272 <input type="hidden" name="hl" value="en" /> 273 <input type="hidden" name="domains" value="vuejsexamples.com" /> 274 <input type="hidden" name="sitesearch" value="vuejsexamples.com" /> 275 <input type="submit" class="gxxicon" value="" /> 276 277 </form> 278 </div> 279 280 281 </div> 282 </div> 283 </div> 284</nav> 285 286<section class="ggcontent hidden-xs">
287<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5680150941998747" crossorigin="anonymous"></script>
287 288<!-- 1150 --> 289<ins class="adsbygoogle" 290 style="display:inline-block;width:1130px;height:250px" 291 data-ad-client="ca-pub-5680150941998747" 292 data-ad-slot="3755220091"></ins>
293<script> 294 (adsbygoogle = window.adsbygoogle || []).push({}); 295</script>
295 296</section> 297 298<div class="site"> 299<div class="site-content"> 300 301<div class="container"> 302 <div class="row"> 303 <div class="content-column col-lg-8"> 304 <div class="content-area"> 305 <main class="site-main"> 306 <article 307 class="post page no-image single u-shadow"> 308 <header class="post-header"> 309 <h1 class="post-title"> 310 About 311 </h1> 312</header> <div class="post-wrapper"> 313 <div class="post-content u-text-format"> 314 <div class="kg-card-markdown"><h2 id="vuejsexamples">Vue.js examples</h2> 315<p>A nice collection of often useful examples done in Vue.js.</p> 316<p>On the whole, Vue.js examples is an embodiment of satisfying my own requirements with the idea of making it useful to the wider community of Vue developers.</p> 317<p>vuejsexamples's goal is to be the go-to website for developers looking for vue libraries and open source projects to get their work done.</p> 318<h2 id="contacts">Contacts</h2> 319<p>Should you have any ideas for improvements, enquiry for partnerships or any other feedback, please don't hesitate to contact us. All ideas are more than welcome. Thanks!</p> 320<p>Email: <img src="/content/images/2021/11/codetea.png" alt="codetea"></p> 321</div> 322 </div> 323 </div> 324 </article> 325 </main> 326 </div> 327 </div> 328 </div> 329</div> 330</div> 331<footer class="site-footer"> 332 <div class="container"> 333 <div class="footer-inner"> 334 335 <div class="copyright "> 336<a href="/about/">About</a> | <a href="/contact/">Contact</a> | <a href="/privacy-policy/">Privacy Policy</a> | <a href="/submit-project/">Submit A Project</a> 337 </div> 338 <div class="social"> 339 </div> 340 <div class="copyright"> 341 Powered by <a href="https://vuejsexamples.com" target="_blank">Vue.js Examples</a> 342 </div> 343 </div> 344 </div> 345</footer></div>
346<script src="/assets/js/jquery-3.2.1.min.js"></script>
vendor: 1 bytes, line 346
346
347<script src="/assets/js/jquery.githubRepoWidget.min.js?v=4882949ed5"></script>
vendor: 1 bytes, line 347
347
348<script src="/assets/built/main.min.js"></script>
vendor: 1 bytes, line 348
348
349<script type="text/javascript" src="/assets/js/prism.js?v=4882949ed5"></script>
vendor: 1 bytes, line 349
349
350<script src="/assets/js/nav.js?v=da972"></script>
350 351
352<script defer data-domain="vuejsexamples.com" src="https://stat.vuejsexamples.com/js/plausible.js"></script>
vendor: 1 bytes, line 352
352
353<script async src="https://umami.vuejsexamples.com/script.js" data-website-id="9a621c3e-3d33-4ea7-b272-40034c27ec42"></script>
vendor: 1 bytes, line 353
353
354<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"5f0643796c26434faeadcc9ffe77d41c","r":1,"spa":2}' crossorigin="anonymous"></script>
vendor: 1 bytes, line 354
354
355<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a440ef48de7080ba',t:'MTc5MDkxNTAzNw=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
355</body> 356</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.