https://github.com/crossmint/lofi-land-embedded-demo
https://github.com/crossmint/lofi-land-embedded-demo
Last synced: about 1 month ago
JSON representation
- Host: GitHub
- URL: https://github.com/crossmint/lofi-land-embedded-demo
- Owner: Crossmint
- Created: 2024-01-16T00:05:51.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-16T19:42:24.000Z (over 2 years ago)
- Last Synced: 2025-05-31T10:49:06.679Z (about 1 year ago)
- Language: JavaScript
- Homepage: https://lofi-land-embedded-demo-six.vercel.app
- Size: 27.6 MB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Crossmint : Lofi.land Embedded Checkout Demo
Add Crossmintโs custom embedded checkout, a fully customizable iframe seamlessly integrated onto your website.
**Experience the live demo:** [https://lofi-land.demos-crossmint.com/](https://lofi-land.demos-crossmint.com/)
[](https://vercel.com/import/project?template=hhttps://github.com/divya-ranjn/lofi-land-embedded-demo)
## ๐ ๏ธ Getting Started
Follow the setup and installation instructions below to run this demo on your local machine.
## ๐ Prerequisites
- **Node.js**: If not installed, download from the [Node.js official website](https://nodejs.org/).
- **Yarn**: If not installed, run the following command in your terminal.
```bash
npm install -g yarn
```
- **Crossmint Keys**: Obtain these from the Crossmint Dev Console after deploying a collection - [https://docs.crossmint.com/docs/create-an-nft-collection](https://docs.crossmint.com/docs/create-an-nft-collection)
- Collection ID
- Project ID
- [Dynamic.xyz](https://docs.dynamic.xyz/quickstart) Environment ID: For authentication. Configure it to support ETH Testnet. Once you have your environment ID setup, navigate to the [EVM configurations](https://app.dynamic.xyz/dashboard/configurations#evm) page in the Dynamic dashboard.

## ๐พ Setup & Installation
1. **Clone the Repository **
```bash
git clone https://github.com/divya-ranjn/lofi-land-embedded-demo.git
```
2. **Install the required packages**
First, navigate to the cloned repository & then install dependencies.
```bash
cd lofi.land
yarn install
```
3. ๐ **Setting the Environment Variables**
Set up environment variables with the relevant keys.
You can copy the `sample.env` file and name the new one `.env`. Then fill in your values:
```env
REACT_APP_COLLECTIONID=YOUR_CROSSMINT_COLLECTION_ID or use 6c3b6164-f6cc-42a1-89b8-df942da0fe7a for testing
REACT_APP_PROJECTID=YOUR_CROSSMINT_PROJECT_ID or use 3eb7d488-1374-4fc8-b0be-ebe6be8a8e2f for testing
REACT_APP_ENVIRONMENT=YOUR_CROSSMINT_ENVIRONMENT
REACT_APP_DYNAMIC_ID=YOUR_DYNAMIC_XYZ_ENVIRONMENT_ID
GENERATE_SOURCEMAP=false
```
4. โถ๏ธ **Running the Demo**
```bash
yarn start
```
If you followed everything correctly, you should be able to view and experience the demo on your browser.
## ๐ Support
If you run into issues or have suggestions, we're here to help:
- Docs: [docs.crossmint.com](https://docs.crossmint.com)
- Discord: [Join Crossmint on Discord](https://discord.gg/crossmint)
- Twitter: [@crossmint](https://twitter.com/crossmint)