The ability to reply to discussions is limited to PRO members. Want to join in the discussion? Click here to subscribe now.

Create an Angular 2 Hello World Component

Create an Angular 2 Hello World Component

2:32
A Hello World application in Angular 2 requires you to understand concepts around bootstrapping, modules, and components. The bootstrapping system allows you to decide which module and platform you’ll use when your app starts up as well as which components should be shown first. The Angular 2 modules define which features you’ll want to include so you can have fine control over your final project size. The Angular 2 Components then become a simple definition of a template with variables.
Watch this lesson now
Avatar
egghead.io

A Hello World application in Angular 2 requires you to understand concepts around bootstrapping, modules, and components. The bootstrapping system allows you to decide which module and platform you’ll use when your app starts up as well as which components should be shown first. The Angular 2 modules define which features you’ll want to include so you can have fine control over your final project size. The Angular 2 Components then become a simple definition of a template with variables.

Avatar
Rubem

Hello, When running the code example on my machine, I get the message:

"TypeScript transpiling to CommonJS, consider setting module: "system" in typescriptOptions to transpile directly to System.register format"

Where should I go to set the module system?

Thanks

In reply to egghead.io
Avatar
Matthew Payne

How does the first video start the project. I believe that is missing. Where does the systemjs.config.ts come from. That is not in my project if a start with "ng new project-name"

In reply to egghead.io
Avatar
suse0

Hi Matthew,
did you get an answer or did you solve it? I've got the same problem, too.

In reply to Matthew Payne
Avatar
Zac

Hey Susanne and Matthew,
The systemjs.config file is for the initial configuration of an angular app. Here is a link to the documentation if you want read up on it more.

"systemjs.config.js provides information to a module loader about where to find application modules, and registers all the necessary packages. It also contains other packages that will be needed by later documentation examples."

In reply to suse0
Avatar
Smilja

I believe he started this project using the "QuickStart seed", referenced in the official Angular 2 guide.
You can see how to set it up here: https://angular.io/docs/ts/latest/guide/setup.html

In reply to Matthew Payne
Avatar
Bill

A quick video to say this is where the student should start is to be expected. I would ask the authors to please remedy this. Also just checked, the code in this video starts with a different set of starter source than what the angular seed provides. The angular seed already has the main my-app component in place with main.js, etc.

Avatar
thiagoaos

The course Get Started with Angular 2 use angular-cli that generate angular 2 project structure with webpack.
Now, in the 'second' course, use system js and don't use angular cli.

Confusing organization. Very bad.

Avatar
Ahmad Moussawi

Is it possible to create a standalone component in Angular2 like we did in Vuejs?

Avatar
Mosapeizer

it is still helpful to me to know how ng-cli save my time , thx a lot.

Avatar
Sports

Cannot find this systemjs.config.js after doing ng new AngularHelloWorld.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?