Set up a modern Cosmos app by running one command ⚛️
cosmos-kit.mp4
# install
npm install -g create-cosmos-app
# run one command
create-cosmos-app
> name: my-app
cd my-app
yarn && yarn dev
# now your app is running on localhost:3000!
You don’t need to install or configure cosmjs, keplr, nextjs, webpack or Babel.
Everything is preconfigured, ready-to-go, so you can focus on your code!
- ⚡️ Connect easily to keplr + keplr mobile via wallet connect
- ⚛️ Sign and broadcast with cosmjs stargate + cosmwasm signers
- 🛠 Render pages with next.js hybrid static & server rendering
- 🎨 Build awesome UI with Cosmos Kit and Chakra UI
- 📝 Leverage chain-registry for Chain and Asset info for all Cosmos chains
🎥 Checkout our videos to learn to learn more about create-cosmos-app
and tooling for building frontends in the Cosmos!
Checkout cosmos-kit for more docs as well as cosmos-kit/react for getting cosmjs stargate and cosmjs signers.
To create a new app, you may choose one of the following methods:
npm install -g create-cosmos-app
Then run the command:
create-cosmos-app
we also made an alias cca
if you don't want to type create-cosmos-app
:
cca
npx create-cosmos-app
npm init cosmos-app
yarn create cosmos-app
Explore examples!
cca --example
cca --name mysendtokensapp --example --template send-tokens
cca --name mystaketokensapp --example --template stake-tokens
cca --name myvoteproposalapp --example --template vote-proposal
cca --name myibctransferapp --example --template ibc-transfer
uses osmojs
cca --name myosmoapp --example --template osmosis
or the cosmwasm example:
cca --name osmowasm --example --template osmosis-cosmwasm
uses juno-network
cca --name myjunoapp --example --template juno
uses stargazejs
cca --name mystarsapp --example --template stargaze
cca --name mywasmapp --example --template cosmwasm
cca --name cca-tailwind --example --template tailwindcss
Because the nature of how template boilerplates are generated, we generate yarn.lock
files inside of nested packages so we can fix versions to avoid non-deterministic installations.
When adding packages, yarn workspaces will use the root yarn.lock
. It could be ideal to remove it while adding packages, and when publishing or pushing new changes, generating the nested lock files.
In the root, to remove all nested lock files:
yarn locks:remove
When you need to remove/generate locks for all nested packages, simply run yarn locks
in the root:
yarn locks
🛠 Built by Cosmology — if you like our tools, please consider delegating to our validator ⚛️
Code built with the help of these related projects:
- @cosmwasm/ts-codegen for generated CosmWasm contract Typescript classes
- @osmonauts/telescope a "babel for the Cosmos", Telescope is a TypeScript Transpiler for Cosmos Protobufs.
- chain-registry Cosmos chain registry and chain info.
- cosmos-kit A wallet connector for the Cosmos.