Lesson 2 – What the files do

This second video shows what all of the files in the Angular 2 application do and what they are for. Here are the highlights:

  1. This lesson gives us a brief rundown of TypeScript which I already mentioned in a previous post. If you’re using Visual Studio then you don’t have to worry about this much because Visual Studio has a built-in TypeScript transpiler.
  2. All of the Angular 2 program files are contained in the app directory. Bucky has two subdirectories called js and ts, respectively (I used the full names: javascript and typescript). The directory naming becomes more important as I get further into the development. More on that, later.
  3. Don’t mess with the files in the js (javascript) folder. They’re generated automatically (by your development environment).
  4. Map files provide a roadmap between the JavaScript and TypeScript files, used for debugging. Bucky didn’t tell us exactly how that works but I’m hoping that he will get to it.
  5. The node_modules folder contains the files that were downloaded by npm or Visual Studio (depending on your download method). Again, don’t mess with them. They “just work”. Actually, here’s another thing that I discovered – when using Visual Studio don’t actually include them in your project, either! If you do then Visual Studio will attempt to transpile them and that can lead to a myriad of headaches. They don’t need transpiling as they’re already converted to JavaScript.
  6. The typings folder contains rules to translate TypeScript to JavaScript. My project doesn’t use it so maybe it will be important, later. The point being that it doesn’t seem to be immediately necessary. Apart from the rule of development that Bucky and I seem to agree on “never repeat yourself”, I add the philosophy of “keep it simple” so the more stuff I can not include the better.
  7. The .gitignore file is used by Git for publishing. Files and directories listed in this file are not published. Again, not relevant to my purposes unless I intend to publish my source code (which I don’t).
  8. index.html is self-explanatory. In my attempts to make an MVC version this would be the view (or layout page if I ever get that far).
  9. package.json is a JSON file that contains the files to download and include. I mentioned this in an earlier post.
  10. README.md – this is another Git specific file and is the text that’s included on Git when the files are uploaded. Again, not relevant to my purposes.
  11. tsconfig.json – I took Bucky’s and used it for the purpose of separating my TypeScript files from the JavaScript files into their respective typescript and javascript folders (which Visual Studio respects, which is handy). If you don’t care about this then this file is dispensable. Bucky only talks about this functionality. The rest might become important, later.
  12. typings.json – Like the packages.json file, it defines what to include in the Typings directory which we don’t use.









Leave a Reply

Your email address will not be published. Required fields are marked *