Vue.js Chart.js Tutorial to Export Bar,Pie Charts to PDF Documents Using jsPDF & html2canvas Library in Javascript Full Project For Beginners

  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

    vue-chartjs-exporter     #Installation     npm i vue-chartjs-exporter     Usage Import vue-chartjs-exporter:     import Exporter from "vue-chartjs-exporter";   Get the charts to be exported: let bar…

Continue Reading Vue.js Chart.js Tutorial to Export Bar,Pie Charts to PDF Documents Using jsPDF & html2canvas Library in Javascript Full Project For Beginners

Build a Vue.js Youtube API Video Thumbnail Extractor or Grabber From URL Web App in Browser Using Javascript Full Project For Beginners

  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

      <div id="app"> <input type="text" autocomplete=false v-model="url"> <div v-if="youtube_thumbnail_downloader"> <button @click="download(thumbnailpreview)" >Preview</button> <img :src="thumbnailpreview" alt="thumbnailpreview"> </div> <div v-if="youtube_thumbnail_downloader"><button @click="download(thumbnailhq)" >Highest resolution</button><img :src="thumbnailhq" alt="thumbnailhq"></div> <div v-if="youtube_thumbnail_downloader"><button @click="download(thumbnailmq)" >Medium resolution</button><img…

Continue Reading Build a Vue.js Youtube API Video Thumbnail Extractor or Grabber From URL Web App in Browser Using Javascript Full Project For Beginners

Vue.js Material Design Mini Song MP3 Music or Sound Player in Browser Using Javascript Full Project For Beginners

  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

    <link href="https://fonts.googleapis.com/css?family=Bitter:400,700&display=swap&subset=latin-ext" rel="stylesheet" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"/> <div class="wrapper" id="app"> <div class="player"> <div class="player__top"> <div class="player-cover"> <transition-group :name="transitionName"> <div class="player-cover__item" v-if="$index === currentTrackIndex" :style="{ backgroundImage: `url(${track.cover})` }" v-for="(track,…

Continue Reading Vue.js Material Design Mini Song MP3 Music or Sound Player in Browser Using Javascript Full Project For Beginners

Build a Vue.js Piano Music MP3 Keyboard Player and Recorder in Browser Using Vanilla Javascript Full Project For Beginners

  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> <div id="app"> <div class="audioplayer" v-for="s in sounddata"><audio v-bind:data-num="s.number" preload="auto"> <source v-bind:src="s.url" type="audio/ogg" /> </audio></div> <div class="center_box"> <h2>Vue.js Piano Project 7</h2> <div class="keyboard"> <div class="pianokey"…

Continue Reading Build a Vue.js Piano Music MP3 Keyboard Player and Recorder in Browser Using Vanilla Javascript Full Project For Beginners

Vue.js Tutorial to Play MP3 Sound or Music Files From URL inside Browser Using Bootstrap 4 and Animate.css in Javascript Full Project For Beginners

  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/flatly/bootstrap.min.css"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/> <div class="heading"> <h1>Play Sound</h1> <h4>Playing audio files with Vue.js</h4> </div> <div class="container" id="app"> <div class="form-group"> <label> <button class="btn btn-primary…

Continue Reading Vue.js Tutorial to Play MP3 Sound or Music Files From URL inside Browser Using Bootstrap 4 and Animate.css in Javascript Full Project For Beginners

Build a Vue.js MP3 Sound or Music Player Component With Playlist Web App in Browser Using Javascript Full Project For Beginners

  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

      <link href="https://unpkg.com/ionicons@4.5.5/dist/css/ionicons.min.css" rel="stylesheet"> <div id="app"> <div class="container"> <div class='row'> <template v-for='song in songs'> <div class="col-4 col-md-3 col-lg-2 song" > <div class='wrapper'> <div class="overlay-play text-center" v-if="isPlaying && (currentSong.id…

Continue Reading Build a Vue.js MP3 Sound or Music Player Component With Playlist Web App in Browser Using Javascript Full Project For Beginners

Vue.js Image Uploader + Cropper and Base64 Converter Using HTML5 Canvas in Browser Using Javascript Full Project For Beginners

    <main class="app-container"> <h1>VueJS + HTML5 Canvas</h1> <span class="sub">Image upload, resize, crop, and base64 converter</span> <div id="app"> <image-uploader width="300px" height="200px"> </image-uploader> <section class="text-area-section"> <textarea v-model="sharedData.imageData"> </textarea> </section> </div> </main>…

Continue Reading Vue.js Image Uploader + Cropper and Base64 Converter Using HTML5 Canvas in Browser Using Javascript Full Project For Beginners

Vue.js Tutorial to Disable Form Input Fields Props Conditionally in Browser Using Javascript Full Project For Beginners

    To remove the disabled prop, you should set its value to false. This needs to be the boolean value for false, not the string 'false'. So, if the value for validated is either…

Continue Reading Vue.js Tutorial to Disable Form Input Fields Props Conditionally in Browser Using Javascript Full Project For Beginners

Build a Vue.js Camera Webcam Capture Selfie App in Browser Which Downloads (PNG,JPG) Images to Computer Using Javascript Full Project For Beginners

      <div id="app" class="web-camera-container"> <div class="camera-button"> <button type="button" class="button is-rounded" :class="{ 'is-primary' : !isCameraOpen, 'is-danger' : isCameraOpen}" @click="toggleCamera"> <span v-if="!isCameraOpen">Open Camera</span> <span v-else>Close Camera</span> </button> </div> <div v-show="isCameraOpen…

Continue Reading Build a Vue.js Camera Webcam Capture Selfie App in Browser Which Downloads (PNG,JPG) Images to Computer Using Javascript Full Project For Beginners

End of content

No more pages to load