Results summary component

Community feedback

• 

  Johnny Gérard•640

  @johnnygerardPosted over 1 year ago

  Hello Pranav,

  Even if it works, your solution is overly complicated.

  There is really no need to use observables, the HttpClient, a service class or a separate data.json file.

  Instead, the score and category data can be embedded directly in a component class.

  For small SVG icons, it is better not to use the static assets folder. Otherwise, your page will send 4 extra HTTP requests when it loads. I recommend using inline SVGs. This can be done with SVG templates.

  Now, it is true that there is a slight overhead because of the extra components. It is a trade-off between performance and readability.

  0
• Account deleted

  Centralize SVG files, scores, and categories using a single service class. This can help reduce code duplication and overall code size.

  1.Place all the SVG files in the assets folder provided by Frontend Mentor. This folder is commonly used to store static files in an Angular project.

  2.Instead of creating separate components for each SVG file, create a single service class specifically for managing SVG, score, and category data. This service class will handle retrieving the data from the JSON file and providing it to the components that need it.

  3.Include a data.json file in the assets folder, which contains an array of objects representing the SVG files, scores, and categories. For example, each object in the array should include properties such as "name" and "path" to identify and locate the SVG file.

  4.Implement a method in the service class to fetch the data from the JSON file.

  5.Once the JSON data is retrieved, store it in a variable within the service class to make it accessible to other components. Consider using RxJS BehaviorSubject or a similar technique to allow components to subscribe to changes in the SVG, score, and category data.

  0