Vue Project Intro

Back To Home

Setting up a bundled "Vue Project" with Vue CLI allows you to have your project split into separate files, which helps you keep track of everything. It is easy to make this work, because programs you download will do almost all of the work for you. BUT it does require you to spend some time installing everything and setting up a development environment.

This section will walk you through all of the pieces of this environment.

1. City of Philadelphia Network, Proxy, and Firewall Considerations

If you work for the City of Philadelpiha, before you start trying to install things, make sure you read this so you have a way to troubleshoot installation errors you may get while on the city's proxy:

• Setting your System Variables
• Setting the npm registry

2. Installations

Use the following links to download and install the following free software:

OPTIONAL:

• Command line tool: ConEmu
• Text Editor: Atom or VSCode
• Rapid Environmental Editor
• Vue.js Devtools browser plugin
• Graphical User Interface (GUI) for Git and Github: SourceTree

NOT OPTIONAL:

• Chrome or Firefox
• Versioning: Git
• Enabling Javascript Package System: Node
• Command line program for working with packages: npm or Yarn
• Browser Based program for developing sites: Vue CLI

3. Setting up a Project

• Creating A Vue Project
• The Default Vue Project
• Try Out Vue Devtools
• Setting Up Your Git Environment
• Putting the Vue Project into Github
• Vue Project Package Setup
• Vue Project Folder Setup
• Creating a Vue Configuration File
• How to Handle Passwords in a Vue Project
• Using Free and Pro Font Awesome Icons
• Get a Gatekeeper Key