Codementor Events

Diary of an Awesome VueJS App - Prologue (Before you Start)

Published Jul 28, 2018
Diary of an Awesome VueJS App - Prologue (Before you Start)

Image Credits: (Sabe.io)[https://sabe.io/tutorials/getting-started-with-vue-js/hero.png]

Before you Start

Have you ever wondered where we were before our birth? What we probably did or the space we occupied? If we were in another dimension different from the one we exist in now, or we're just stuck in between. You could wonder on... For me, I was waiting for the right developer to build me! 
Different developers have always wondered about what it's like to build me and the processes I undergo before I become a working app. Some even fear working with me or even hate working on me...But seriously? I'm not so tough an app to build, if you have the right mentor and follow instructions strictly or simply the official docs. 
For anyone interested in me, I'm gifting you my diary to help you find your way around working on how to build more VueJs apps like me. This is aimed at teaching the fundamentals of VueJS, the possible use cases, architecture, structure, best practices (data management, routing e.t.c), cross platform development, problems encountered during development and solutions (in reference to questions on stackoverflow and laracast), most questions commonly asked about VueJS and most of what it takes to build an awesome VueJS application and even equip you with all that it takes to implement that your game changing idea with VueJS. 
Episodes of my diary will be released fortnightly, so get ready to develop awesome VueJS apps of your own!

To get the best of this series, I'll suggest you do 4 things;

  1. You'll assume to be the Abdulsamii(the developer who built me) in this series and hence try out everything Abdulsamii did.
  2. You'll have your environment set up, so that I can put you through this in the simplest way regardless of what kind of operating system you're using.
  3. You'll clone the repository for this series. To follow along with any episode, simple clone the repository by running
 git clone https://github.com/jalasem/diary-of-an-awesome-vuejs-application.git diaryOfaVueApp
 cd diaryOfaVueApp
 git checkout episode0
 npm install
 npm run serve

You should replace prologue with the relevant episodeNo (episode number). This will enable you to follow along with this series easily.
4. In a bid to make this series as helpful as possible, I urge you to feel free to create an issue on this series repo. The issue could be about a topic you'll like me to talk about, problems you face currently that you'll like me to treat or better ways to implement a solution to a problem discussed here. You'll be duly acknowledged, so just feel free to contribute please! If you've got questions as regards any topic treated in the series, feel free to ask via the comment section, I'm sure Abdul Samii will try his best to answer them, if you've got the right answer before he gives an answer, feel free to suggest or give your answer. You can also book a session with him to take a look at your own existing VueJS code. Think of it, you could be using VueJS already but you probably need help with architecture, structure, code review or even management of tasks within your team, he can help with that as well. 😉

Environment setup

  • To create me , Abdul Samii set up his environment. He installed NodeJS . You can do the same by visiting Nodejs.org to get instructions on how to install. If you still have issue with installation, indicate in the comment section. You'll surely get help.
  • Install Vue CLI. To install vue-cli, simply run the command below in your terminal
 npm i -g @vue/cli

if this doesn't work or throws an error add sudo like so

 sudo npm i -g @vue/cli

To enjoy this series, you could use either the vue-cli directly in your terminal or Vue GUI, AbdulSamii finds the GUI sweet and quite easy to follow along since it's visual and not all commands. To open it, simply run

 vue ui

and boom Vue GUI will be opened in your browser 🚀

If this is your first time of coming across Vue GUI, checkout AbdulSamii's recent post on it or the official documentation.

And so, we've come to the end of today's episode (Before you start), watchout for the next episode (Birthday 🐣🎂) where I will be discussing how I was born while taking you through the process of creating your own app as well. We'll also look into options and possible customizations when creating a VueJS application and setting it up based on your requirements.
So, till the next episode....

PS: I'll be updating the contents of any of the episodes as required. This could be an enhancement, improvement based on my findings or suggestions from experts or an adjustment in respect to your constructive comments.

Peace from Abdulsamii
Write your code for good

Discover and read more posts from Abdul-Samii Ajala
get started
post commentsBe the first to share your opinion
Show more replies