hstarorg / web3-tools

The web tools collection.

web3-tools

A website for many web3 tools.

Backend(Nest.js)

Installation

$ pnpm install

Running the app

# development
$ pnpm run start

# watch mode
$ pnpm run start:dev

# production mode
$ pnpm run start:prod

Test

# unit tests
$ pnpm run test

# e2e tests
$ pnpm run test:e2e

# test coverage
$ pnpm run test:cov

Frontend(/web folder)

Install tailwind

https://tailwindcss.com/docs/guides/vite

# Install and init tailwindcss
pnpm i -D tailwindcss postcss autoprefixer
pnpx tailwindcss init -p

# 2. Configure your template paths in tailwind.config.js

# 3. Add the Tailwind directives to your CSS

shadcn-ui

# Install
pnpx shadcn-ui@latest init 

# Add Component
pnpm shadcn-ui@latest add card
# or
pnpm add-c <component name>

Icons

• https://lucide.dev/icons

Vite Template

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

• @vitejs/plugin-react uses Babel for Fast Refresh
• @vitejs/plugin-react-swc uses SWC for Fast Refresh

Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:

• Configure the top-level parserOptions property like this:

export default {
  // other rules...
  parserOptions: {
    ecmaVersion: 'latest',
    sourceType: 'module',
    project: ['./tsconfig.json', './tsconfig.node.json'],
    tsconfigRootDir: __dirname,
  },
}

• Replace plugin:@typescript-eslint/recommended to plugin:@typescript-eslint/recommended-type-checked or plugin:@typescript-eslint/strict-type-checked
• Optionally add plugin:@typescript-eslint/stylistic-type-checked
• Install eslint-plugin-react and add plugin:react/recommended & plugin:react/jsx-runtime to the extends list