This is a ReactJS app that uses the SWAPI, for practice/education purpose.
It retrieves and displays films using the free API above.
It consists of three pages, and therefore it uses routes with authorization validation.
There is state management for both films and authorization.
To achieve that, I used redux-sagas along with redux-toolkit.
For testing, both Cypress and Jest are used.
To open the Jest menu where you can run all tests, you must type
npm run test
To run all Cypress tests in headless mode, you must type
npm run cy:headless
and for the open mode, you must run
npm run cy:open
The results of all the tests, can use the coverage functionality.
To run all the Jest tests with coverage, you must run the command
npm run test:cov
ℹ️ The output folder is coverage-jest.
To run all the Cypress tests with coverage, you just have to run all the tests in headless mode
npm run cy:headless
ℹ️ The output folder is coverage-cypress.
To display the Jest or Cypress coverage in text format, you must type one of the commands below
npm run report:jest
npm run report:cy
To combine both Jest and Cypress coverage reports into one and display it in text format, you must type the command
npm run report:all
ℹ️ The output folder for the combined report is the coverage-merged.
This project uses Create React App as the building tool.
To run the dev server, you must type
npm run start
ℹ️ The dev server's default port is 3000.
16.15.1.
start command with the one below
Set REACT_APP_ENV=dev && react-scripts -r @cypress/instrument-cra start
In order to build the app, you must type
npm run build
The font used is the Star Jedi provided by DAFONT FREE.
It is free for commercial use, and you can find it here.