2022-03-14 15:21:26 +00:00
# Vega front-end monorepo
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
The front-end monorepo provides a toolkit for building apps that interact with Vega, as well as the apps themselves.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
This repository is managed using [Nx ](https://nx.dev ).
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
# 🔎 Applications in this repo
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### [Block explorer](https://github.com/vegaprotocol/frontend-monorepo/tree/master/apps/explorer)
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
The Vega block explorer provides an interface that allows users to search for and see transactions, blocks, parties, assets, markets and more on the Vega chain.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### [Trading UI](https://github.com/vegaprotocol/frontend-monorepo/tree/master/apps/trading)
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
The trading interface built based on a component toolkit. It will provide a way for participants to interact with markets and provide resources for others to build additional open-source user interfaces.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
# 🧱 Libraries in this repo
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### [UI toolkit](https://github.com/vegaprotocol/frontend-monorepo/tree/master/libs/ui-toolkit)
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
The UI toolkit contains a set of components used to build interfaces that can interact with the Vega protocol, and follow the design style of the project.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### [Tailwind CSS config](https://github.com/vegaprotocol/frontend-monorepo/tree/master/libs/tailwindcss-config)
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
The Tailwind CSS config contains theme that align default config with Vega design system.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
# 💻 Develop
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### Build
2022-02-11 13:56:28 +00:00
Run `nx build my-app` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
2022-03-14 15:21:26 +00:00
Run `nx serve my-app` for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### Running tests
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
Run `nx test my-app` to execute the unit tests with [Jest ](https://jestjs.io ), or `nx affected:test` to execute just unit tests affected by a change.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
Similarly `nx e2e my-app` will execute the end-to-end tests with [Cypress ](https://www.cypress.io )., and `nx affected:e2e` will execute just the end-to-end tests affected by a change.
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
### Further help with Nx
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
Visit the [Nx Documentation ](https://nx.dev/getting-started/intro ) to learn more.
2022-02-11 13:56:28 +00:00
2022-04-20 11:08:18 +00:00
# Vegacapsule
## Explorer
Follow the following steps to start using a local network with the Vega Explorer:
1. Prepare vegacapsule. Follow the [Vegacapsule instructions ](https://github.com/vegaprotocol/vegacapsule#quick-start )
1. Build the explorer frontend application
1. Start the explorer frontend application with the `.env.vegacapsule` env file
1. Go to [http://localhost:3000 ](http://localhost:3000 ) in your browser
2022-03-14 15:21:26 +00:00
# 📑 License
2022-02-11 13:56:28 +00:00
2022-03-14 15:21:26 +00:00
[MIT ](./LICENSE )