The app that lets you pay, basically, anyone.
An example payments application demonstrating integrations of various Stellar features and SEPs in a user-facing product.
⚠️ CAUTION: Although BasicPay is a full-fledged application on Stellar's Testnet, it has been built solely to showcase Stellar functionality for the educational purposes of this tutorial, not to be copied, pasted, and used on Mainnet.
This isn't just a codebase, it's a fully functioning testnet wallet! You can check it out and use it here: https://basicpay.pages.dev
This application was built to coincide with a written tutorial, located in the Stellar documentation. This tutorial is a "nearly comprehensive" guide to building the features in this app. Following along with the tutorial and this source code repository, you can get a solid understanding of building an application on the Stellar network.
Find the start the tutorial here: https://developers.stellar.org/docs/building-apps/example-application-tutorial/overview
Clone the repository:
git clone https://github.com/stellar/basic-payment-app.git
Change into the repository app:
cd basic-payment-app
Install dependencies and start the development server.
yarn install
yarn dev
You can now visit the local development site in your browser at http://localhost:5173
We've worked to document everything in this repo, so start exploring wherever you like. We'd suggest looking into the following areas:
The heart and soul of this application is interacting with the Stellar network.
Most of the Stellar interactions take place through the use of SEPs (Stellar
Ecosystem Proposals). These interactions are coded in the
/src/lib/stellar/sep*.js
files.
More generic Stellar functionality are located in the same directory:
/src/lib/stellar/horizonQueries.js
for querying information from the network/src/lib/stellar/transactions.js
for building different kinds of Stelar transactions
This application is built using SvelteKit. We don't want to make this much of a "SvelteKit Tutorial," but here's what you may want to explore:
We primarily use SvelteKit for its routing capability. You can begin exploring
the SvelteKit components by reading the comments in the
/src/routes/dashboard/+page.svelte
file.
We also have implemented a few custom stores to keep track of contact names and
addresses, user KYC information, a list of anchor transfers, etc. A good place
to start exploring these stores is the /src/lib/stores/contactsStore.js
file.