{"id":319,"date":"2023-01-13T05:00:00","date_gmt":"2023-01-13T13:00:00","guid":{"rendered":"https:\/\/www.angulartraining.com\/daily-newsletter\/?p=319"},"modified":"2023-01-10T15:51:51","modified_gmt":"2023-01-10T23:51:51","slug":"how-to-generate-documentation-for-angular-applications","status":"publish","type":"post","link":"https:\/\/www.angulartraining.com\/daily-newsletter\/how-to-generate-documentation-for-angular-applications\/","title":{"rendered":"How to generate documentation for Angular applications?"},"content":{"rendered":"\n

Documenting software is hard. Not only that, maintaining software documentation is even more complicated and often forgotten.<\/p>\n\n\n\n

What’s the solution, then? What about using an automated solution that:<\/p>\n\n\n\n

    \n
  1. Generates documentation from code comments and does not require a Wiki or any third-party software.<\/li>\n\n\n\n
  2. Generates said documentation automatically and can be part of your build process.<\/li>\n\n\n\n
  3. Gives metrics and feedback to developers to encourage them to write more documentation.<\/li>\n<\/ol>\n\n\n\n

    Such a solution exists. It’s called Compodoc<\/a>. Compodoc can generate a Javadoc-like website from all the comments written in your application (you can see an example of such documentation here<\/a>):<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    Compodoc can be installed globally with npm: <\/p>\n\n\n

    npm<\/span> install<\/span> -g<\/span> @compodoc<\/span>\/compodoc<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    Or you can add it locally to a single Angular project by running the ng add<\/code> schematic in your project folder:<\/p>\n\n\n
    ng<\/span> add<\/span> @compodoc<\/span>\/compodoc<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    npx<\/span> compodoc<\/span> -p<\/span> tsconfig<\/span>.doc<\/span>.json<\/span><\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    The above command creates a static HTML website documenting your entire application with all modules\/components\/pipes\/directives\/services.<\/p>\n\n\n\n
    Documenting software is hard. Not only that, maintaining software documentation is even more complicated and often forgotten. What’s the solution, then? What about using an automated solution that: Such a solution exists. It’s called Compodoc. Compodoc can generate a Javadoc-like website from all the comments written in your application (you can see an example of […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,17],"tags":[],"class_list":["post-319","post","type-post","status-publish","format-standard","hentry","category-angular","category-tools"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts\/319","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/comments?post=319"}],"version-history":[{"count":3,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts\/319\/revisions"}],"predecessor-version":[{"id":323,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts\/319\/revisions\/323"}],"wp:attachment":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/media?parent=319"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/categories?post=319"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/tags?post=319"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
    My favorite feature is the documentation coverage statistics<\/a> that show which parts of the application are well-documented and which are not, using a report similar to test coverage reports that developers are familiar with.<\/p>\n","protected":false},"excerpt":{"rendered":"
    Then you can create a config file to decide which files to include<\/a> in the documentation (for instance, you might want to exclude test, and Compodoc is ready to run with a single command:<\/p>\n\n\n