Welcome to billpayment-history-table!

Hi! It's a package for manage the existing sales by sender for billpayment. Get biller information from database and it manages validations such as additionalfee and min/max amount to send. Also it allows hide a sales unnecessary.

• build: This folder contains the transpiled code. It is auto-generated by the command 'yarn build'.

• coverage: This folder contains the code coverage. It is auto-generated by the command 'yarn lint'.

• dev-test: This folder contains the development environment.

• doc: Contains the project's documentation like user story, user case and diagranmet ...

• node_modules: These directory is generated automatic by use 'npm install'.

• src: Contain your logic of application.

• src/assets: Contain your resources like images, fonts...

• src/core/*: Contain your all rules business.

• src/core/business/graphql: Contain the configuration about GraphQL.

• src/core/business/rules: Contain all rules business.

• src/core/business/services: Contains calls to external services.

• src/core/components: It contains the component that usually returns HTML/JSX.

• src/core/utils: They are the files transversals to the logic.

• src/example: Contain the exaplme documenting for use of your application.

• src/styles: Contain your files of styles.

• src/test: They are the logic of the files of testings.

• src/index.js: It's application's start.

See into to package.json

It's the file where are installs all packages required for your application. It will be generated by the command : npm init The dynamic is, configuring the project with:

• Webpack: It is the library for will add the static elements (css, images) in the moment transpilation of the project. https://webpack.js.org/
• Babel: It's library for will transpilation your code jsx to javascript. https://babeljs.io/
• Jest: It's the library for will transpilation your code jsx to javascript. https://jestjs.io/
• Eslint: It can validate your code quality in React. https://eslint.org/

How to publish the project

Follow the steps below:

• npm login
• npm build
• npm publish or npm publish --scope=organization name
• npm unpublish --scope=organization --force
• "--scope": is only necessary if the package name in the package.json file does not have the company name as a prefix. Always the company name must be with the "@-2 at the beginning and a separator "/" at the end in the package.json file: @viamericas/demo-react-to-npm-package

   {
  	 "name": "@viamericas/billpayment-history-table",
  		....
  }

How to work with environments

-npm run start:dev -npm run start:qa -npm run start:stg

-npm run build:dev -npm run buidl:qa -npm run build:stg

If you are going to deploy in production

# In your package project:
npm build
npm publish
# Remember the company name in the package.json or --scope in npm command

# In the contnent project:
npm install @company_name/package_name # If is a private business package
npm install package_name # If is a public business package

Validate weight of package

you can run the next commands to see the result of the bundle :

• npm run build:debug
• npm run analizedependences

Frequent conflicts

When you get "Invalid hooks call" error on development using link

If you are trying to test your package with hooks using npm link, maybe you can get the following error:

To solve that, you must follow the next steps:

1. unlink the package project from content project
2. run npm link ../contentproject/node_modules/react from package project
3. build package project
4. link again the package project from content project more info : https://reactjs.org/warnings/invalid-hook-call-warning.html#duplicate-react
5. Another possible solution is to run the project in development mode, like this: yarn start: dev

When you get an error with npm link

When working with the components, keep in mind the following conflicts:

1. Conflict:

A developing A package cannot be called (via npm link) to another developing B package.

Solution:

Finish a package A first and publish it in the npm account (npm publish --scope = company) and in package B that is in development you are installed package A already published (npm and package A)

2. Conflict:

If you are using the “base package” with the multilanguage functionality, you cannot “link” to the B package in development.

Solution

Apply the same solution from the previous point.