Home / Vue.js / Miscellaneous

Vue 3 Playground packed with all the new features

Vue 3 Playground stands as a learning project for those who want to get familiar with the new features of Vue 3.
Information
Category: Vue.js / Miscellaneous
Watchers: 6
Star: 147
Fork: 8
Last update: Jul 15, 2020
Resource links
https://blacksonic.github.io/vue-3-playground/
https://github.com/blacksonic/vue-3-playground

Vue 3 Playground

Build Status Dependencies Status

Vue 3 Playground stands as a learning project for those who want to get familiar with the new features of Vue 3.

The project aims to include all the new features. If you find something missing please create an issue/PR.

The application is a shopping cart where you can alter the name, price and quantity of the products and recalculates the total price based on the items and used coupon.

The playground is available also in online version.

If you want to switch to the Typescript folder uncomment the link to the Typescript main file in inndex.html and comment out the Javascript main file.

Vue 3 Playground

New APIs covered

The Typescript equivalents can be found in the src-typescript folder (file names are the same).

Further articles/videos

Contributing

This project is under development. If you have any idea how to include more and more new features of Vue 3 in this application feel free to share your ideas in an issue/PR.

Contents

    AvdLee A Swift playground explaining the concepts of the new Combine framework
    ole An Xcode playground demonstrating the new features in in Swift 4.2.
    ole An Xcode playground showcasing the new features in Swift 4.0.
    reiinakano GAN Playground - Experiment with Generative Adversarial Nets in your browser. An introduction to GANs.
    catc CSS-only tooltip packed with a variety of features.
    revng PageBuster - dump all executable pages of packed processes.
    twostraws An Xcode playground that demonstrates the new features introduced in Swift 4.1.
    twostraws An Xcode playground that demonstrates the new features introduced in Swift 5.0.
    twostraws An Xcode playground that demonstrates the new features introduced in Swift 5.1.
    twostraws An Xcode playground that demonstrates the new features introduced in Swift 5.2.
    COMBINE-lab A bit-packed k-mer representation (and relevant utilities) for rust
    Leopotam Packer for already packed textures at unity game engine - up to 3 times less space.
    filipedeschamps Playground for the fire effect from DOOM. Really simple algorithm and all experiments are welcome!
    ibhavikmakwana Playground app for Flutter
    TIGERB easy-vue TIGERBeasy-vue a easy example using the vue to implement easy web with vue 2.0, vuex 2.0, vue-router 2.0, vue-infinite-scroll 2.0, vue-progressbar 2.0 by TIGERB
    aleksanderwozniak Highly customizable, feature-packed Flutter Calendar with gestures, animations and multiple formats
    needim It's a mini editable, customizable playground for web
    x1unix Better Go Playground powered by React and Monaco editor
    g-plane Playground of swc.
    swc-project The swc playground.
    JakeLin A Swift Playground to play around Combine
    Share this repo

    Related Repos


    Miscellaneous
    8
    A PWA e-commerce page, using Vue.js, Nuxt.js, Tailwind CSS & Snipcart.
    MartaBento Vue PWA Organic Fruit Shop Intro The main goal was to create a Progressive Web Application with Nuxt.js, Vue & Snipcart. Tailwind was used has the CSS
     
    Miscellaneous
    6
    Vue 3, small component library inspired by Windmill react ui
    Sorion Windmill Vue UI The component library for fast and accessible development of gorgeous interfaces. This is still a work in progress! Install npm i @sor
     
    Miscellaneous
    8
    a frontend from modern stack, gulag written with nuxt 🏘
    Varkaria Table of Contents Table of Contents What is guweb-nuxt? Requirements The team What is guweb-nuxt? guweb is the front-facing appearance of the osu! ser
     
    Miscellaneous
    5.8k
    Status Page for monitoring your websites and applications with beautiful graphs, analytics...
    statping Statping - Web and App Status Monitoring for Any Type of Project View Wiki | Demo | iPhone | Android API | Docker | EC2 | Mac | Linux | Windows Statpi
     
    Miscellaneous
    6
    A SuperCollider documentation picker.
    davidgranstrom telescope-scdoc.nvim A SuperCollider documentation picker. Requirements scnvim telescope Installation Install the plugin use { 'davidgranstrom/telesco
     
    Miscellaneous
    3
    The Colorado BSD User Group website redesign
    loralighte cobug.org Build Setup # install dependencies $ npm install # serve with hot reload at localhost:3000 $ npm run dev # build for production and launch
     
    Miscellaneous
    4
    Movie Recommendation Web Page
    sang712 1학기 파이널 프로젝트 요구사항 axios요청은 최소화하고 Vuex Getters 혹은 Actions로 대체하기(AccountsCard.vue{followers,followings},) -> 주의점! getters와 달리 부르는게 store.dispatch('actio
     
    Miscellaneous
    4
    vite vue3 and shiny
    timelyportfolio Vue 3 + Vite + Shiny This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 <script setup> SFCs, check out t
     
    Miscellaneous
    3
    Extensible command+k interface for Vue 3 applications. Inspired by timc1/kbar.
    bytebase vue-kbar Extensible command+k interface for Vue 3 applications. Inspired by timc1/kbar. Caution! This is still WIP. Screenshots TBD How to use 1. Inst
     
    Miscellaneous
    11
    A collection of projects made with Supabase – Websites, Mobile Apps, SaaS, Plugins and mor...
    zernonia Made with Supabase ⚡ A collection of projects made with Supabase Websites, Mobile Apps, SaaS, Plugins and more! View Demo · Report Bug · Request Featu
     
    Miscellaneous
    1.7k
    ⌨️ A curated list of Open Source Mechanical Keyboard resources.
    BenRoe The goal of this repository is to collect mechanical keyboard related projects
     
    Miscellaneous
    4
    find the closes match to your color from the tailwind css color pallet
    moh-slimani Tailwind CSS color matcher put your Hex Code here and edit the ranges to find the closes match to your color from the tailwind css color pallet, I'm u
     
    Miscellaneous
    3
    My personal blog using Nuxt and TailwindCSS
    ricko-v kodekembar Demo: Here Build Setup # install dependencies $ npm install # serve with hot reload at localhost:3000 $ npm run dev # build for productio
     
    Miscellaneous
    3.2k
    A keyboard input capturing utility in which any key can be a modifier key.
    dmauro Keypress Version 2.1.5 Keypress is a robust keyboard input capturing Javascript utility focused on input for games. For details and documentation, ple
     
    Miscellaneous
    3
    Quickly design LinkedIn visual polls like the once you see on other's profiles, for FREE✨
    FotieMConstant upvote Quickly design LinkedIn visual polls like the once you see on other's profiles, for FREE ✨ Topics Resources Project setup npm install Compiles