Story of My First Project Using Vue JS

Kausar Ahmed Pial
Invariant Telecom
Published in
2 min readDec 2, 2018

Introduction to Vue

When I joined my new office Invariant Telecom, I didn’t have much experience with any front-end framework like Vue, Angular or React. My knowledge then was limited to jQuery only. But since this company prefers to build all their web apps based on VueJS, my principal duty here was to solve the problem in the ongoing project using VueJS. So it was a challenge for me to work on this project as I had to learn the framework first and then use the new knowledge to solve complex problems.

Motivation to learn

As I mentioned above, I was a novice in Vue and had to adopt this new technology within a short time period. So I felt I should find some motivation and discover something interesting about Vue which will push me to learn more about it. Then I started to watch the VueJS conferences online and utilize my daily commute time by listening to VueJS podcasts. It worked for me very well.

About the project

The project I was working on was a single page dashboard application that retrieves and provides data using API. Its purpose was to create users, manage them and display various reports using charts.

Learned during completion

VueJS is a progressive and reactive framework that helps to build single page applications. First I went through the VueJS official documentation and tried to grasp an overview of the framework. And this documentation proved to be extremely beneficial for me since it explained the core functionality with ease. Then I practiced some real-life projects to gain confidence in VueJS. While working on those projects, I learned about many Vue elements including instance, templating, binding, event handling, component, props, slots, transitions etc. Then I started to contribute to the main project confidently.

Meanwhile, I gathered knowledge about the Vue-Router and Vue-Resource as well.

Resources that helped me

  1. Vue Js Documentation — https://vuejs.org/v2/guide/
  2. Vue JS Cheatsheet — https://vuejs-tips.github.io/cheatsheet/
  3. VueConf EU Youtube — https://goo.gl/aMvDGR
  4. Views on Vue Podcast — https://devchat.tv/views-on-vue/
  5. Vue.js 2.0 In 60 Minutes by Traversy Media — https://goo.gl/BZUKwL
  6. Learn Vue 2 in 65 Minutes by DesignCourse — https://goo.gl/3ra3Tk
  7. Vue Router — https://router.vuejs.org/
  8. Vue Resource package — https://github.com/pagekit/vue-resource
  9. Vue JS 2 — The Complete Guide (incl. Vue Router & Vuex) by Maximilian Schwarzmüller — https://www.udemy.com/vuejs-2-the-complete-guide/

--

--

Kausar Ahmed Pial
Invariant Telecom

Geeky Front-End Developer, Passionate about new web trends. Currently working with VueJS.