Today, we celebrate a major milestone with the introduction of the Lens SDK, a comprehensive toolkit that empowers developers by making it even easier to build custom web3 social experiences and applications.
At Lens, our goal has always been to make web3 social easy for both experienced builders and those with limited experience or no expertise in web3. We believe that one of the most powerful features of the Lens SDK is how it abstracts away complexities of developing on the blockchain by providing a modular tool stack that developers can use rather than building social features and functions from scratch. This allows you to focus on creating the unique experiences you envision.
With the new Lens SDK, you can add social feeds, social profiles and/or social authentication to your app with as few as 10 lines of code and with zero blockchain knowledge.
We’re seeing more and more apps integrating social features such as sharing to Lens to supercharge content distribution to this web3 native audience and signing in with Lens to leverage identities and profiles within the Lens social graph. The Lens SDK makes integrations easier and more customizable.
The SDK is also modular and composable. It seamlessly integrates with other web3 projects, protocols, and tools such as Lit Protocol to enable token-gated publications.
With Lens SDK you can pick and choose the features you want - only the components you use contribute to the final size of your app bundles. These capabilities are all handled by the Lens SDK, allowing you to concentrate on your core features without worrying about the complexities or specifics of the underlying infrastructure.
Mobile apps have been some of the biggest success stories on Lens. The new SDK doubles down on mobile support, starting with React Native. With the new SDK, you can build polished mobile apps without any underlying knowledge of the Lens API or Lens Protocol.
Thousands of developers have shipped countless apps, protocols, and tools on Lens over the past year. With the Lens SDK, we have lowered the barrier, making it easier to create innovative, powerful, and engaging Lens applications.
The Lens SDK supports a variety of platforms including:
React Web: integrate the Lens SDK into your React web app via a cohesive set of React hooks. If your stack includes ReactJS, it works with Lens SDK.
Vanilla JavaScript: maybe your web app does not include ReactJS, or you are using a different frontend framework. You can still integrate the Lens SDK via the imperative interface offered by the LensClient
.
React Native: integrating the Lens Protocol from your mobile app has never been easier. Just provide the adapters that make the most sense for your project and you are good to go.
NodeJS: build a script that interacts with the Lens API. Integrate the Lens Protocol in your NodeJS backend. You can even call it from a serverless function.
The Lens SDK comes in two flavors, two distinct ways to integrate with the Lens Protocol.
React hooks for a familiar integration in React web and React Native apps
LensClient for a closer to the metal integration with the Lens API
React Hooks
The Lens SDK React hooks are designed to provide the best possible user experience out of the box. To achieve this, we focused on these key aspects:
Optimistic updates: The intent is for every feature to feel as fast as traditional web2 but with the underlying assurances of web3 infrastructure.
Resilient authentication layer: The authentication logic is designed to be decoupled from users’ wallet lifecycle. The idea is to build experiences where users can come back and forth as they wish without thinking about switching networks. This yields an experience reminiscent of traditional social media. Users also won’t see unsolicited signing requests in their wallet.
Cohesive state management: the SDK comes with a storage layer that makes it possible to resume your app experience reliably after a reload event. It also means that the SDK will keep your browser tabs in sync.
Modular design: The Lens SDK is built as a collection of vertical modules. Choose only the features you want for your experience, and only those modules will contribute to the final size of your app bundles. Just make sure your build process can perform tree-shaking and you are good to go.
Composable: The Lens SDK leverages other web3 leading projects as part of its features. For example, token-gated publications are powered by the Lit Protocol. The Lens SDK hides all integration complexity so that you can focus on what matters for you.
LensClient
The LensClient
offers a lower-level approach to integrating with the Lens API. It is meant to expose Lens API features in a cohesive set of functions. No need to learn GraphQL to use the Lens API.
Instantiate the client and invoke the method you need:
import { LensClient, production } from "@lens-protocol/client";
const lensClient = new LensClient({ environment: production
});
const profile = await lensClient.profile.fetch({ handle:"stani.lens"
});
This can be used when the Lens SDK React hooks are not suitable.
Also, any cutting-edge or experimental features in the Lens API will be available through the LensClient
before they are mainstreamed into the SDK React hooks.
The new Momoka mutations are already available in dev preview via @lens-protocol/client@next
Development Experience
While implementing the SDK, we placed particular importance on the developer experience. Some key aspects are:
Interoperability with other tools and technologies used in the web3 ecosystem
Clear upgrade strategy
An open-sourced system, so anybody can inspect in detail and suggest improvements
Composability that fosters innovation by allowing you to combine components in novel ways, and abstracts away complexities of other protocol integrations so you can focus on your unique features
Interoperability
The Lens SDK comes with:
First-class TypeScript support for a safe and guided adoption experience.
Integrates with Ethers.js, one of the most popular web3 JS library.
Out-of-the-box adapters for wagmi, Web Crypto API and Web Storage API
If the choices above don't work for you, adapt to your needs by:
Providing your own Ethers.js Signer
Using your own storage solution
Leveraging the encryption API that works best for your platform
Upgrade Path
Regardless of your integration choice, the Lens SDK release cycle is designed to evolve with the rest of the Lens tools ecosystem. Fixes and new features will have minimal impact on existing code. When breaking changes are necessary, the SDK will guide you beforehand with deprecation warnings and suggested migration paths.
💡 Pro-tip: Adopt the Lens SDK now to minimize the impact of the upcoming Lens Protocol upgrades.
Open Source
The Lens SDK has been open source from its inception. Feel free to open a GitHub Issue and/or contribute with a Pull Request.
We think of Lens Protocol integrations as a spectrum.
Moving from left to right we have:
Interactions with the fundamental building blocks of the Protocol. For example: listening to EVM events, subscribing to Momoka data streams, and making RPC calls.
Use the Lens API which offers a cohesive abstraction above the Lens Protocol fundamentals in the shape of a GraphQL interface.
Use the Lens API via the Lens SDK LensClient which abstracts away the Lens API GraphQL schema and introduces type-safety into your stack (opt-in if you use TS).
Finally, on the far side, we have the React hooks which are the most user experience-oriented integration offered by the Lens SDK.
However, it’s not all black and white. Adopting one integration strategy does not exclude using others. Our advice is to look at the integration ladder and adopt the highest tier that best addresses your project needs. Build the vast majority of your integration on top of that tier and tap into a lower integration tier when you want to try more experimental/alpha features.
Below are some ideas of what you can build with the Lens SDK.
Social Networking Powered Apps!
The most obvious use case is building social applications. Because the SDK also supports React Native, you can build not only web, but also mobile apps with the SDK.
Here are a few app ideas:
AI-based music generation apps and marketplace that splits revenue with creators like Grimes
Mobile apps for sending, receiving and possibly buying cryptocurrency with social features and discovery (think web3 Venmo)
Microblogging - Lens is perfect for a CMS type back-end with the added benefits of discovery, composability and user monetization via collects
Specialized, or niche, marketplaces for digital art or collectibles
Peer-to-peer messaging apps with end-to-end encryption
Voting apps for elections, surveys or just for fun
Digital identity management systems
Social networks for content creators with revenue sharing
Decentralized platforms for crowdfunding or fundraising
Platforms for creating and selling digital subscriptions
Web3-based social gaming platforms
Tools
Because all of the infrastructure, data and Lens APIs are open and permissionless, there are infinite ways to build new and interesting tools on top of the Protocol.
Disqus-like commenting modules
Creating, curating, and / or managing content
Open-source SDK’s, UI Components and Libraries
Leveraging new modules to build slick or improved user interfaces for interacting with existing modules
Migrating web2 footprints to Lens (like InLens)
Content discovery
Delegating profile actions to other wallets/s, smart contracts or DAO
Integrations
In addition to building applications directly on Lens, you may want to integrate Lens as a web3 social layer into other new or existing applications. Each application using Lens benefits the entire ecosystem, turning what is usually a zero-sum game into a collaborative one.
Here are a few examples of integrations:
Sign in with Lens - access users' profile information, such as name, bio, social URLs, pictures, interests, reputation, and activity.
Share to Lens - helps distribute your application and its content to a larger audience.
Follow on Lens - Follow a user on Lens from another app.
Profile - display users' social profiles in any web3 application.
Publication - Embed Lens posts content into any web3 application.
Monetization
Mirrors, collects, follows and comments allow creators to monetize their content directly to the user without intermediaries and in a permissionless way. Because creators own their content on Lens, they can allow their followers to purchase that content.
When a user posts a publication to their Profile NFT, they have the option to set a Collect Module. This allows users to mint NFTs that link to the publication's ContentURI. This module can contain any arbitrary logic to apply to the minting process and the resulting NFT.
Creators can incentivize promotion of their posts by offering fees for each post collected through one of their mirrors.
Here are a few examples of what you can build into your app:
Monetize audiences via paid subscriptions
Incentivize people who share (mirror) content
Split revenue between the creator and others (multiple recipients)
Gated content based on collects or payment
Marketing and ads
More ideas
For more ideas, check out the Inspiration for builders section of our docs.
Where to go next?
React Web - getting started and tutorials
React Native - how to integrate the Lens SDK into your React Native app
LensClient - start here and then for each Lens API feature look for the dedicated LensClient
example.
SDK Reference - detailed TSDoc generated documentation with examples. We are continuously improving this. If something is not clear ask on our Discord channel and we will update it.
Examples - Next.js, wagmi, Vite.js, React Native, NodeJS
GitHub - report an issue and/or make a suggestion
Support - head to the lens-api-and-sdk channel on our Discord server