Start now with Vue JS and create a new Project
Articles,  Blog

Start now with Vue JS and create a new Project


You want to do cool stuff with Vue JS? I show you today how to create a new vue js
project with the awesome new user interface. Stay tuned. Hello creative developer, welcome to this
video. Nice to see you. Before we start. Please subscribe my channel. If you want, I share my experience about web
development with you. If you have any questions or you have a topic
that you would like to see in one of my next videos, you can leave a message on YouTube
or contact me on Twitter. Let us create a brand new vue js project. But first you need some tools. Install the current version from Node.js. You can find the installer on this page. The link is in the video description. After that, you need vue cli. Scroll down on this website and you find the
command for the node package manager. Remember, all links are in the video description. Open your terminal and install the current
version with the command. ‘npm install -g @vue/cli’ This will take a few minutes. And now, you can create a new project, in
your current folder, with the command. vue create and the name of your project or you can use the user interface with the
command ‘vue ui’ In this case I show the user interface
After you type in the command and press enter, the user interface starting in your default
browser. In the Dashboard you can find all your projects,
my is currently empty. For create a new project, click the NEW button
and you can select your project folder. Next, you can assign a project name. And I use the default options. In the next step you setup the project configuration. You can choose the default configuration or
what I’m using now, manually configure the project. Here you can select some useful plugins. For the beginning I keep it simple and select
this one for supporting older browsers and the css pre-processor option. Then you can pick a pre-processor. I prefer this one for scss. And finally you can create your new project. As last step you can set the actually configuration
as preset. I want to do that and assign a title. And now the project is being created. This takes a few minutes. After the project has been created, you are
in the dashboard of the project. Under the navigation on the left side you
will find some options for the project. On this selection you can navigate to the
main dashboard. A list of all your projects is displayed. You can open the project folder in your default
IDE. And on this little point you can find a nice
shortcut, where you can start it for development or create a build for production mode. I want to start this for development mode,
with this awesome green button here. This takes a few seconds. And you can visit now your new project in
the browser. I hope this tutorial will help you. If any questions are still open, just leave
a comment. Don‘t forget to subscribe and hit the bell
for all notifications, to not miss any new video. Have fun with Vue JS. See you later. Bye.

2 Comments

  • Webnoob

    You want to learn more about web design and web development? Then you are exactly right here. Stay tuned and subscribe.

    If any questions are still open or you have a topic that you would like to see in one of my next videos, you can leave a message or contact me on Twitter.

Leave a Reply

Your email address will not be published. Required fields are marked *