MarvelCatalog

This project it's using:

Features

Comic list
Character list
Comic details
Filters

Project structure

The structure of this project it's based on folder-by-feature and you will be able see some advantages bellow (try to take a look in the project structure first).

src/
- app/
  - core/
  - character/
  - comic/
  - shared/
    - component/
    - constant/
    - interface/
    - utils/
assests/
- fonts/
environments/

In a structure like that you will easily indentify the systeam features and easily find a features files (e.g when you have a problem in a feature), just with files names you are able to know what that file contains (e.g .spec will have tests), all your features code will be separeted and organized (e.g each feature being a module), make it easy the lazy loading strategy, etc. You can read more about LIFT guidelines and folder-by-feature

How to run

Since this project use the Marvel API, you have to follow some steps before run the application:

Sign in on Marvel API
Allow your domain to acess the API (if you are using localhost you also have to allow it)

In case you are running local

Create a new environment.local.ts on src\environments folder with the following structure:

export const environment = {
  production: false,
  marvelPublicKey: 'YOUR_PUBLIC_MARVEL_API'
};

Just run using npm run start:hmr or ng serve --configuration=local

In case you are running in a server

You will have to setup your public Marvel API in you enviroment
Create a script or use the envConfig.js, on root folder, to fill the marvelPublicKey on Angular enviroment file with YOUR public Marvel API 6.1. The environment.prod.ts is already setup with a marvelPublicKey: '$API_KEY'
Deploy it 7.1. Take a look on Heroku

Tests

100% .ts file coverage with unitary tests
Componet tests just to the main flow

Running tests

npm run test to generate code coverage
- open coverage\marvel-catalog\index.html to see the coverage
ng test just run all the tests

Evando16/marvel-catalog