angular-cli

A 5-post collection

Angular 2: Application Settings using the CLI Environment Option

Application wide settings can be a long conversation when starting a new application. Here are just a few questions when some of my teams started this conversation: Do we use ENV variables? What about manual bootstrap? Configuration files? Should we get them from the server? Using angular-cli & environment.ts The new angular-cli have the concept of different environments like development (dev) and production (prod). When creating a new application with the cli ng my-app and /environments folder is a part of the scaffold which contains the environment files. . ├── environment.ts ├── environment.prod.ts . . and then within the /src/app folder is and environment.ts file. Here are the contents: export const environment = { production: false }; As you might imagine, the...


Angular 2 : Application Settings using fetch

In a recent post, the CLI and environment.ts were used to determing the current running environment and what settings to use. However, there were some shortcomings to this approach not only in the fact that only development and production were supported but others mentioned as well. In Angular 1.x using manual bootstrap, where the application would need to do some work prior to starting up, was such a need that it has a home in the docs. However, in Angular 2 this pattern is not established. I started looking and asking, "What is the manual bootstrap for A2?" Of course, thanks to naming "bootstrap" is awful when paired with almost anything web. Nevertheless, there is a question and...


Angular 2 : Giving Your CLI a Server

...be sure to read Angular 2:Re-Quickstart with the CLI Although the CLI includes a number of great features, the deployment of the application is a story or issue that is still under discussion (Production deploy #326). What is the right server, what are the features etc. A simple static server for Angular applications should be able to handle a few things: static files - like that pesky fav.ico, images, css, and javascript files deep links - routing to specific portion of our SPA maybe something simple like compression In this case, node.js using Express fits the bill. Let's see how to add it to the quickstart generated in the previous post. First, grab the index.js and...


Angular 2 : A Re-Quickstart using the CLI

The Angular team created a quickstart which is a great starter project template and I've covered that in another post which shows adding an express server to that to get you up and running with a more complete quickstart at Angular 2 : Getting Off the Starting Line. Both are great starters, but static templates. This Re-Quickstart* is using the CLI (command line interface) to create the same application in a fraction of the time. angular-cli The angular-cli is the new command line interface for creating Angular 2 applications. Well, It's much more than that. It creates applications, follows the best practice or approved style guide, sets up the tests, runs the tests and much more. Head over to cli.angular....


Angular 2 : Continuous Integration to Azure using Codeship and the Angular CLI

Getting an application written is the first challenge, however having proper tests, running those tests in a continuous integration pipeline as well as deploying the application to your cloud host can be a task to setup. Here is a quickstart to create an application using the angular-cli, using codeship to build and run the test using the angular-cli and the push to a website on Azure. Using the angular-cli we can quickly create an application by executing the commands... ng new quickstart-ng-cli cd quickstart-ng-cli ng serve Once that is scaffolded out, create your GitHub repo and check in the source. For a full angular-cli walk through look at my post Angular 2: A Re-Quickstart using the CLI Codeship Go to...