Getting Started with Breeze

Introduction

Breeze is a powerful library designed to accelerate dApp development on the Cardano blockchain using the Svelte framework and SvelteKit. It simplifies interaction with Cardano's serialization library and wallet API, leveraging Svelte's reactive capabilities for efficient data management.

Discover the potential of Breeze and embark on your journey to building decentralized applications with ease.

Installation

Requirements

Before installing Breeze, ensure the following prerequisites are met:

  • Node.js with Svelte and SvelteKit installed
  • Tailwind CSS configured in your project (required for Breeze components)
  • TypeScript setup (recommended for better type support with Breeze)

1. Install Breeze SDK

To use Breeze in your project, install Breeze SDK and its dependencies:

Use npm to install Breeze SDK and Vite WASM plugin:

	terminal
    
    
  

2. Configure Vite for WebAssembly (WASM)

Configure Vite to support WebAssembly (WASM) for Breeze:

Add the following configuration to your vite.config.ts file:

	vite.config.js
    
    
  

3. Configure Tailwind CSS

If you're using Breeze Connect Wallet options, configure Tailwind CSS to work with them:

Update your tailwind.config.js file with the necessary settings:

	tailwind.config.js
    
    
  

4. Try it out

Now you should ready to go, you can try to import one of our components and see if it works

Let's try the dropdown component by importing DropdownWallet

	routes/+page.svelte
    
    
  

You're done!

If you followed the steps correctly, you should now have Breeze SDK installed and configured

importing and using DropdownWallet should give you a button like this one, try it out!


Learn Cardano

Cardano is a third-generation blockchain platform designed to facilitate secure and scalable transactions, smart contracts, and decentralized applications (dApps). Founded by blockchain pioneers and researchers, Cardano is driven by a commitment to scientific rigor and evidence-based development.

Built on a proof-of-stake consensus mechanism, Ouroboros, which ensures sustainability, security, and scalability. The platform is designed to be interoperable with other blockchains and legacy systems, enabling seamless integration and cross-chain communication.

The native cryptocurrency, ADA, is used for transactions, staking, and governance within the ecosystem. ADA holders can participate in the network's governance through voting on proposals and shaping the platform's future direction.

Explore Cardano development resources:

Cardano Developer Portal

Official documentation and resources

Cardano Serialization Lib

A library for serialization & deserialization of data structures used in Cardano’s Haskell implementation of Shelley along with useful utility functions.

Introduction to Cardano

Welcome to the central hub for Cardano documentation. Here, you'll find content that describes and supports the features on both the Cardano mainnet and testnet environments.

Cardano Caniuse

Cardano Wallet API Compatiblity Matrix based on Cip-30


Learn Svelte

Svelte is a modern web framework that simplifies front-end development by compiling code at build time, resulting in highly optimized and performant applications. With a minimalistic approach to web development, Svelte eliminates the need for complex frameworks and libraries, offering a clean and efficient alternative for building interactive web applications.

Svelte's reactive nature allows developers to create dynamic user interfaces with ease, using declarative syntax and reactive assignments to manage state and data flow. The framework's component-based architecture enables code reusability and modularity, making it an ideal choice for building scalable and maintainable web applications.

Enhance your Svelte skills with these resources:

Svelte Tutorial

The official Svelte tutorial is a comprehensive guide to learning Svelte from scratch. Follow the tutorial to build your first Svelte application and explore the framework's core concepts and features.

Svelte by Example

Svelte by Example is a succinct, gentle introduction to Svelte & SvelteKit to pique your curiosity. If you want to dive deeper, we recommend reading through the Svelte tutorial & docs.

Svelte Society

Svelte Society is a community-driven organization that aims to support and promote the Svelte ecosystem. Join the community to connect with other Svelte developers, share knowledge, and contribute to the growth of the framework.

Help Articles

Development on Cardano 2024: Your Go-To Guide for Building with Confidence!

In this blog post, we will dive into the world of Cardano development and unlock exciting opportunities! πŸ’‘ Whether you're aspiring to become a Cardano Smart Contract Developer through Plutus or Marlowe, contributing directly to Cardano's development, exploring funding and incubation programs, joining hackathons, or even seeking formal employment – Cardano has it all! πŸ§‘πŸΎβ€πŸ’» Connect with vibrant communities, engage in discussions, and leverage educational programs to bring your innovative web3 applications to life. πŸš€