Make it clear where code snippets go

[jfkquality]

Perhaps I'm spoiled by Treehouse, but the TOH tutorial is extremely frustrating in that code snippets are shown all by themselves without any context as to where they go in the file. For a newbie this is maddening and adds unnecessary frustration to the already increasingly complex amount of material. I've found it to be so in prior parts but Part 4 (https://angular.io/docs/ts/latest/tutorial/toh-pt4.html) is the worst so far. I hate to be forced to "cheat" and look at the code files at the end of the chapter.

[Foxandxss]

I am super curious to see what does Treehouse provide that you are missing here. Any opportunity to improve is always good.

[mccumb01]

@Foxandxss :

Same suggestion & possibly either typo or a bug report ...

Most snippets include sufficient "landmarks" to orient you & help place the relevant code properly (e.g. it shows the export class line immediately above/below/surrounding the snippet) , other times not.

Also, while most of the tutorial is very clear & detailed, sometimes steps are ambiguous or unclear.

Ex: Section 5. Services

The example above (https://angular.io/docs/ts/latest/tutorial/toh-pt4.html) in particular says:

In app.component.ts, where you cut the HEROES array, add an uninitialized heroes property:

This is not accurate, because "where you cut the HEROES array" was above outside the class declaration. You need to put the new property below inside the class declaration.

Right file, unclear location, and perhaps not an obvious instruction for people new to OOP/Typescript. Also, this link still says "pt4," but it's now "pt5."

Ex: Section 6. Routing

Begins with Configure Routes

Create a configuration file for the app routes... Define the first route as a route to the heroes component: //Route Code Snippet

Is this a NEW file?? It says to do this in src/app/app.module.ts. Where is the RouteModule.forRoot() code in the 1st example actually supposed to go?

Then Make the router available: In the next lines you do the exact same work to import the RouteModule again, and add the exact same code to the imports array, again in app.module.ts, the same file.

So do you put this code in 2 places as stated, or just 1? I kept getting different errors despite replicating the example - eventually it just worked.

This particular functionality gets refactored shortly thereafter anyway, so it's not critical. But this is supposed to be the introduction to routing, and it is rather confusing. https://angular.io/tutorial/toh-pt5#configure-routes

Thanks~

[Foxandxss]

@mccumb01 I would love you open a new issue with that information at angular/angular so we don't forget about it :)