🏗️ LUKSO dApp Boilerplate

This repository is a TypeScript/Next.js based open-source framework to build LUKSO dApps with ease.

Demo URL: https://boilerplate.lukso.tech/

More information is available on our 👉 technical documentation.

Features

• Reusable components for Universal Profiles, Assets, and Vaults
• Shared contexts for Profiles, Networks, and the Extension
• Network, interface, and metadata detection
• Multiple Providers: Web3 Onboard, Wallet Connect, or plain injection
• Built-in ethers.js, erc725.js, lsp-smart-contracts
• Uses Tailwind, Prettier, TypeScript

INFO: You can switch between a regular provider and Web3-Onboard by setting the useOnboard variable within the EthereumContext.

Development

Clone the repository:

git clone git@github.com:lukso-network/tools-dapp-boilerplate.git

Install all packages and libraries:

npm install

Setup local environment variables:

If you use Wallet Connect, you will have to import a Project ID. You can simply copy the example environment file and input the parameter.

cp .env.local.example .env.local

Run the development server:

npm run dev

Tools

• Next.js: React Framework
• @lukso/lsp-smart-contracts: Schemas and Interfaces for LSPs
• @web3-onboard/core: Connecting with various Browser Extensions
• @erc725/erc725.js: ERC725 Smart Contract Interactions
• ethers: Ethereum Library for Blockchain Interactions

Resources

• LUKSO Documentation
• Next.js Documentation

Community Content

• Speedrun the lukso-network/tools-dapp-boilerplate nextjs starter - YouTube by tantodefi