Your Choice JavaScript News

Vue News Saturday, February 17

Vue News TLDR / Table of Contents

  • A Progressive Web Application with Vue JS, Webpack & Material Design [Part 4]
    • This article is part of a serie that aims to build a basic but complete Progressive Web Application with VueJs, Webpack & Material Design, step-by-step and from scratch. If you have not yet read it…
    • progressive web app, firebase console, firebase storage, firebase service, firebase auth
  • Creating an Express API
    • Or just venturing into the Back End
    • minimalist web framework, good thing, Zend Framework, lan ideal, backend language
  • vuejs/vue-class-component
    • vue-class-component – ES / TypeScript decorator for class-style Vue components.
    • Vue lifecycle hooks, Vue instance data, class member methods, ,
  • Replacing jQuery With Vue.js: No Build Step Necessary
    • Did you know that you can incorporate Vue into your project the same way that you would incorporate jQuery — with no build step necessary? Let’s cover some common use cases in jQuery and how we can switch them over to Vue, and why we’d even want to do so….
    • Vue, Sarah Drasner, jQuery, ,
  • YouTube
    • Step by step guide to host Angular, React and Vue.js applications on AWS. Find the previous video at https://www.youtube.com/watch?v=D6qB7MEFOe0 Link to pres…
    • Vue.js applications, previous video, step guide, pres, Angular
  • BaffourAdu/Vue-Blog
    • Vue-Blog – This a a basic blog built with Vue.js using dummy api’s from https://jsonplaceholder.typicode.com/
    • GitHub, home, developers, code, projects
  • In the part 2, we use Firebase as a database but Firebase also offers a free storage service!
  • Go to the firebase interface storage tab rules and update the rules to make the storage public.
  • This manipulation is only good for prototyping, to secure the storage, use the firebase auth.You remenber the firebase service?
  • We will add an new line to this service to export the storage service from firebaseWe can now import this service in our components to access to our firebase storage.Ok lets try to upload a picture, you should see your picture in your firebase console.Add the picture to thelistAfter the…
  • We learned:how to use MediaStream to access to the native camera;how to store picture in Firebase with VueFire;Lets have a look to our Progressive Web App checklist:One of our last requirements is not yet met.

Tags: progressive web app, firebase console, firebase storage, firebase service, firebase auth

  • My goal is not to tell which language or framework is good or bad, but each person has a preference, you’re not wrong if you don’t like some technology.
  • Besides that technologies, I ventured into something more agile, so I tried to learn Ruby on Rails and Laravel, although I appreciate it so much, I realized, in that moment, I still didn’t found the appropriate framework and lan ideal for me.
  • In spite of the frustrations I have not stopped participating in some project or learning something new, all the knowledge acquired I will be reused in other time.
  • For some time I started studying about Node.js and the Express framework and how in a few steps I can create an API.
  • Obviously, with Node.Js and Express you can do several cool things, the introduction of this subject is precisely for you to research more and not be afraid to learn something new:D – – As I mentioned at the beginning of the article, people have different preferences, and in my case…

Tags: minimalist web framework, good thing, Zend Framework, lan ideal, backend language

  • You may also want to check out the and decorators provided by provides helper function to use mixins in class style manner.
  • expects a callback function as the 1st argument and the callback will receive following arguments: – – If you use some Vue plugins like Vue Router, you may want class components to resolve hooks that they provides.
  • For that case, allows you to register such hooks: – – Note that you have to register the hooks before component collects class properties as Vue instance data by instantiating the original constructor under the hood.
  • If you define an arrow function as a class property and access in it, it will not work.
  • This is because is just a proxy object to Vue instance when initializing class properties: – – You can simply define a method instead of a class property in that case because Vue will bind the instance automatically: – – To take consistency between the decorator behavior of Babel and…

Tags: Vue lifecycle hooks, Vue instance data, class member methods, ,

  • To capture information as a user types, heres how we would do this in jQuery and Vue side by side: – – See the Pen jQuery capture information from a form input by Sarah Drasner (@sdras) on CodePen.
  • See the Pen Vue capture information from a form input by Sarah Drasner (@sdras) on CodePen.
  • We can see this in the updated version of the last example, where the information is gathered on an enter keypress: – – See the Pen jQuery capture information from a form input- on enter by Sarah Drasner (@sdras) on CodePen.
  • See the Pen Vue capture information from a form input, enter key by Sarah Drasner (@sdras) on CodePen.
  • Below is an example of coordinating showing something based on the presence of user input: – – See the Pen Show button based on content Vue by Sarah Drasner (@sdras) on CodePen.

Tags: Vue, Sarah Drasner, jQuery, ,

    Tags: Vue.js applications, previous video, step guide, pres, Angular

      Tags: GitHub, home, developers, code, projects

      Top Vue Courses

      Vue JS 2: From Beginner to Professional (includes Vuex) (1,798 students enrolled)

      By Bo Andersen
      • How to build advanced Vue.js applications
      • How to build single page applications (SPA)
      • Understand the theory and how Vue works under the hood
      • How to manage state in large applications with Vuex
      • Communicating with servers with HTTP
      • Use modern tools for developing and building applications (e.g. webpack)

      Learn more.


      Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex) (38,295 students enrolled)

      By Maximilian Schwarzmüller
      • Build amazing Vue.js Applications - all the Way from Small and Simple Ones up to Large Enterprise-level Ones
      • Understand the Theory behind Vue.js and use it in Real Projects
      • Leverage Vue.js in both Multi- and Single-Page-Applications (MPAs and SPAs)

      Learn more.


      The Ultimate Vue JS 2 Developers Course (3,882 students enrolled)

      By Anthony Gore
      • Understand all Vue concepts from beginner to advanced
      • Build three real world applications using Vue.js utilising every Vue feature
      • Use the Vuex statement management library
      • Write basic Vue with ES5 and also modern Vue with ES6
      • Setup VueJS environment with development tools including Webpack
      • Create a universal application with server-side rendering
      • Use popular plugins from the Vue ecosystem like vue-router and vue-resource
      • Cutting-edge features like Single File Components, Render functions and Server-Side Rendering

      Learn more.


      Vue JS 2.0 - Mastering Web Apps (52,495 students enrolled)

      By David Katz
      • Build entire Vue JS, VueRouter, and Vuex applications from scratch.
      • Develop apps that deal with APIs and web requests.
      • Create web apps with a full authentication service, and real-time database.

      Learn more.


      Learn by Doing: Vue JS 2.0 the Right Way (1,437 students enrolled)

      By Dejan Stošić
      • Build your own VueJS application of any size
      • Plan and structure your project
      • Write maintainable code
      • Use smart development tools like vue-cli

      Learn more.