YFD Governance dApp Frontend

Installation

Use the package manager yarn to install the dependencies.

yarn install

Usage

localhost:3000

yarn start

unit/integration tests

yarn test

end to end tests

yarn e2etest

Packages

Core packages needed for Terra Development

@terra-money/feather.js @terra-money/wallet-provider v4 [@terra-money/wallet-types] () [@terra-money/use-wallet] ()

Routing

React Router

Styling

Saas Design

Icons

Google Material Symbols

<span class="material-symbols-outlined">face</span> <!-- Outlined -->
<span class="material-symbols-rounded">face</span>  <!-- Rounded -->
<span class="material-symbols-sharp">face</span>    <!-- Sharp -->

Font Awesome

• Remove this package

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {
  solid,
  regular,
  brands,
  icon
} from '@fortawesome/fontawesome-svg-core/import.macro';

export default function Icon() {
  return (
      <FontAwesomeIcon icon={solid('bell')} />
    );
}

React Icons

• remove this package

Chakra Icons

• remove this package

Charts

Chart.js

Utility

Date-FNS

Development

typescript-plugin-css-modules

Testing

Playwright

React-testing-library

Jest

Lint/Format

Eslint

Prettier

Lint-staged

Pre-Commit Hooks

Husky

Override Webpack

React-app-rewired

Notes

This repo has minimal setup done in the Eslint and Prettier files with the intention that the developer using the template can set up the rules how they would like

Eslint Rules

Prettier Rules

Most projects tend to use the AirBNB style guide but this template uses minimal rules to allow the user the ability to to customize it as they want.