Friday, November 30, 2018

Development Environment

Now that we have Source Control all set up it is time to prepare our development environment.

NODE

Please read this entire section before you jump in and install NODE!

Node is a JavaScript runtime that uses Chrome's V8 engine. Because we are intending on building a cross-platform solution in JavaScript we need a runtime or hosting environment for our development efforts. Node is a perfect choice. It is the preferred choice of most JavaScript open source projects and has a monumental open source library of modules and plug ins that can be used in our project.

In order to promote as much common cross-functionality as possible I am trying to find common ground between all the associated pieces of the puzzle. The Chrome V8 engine is used in the Chrome browser as well as Node, Cordova (for Android), Electron and a host of other tools such as unit test runners. More about this later.

Node features the Node Package Manager commonly referred to as NPM. NPM is installed automatically with Node so there is no need to install it separately. In fact, each version of Node carries a specific version of NPM so it is wise to let Node manage this automatically.

NPM is used to download and manage JavaScript packages or libraries for your project. It saves package information in a special file in the root of your project called package.json. This file is a JSON data file. The cool thing about this system is that you include the package.json file in your source repository but you do not include the file folder node_modules where all the downloaded packages live. When you git a project from a source code repository you must run 'npm install' before you begin development. This invokes the npm package manger that reads the package.json file and automatically downloads and updates the packages in the projects node_modules file folder.

Node is a great system, however it has had it's share of challenges along the way. Earlier versions (3 and earlier) used a nested package system when storing the packages in the node_modules folder. This was problematic on windows machines as it created extremely long paths to dependent packages. This was changed in version 4 to a flat style system where all packages are stored in the root of the node_modules folder. In my opinion this is a much better solution and the Aurelia project depends on this so we will be using Node version 4 or higher in this project.

Node also had some issues with the way the package.json file managed the installed versions of packages. I am not going to dive into specifics but you can read more about it here. To solve this problem, newer versions of Node also include a file called package-lock.json. This file is used together with the package.json file to better resolve package versions in your project. This file should also be included your source control check in.

Before you install Node on your computer you should consider using Node Version Manager (NVM).
NVM is installed on your computer and you use it from a command line to manage the version of Node installed on a folder by folder basis. This means you can have different versions of Node installed for each project you work on. In my opinion this is a game changer. It is very easy to get caught up in the node package version vortex ... spending countless hours trying to resolve conflicts so you can run your project. I know from experience!

Please use NVM ... you will thank me later!

We will be using the latest LTS version of Node for this project so lets go ahead and install it now.

  1. Install NVM following the instructions here.
  2. Open a command prompt in your new project directory (your working folder that contains the source files NOT the source code repository that contains the data store)
  3. Install the LTS version of Node (I'm using 10.14.0 at the time of this writing)
  4. Now run the 'nvm use 10.14.0' command.
  5. Voila ... Your project folder is now using Node 10.14.0
  6. You can double check by running 'node -v' command.

Code Editors

Your choice for a code editor is about as personal as it gets. This project contains JavaScript, HTML, CSS, LESS and JSON. Most code editors can handle these or have plugins to help. I highly recommend Visual Studio Code. It is free and has a great open source system of plugins to help you in virtually any language. It also automatically picks up your GIT settings and helps you manage your source code. Another interesting little tidbit - It is written in Javascript and hosted in Electron ...

The project contains a Cordova wrapper so that you can build and deploy to mobile devices. You don't have to do that but it is one of the features of my project so I'm sure you are eager to try it.

You will need either Android Studio (which I recommend) or at a minimum the JDK8 to be able to build for Android devices. This can be installed on both Macs and Windows but I have found some issues trying to build and deploy Android solutions from a MAC so I recommend a Windows machine.

You will need a MAC and XCODE to be able to build for IOS devices. You will also need an Apple Developer Account to sign your apps.

All of the above mentioned software is free with the exception of the Apple Developer Account which costs about $100 USD annually.

 Data Base

In keeping with the free theme for this project I decided to use a NOSQL db for this project. I chose MONGODB because of it's small footprint, easy install, and ease of use. It also stores all it's data in JSON which is perfect for a Javascript project which also uses a lot of JSON data. Again ... trying to find common ground in the project.

You can easily convert this project to use any DB of your liking, but if you want to download the project and fire it up "out of the box" so to speak you will need a mongo db available.

Ready to Go

Once you have all of the above installed and working you should be able to clone Applewood from The Smoke House Project on GitHub, follow the "Getting Started" directions in the README and start building and deploying to mobile and desktops of your choosing.

NOTE: I am in the process of upgrading the Applewood repository as I am writing this blog, so if you run into any issues or experience any problems please feel free to reach out to me anytime.

NEXT STEPS

The rest of this blog is going to focus on how I structured the project, modifications and changes to the build scripts and code and other required steps to achieve the "one code - build anywhere" functionality.  

Please comment if you are interested in a particular detail, or would like me to blog about setting up your environment or solving a configuration issue. I won't promise, but I will try to accommodate your requests.











No comments:

Post a Comment