Osmosis Frontend 👩‍🔬⚗️🧪

Development 💻

Our frontend is built with the following tools:

• TypeScript: type checking
• React: ui
• Tailwind CSS: styling, theming
• Next.js: scaffolding/SSR/CDN/SEO
  • We deploy on Vercel for optimization (CDN, regions)
• lerna: code organization; mono-repo management and libs release

Deployment 🚀

Start web server

yarn && yarn build && yarn start

Contributing 👨‍💻

We welcome and encourage contributions! We recommend looking for issues labeled with "good-first-issue".

Make sure node >= 16 and yarn is installed.

1. Install deps

yarn

2. Build app

yarn build

3. Run local server at localhost:3000

yarn dev

Frontier 🤠

To reduce duplicated effort, master branch is used to deploy the frontier app as well. The frontier deployment has NEXT_PUBLIC_IS_FRONTIER env var set to true. If making updates to frontier, please target the master branch. Frontier assets are configured in packages/web/config/ibc-assets.ts.

Develop

To develop with frontier configuration, use:

yarn build:frontier && yarn dev:frontier

Deploy

To deploy frontier (the env var will be set for you):

yarn build:frontier && yarn start:frontier

Otherwise the non-frontier commands can be used with the env var set to true.

Testnet

Testnet version of the frontend uses NEXT_PUBLIC_IS_TESTNET=true.

Dev:

yarn build:testnet && yarn dev:testnet

Deploy:

yarn build:testnet && yarn start:testnet

Releases

Release tags are for the published npm packages, which are every package except for the web package. Updates to the app are released incrementally way via deployments from master branch.

Localization 🌎🗺

Have a change you want to make with our translations? We have a frontend for updating localizations in our app easily, all you need is a GitHub account. Coming soon: creating new language profiles from this frontend.

https://inlang.com/editor/github.com/osmosis-labs/osmosis-frontend