This page may contain legacy content

To get our most up-to-date content please access our documentation

April 19, 2022

The Web3UIKit Story

Table of Contents

In this story, Bill from Moralis retells his experience developing the web3uikit. You may already know the web3uikit as the lightweight and beautiful UI components library that makes building good-looking dapps lightning fast! In short, the web3uikit is meant to be the definitive library for best-practice Web3 UI designs. Read on to learn the full web3uikit story!

The Web3UIKit Story

Let me keep this simple: Web3UIKit + Moralis + Your Idea = Dapp

Our live documented storybook – https://web3ui.github.io/web3uikit.

The web3uikit project is open-source, solely focused on allowing you to build your ideas into dapps markedly quicker. With excellent documentation, a passionate Web3 community, and seamless integration with Moralis, making your idea into a functional dapp just got easy.

The development of the web3uikit started back in winter 2021. Initially, it was to replace the outdated React component library we at Moralis were using with our own freshly designed interface elements. Soon after (with the help of Dimi), we integrated Dimi’s work with the “Moralis React component”, and it was clear that this project would be a phenomenal tool capable of powering dapps for 2020 and beyond. So, like all great projects, what do you do when you have built something quite special? You open-source it and give it away for free, of course.

From day one, our aim has been “killer DX” (developer experience), which continues to be our mantra going forward. We build components to work together like Web3 LEGO blocks, be as simple as possible for you to understand, and be fully tested to abstract complexity away from your idea and provide reliable and predictable elements for your dapp.

Web3UIKit Tech Talk

  • React Component Library
  • Fully Typescript Supported
  • Styled Components
  • Unit Tested with React Testing Library
  • Fully Documented with Storybook
  • Simple Web3 Integration with Moralis

Open-sourcing the web3uikit project has been the most amazing journey for me. Seeing our community use our kit, find and fix bugs, and even build entire features has been one of the most rewarding experiences of my life. It has even brought talent from our community into our team. It has been a wild ride, but we are just getting started.

A contributor I would love to highlight is @abhinav_m_v, a young Web3 mage from India. He has been making and refactoring components for us and even made some great progress on our new NFT components. He has started working part-time for us alongside his university endeavors, so we have plans to extend his NFT functionality even further, and he could not be more humble about it:

“Thanks a lot @billgil @locothedev @IvanOnTech for letting me contribute and also for all the suggestions/improvements, learning a lot from you folks.”

https://twitter.com/abhinav_m_v/status/1507053744713654278

Finally, I would like to thank the web3uikit team. Loco, Dimi, Dani, and Rayyan, none of us could have done this alone, but together, we have something quite special and rare, Web3 lightning in a bottle. I love you guys! Also, big love to Tibi and Oleskii for the killer designs and Ivan for his vision and inspiration.

The web3uikit project will keep growing and improving; we aim to make this the standard for dapp building going forward. You can help be part of this open-source revolution! Check out our contribution guide here:

https://github.com/web3ui/web3uikit/blob/master/CONTRIBUTE.md

Moralis Money
Stay ahead of the markets with real-time, on-chain data insights. Inform your trades with true market alpha!
Moralis Money
Related Articles
October 15, 2022

NodeJS Web3 Tutorial – Create Dapps Using a NodeJS Web3 Example

February 27, 2024

How to Get the Net Worth of Any ERC20 Wallet via API 

September 7, 2023

Free Crypto Price API – How to Get Live Cryptocurrency Prices

October 20, 2022

How to Create a Decentralized Website on Ethereum

December 3, 2022

Exploring the Palm Network – What is Palm NFT Studio?

August 11, 2022

How to Code a Blockchain App in 5 Steps

January 16, 2023

The Best Ethereum Faucet in 2023

August 31, 2022

Fastest Way to Build a Web3 App

November 16, 2023

Crypto Wallet History API – Get Users’ Wallet Transaction History