This project contains the entire frontend of the PayFriends application. This application was designed to meet the company's frontend development test PICPAY.
This application is also available at the links:
- Frontend https://case-picpay-frontend.netlify.app/
- Storybook https://case-picpay-frontend-storybook.netlify.app/
- API https://case-picpay-api.herokuapp.com/
// access credentials are:
{
user: "usuario@gmail.com",
password: "usuario"
}
At first, in the project directory, you need run:
// installing the dependencies
yarn install
// run json-server on http://localhost:8000/
yarn start:api
you can see the server in production at the link: https://case-picpay-api.herokuapp.com/.
// run project on http://localhost:3000/
yarn start
run the app in the development mode by opening http://localhost:3000 to view it in the browser. The page will reload if you make edits.
if you prefer, you can see the frontend application in production at the link: https://case-picpay-frontend.netlify.app/.
// creates .jest-test-results.json file to @storybook/addon-jest
yarn test:generate-output
// runs storybook on http://localhost:6006/
yarn storybook
// runs the linter in all components and pages
yarn lint
// runs jest to test all components and pages
yarn test
// runs jest in watch mode
yarn test:watch
// creates a new component. to create a Button component, for example, run: yarn generate Button
yarn generate component <ComponentName>
// creates a new icon. to create a Arrow icon, for example, run: yarn generate icon Arrow
yarn generate icon <IconName>
// build project
yarn build
Learn how to install yarn
through the official documentation.
To make queries on external API's.
To give more power to my JavaScript code.
To manage the application routing system.
To stylize my app as components.