Instructions

Create a file .env an add this:

VITE_MARVEL_PUBLIC_KEY=963def3c08d9f47810421fccaf47fe67
VITE_MARVEL_PRIVATE_KEY=b7bc7c4f10cf6e297811f98a4e1a21efb83d47c8
VITE_MARVEL_BASE_URL=https://gateway.marvel.com:443/v1/public

Installing Node Modules

yarn install

Starting the Application

yarn run dev

Building for Production

yarn build

For devs

Exectue prettier --write.

yarn run prettier

Responsive.

Image	Description
	Web.
	Mobile.
	Mobile.

Architecture

API Design

Endpoint	Page	Description
/	src/views/HomeView/HomeView.jsx	Home page.
/comic	src/views/ComicView/ComicView.jsx	List of comic view.
/comic/:id	src/views/ComicDetailsView/ComicDetailsView.jsx	Comic details view.
/character	src/views/CharacterView/CharacterView.jsx	List of character view.
/character/:id	src/views/CharacterDetailsView/CharacterDetailsView.jsx	Character details view.

Api	Description
src/api/marvelApiIntance.js	Axios instance marvel api + interceptors

Layout	Description
src/layout/MvCard/MvCard.jsx	Card component.
src/layout/MvFooter/MvFooter.jsx	Footer component.
src/layout/MvHeader/MvHeader.jsx	Header component.
src/layout/MvLink/MvLink.jsx	Link component.
src/layout/MvLoading/MvLoading.jsx	Loading component.
src/layout/MvMain/MvMain.jsx	Main component.
src/layout/MvPagination/MvPagination.jsx	Pagination component.
src/layout/MvSection/MvSection.jsx	Section component.

Redux	Description
src/redux/actions/changeCharctersOffsetAction.js	Change offset in pagination action.
src/redux/actions/getCharacterDetailAction.js	Get characters details action.
src/redux/actions/getCharactersAction.js	Get all characters action.
src/redux/actions/getComicDetailAction.js	Get comics details action.
src/redux/actions/getComicsAction.js	Get all comics action.
src/redux/actions/setLoadingAction.js	Set status loading action.
src/redux/reducers/changeCharctersOffsetReducer.js	Pagination offset state reducer.
src/redux/reducers/characterDetailReducer.js	Characters details state reducer.
src/redux/reducers/charactersReducer.js	Characters state reducer.
src/redux/reducers/comicDetailReducer.js	Comics details state reducer.
src/redux/reducers/comicsReducer.js	Comics state reducer.
src/redux/reducers/rootReducers.js	Combine reducers.
src/redux/store.js	Store redux.
src/redux/types.js	All types.

Routes	Description
src/routes/RouteProvider/RouteProvider.jsx	React router dom provider.

Style	Description
src/style/style.scss	Sass style manage all imports.

views	Description
src/views/CharacterDetailsView/CharacterDetailsView.jsx	Character details view.
src/views/CharacterView/CharacterView.jsx	Character view.
src/views/ComicDetailsView/ComicDetailsView.jsx	Comics details view.
src/views/ComicView/ComicView.jsx	Comics view.
src/views/HomeView/HomeView.jsx	Landing page.

---