<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: David Adeola</title>
    <description>The latest articles on DEV Community by David Adeola (@davidadeola).</description>
    <link>https://dev.to/davidadeola</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F989042%2F50e12f56-0bf0-4d1c-94b8-9c6af2608352.jpg</url>
      <title>DEV Community: David Adeola</title>
      <link>https://dev.to/davidadeola</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/davidadeola"/>
    <language>en</language>
    <item>
      <title>Detecting Rogue Projects and Tokens with InfluxAI: Securing the Web3 Ecosystem</title>
      <dc:creator>David Adeola</dc:creator>
      <pubDate>Fri, 11 Oct 2024 12:57:02 +0000</pubDate>
      <link>https://dev.to/davidadeola/detecting-rogue-projects-and-tokens-with-influxai-securing-the-web3-ecosystem-3mkh</link>
      <guid>https://dev.to/davidadeola/detecting-rogue-projects-and-tokens-with-influxai-securing-the-web3-ecosystem-3mkh</guid>
      <description>&lt;p&gt;The exponential growth of blockchain technology has brought both innovation and challenges to the financial landscape. While the promise of decentralization and digital assets has captivated millions, it has also left many vulnerable to rogue projects, fraudulent tokens, and rug pulls. InfluxAI’s &lt;strong&gt;Rogue Project and Token Detector&lt;/strong&gt; tackles this issue head-on by leveraging AI and advanced analytical models to proactively identify and mitigate risks in the Web3 ecosystem.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs026apwnzdm2163v8o9t.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs026apwnzdm2163v8o9t.png" alt="Rogue Project Detection" width="800" height="446"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Understanding Historical Losses
&lt;/h2&gt;

&lt;p&gt;Since the inception of the cryptocurrency market, investors have experienced substantial losses due to failed projects and scams. The 2020-2022 period alone saw billions wiped out from investor portfolios due to projects like &lt;strong&gt;BitConnect&lt;/strong&gt;, &lt;strong&gt;Terra Luna&lt;/strong&gt;, and a myriad of meme coins created with malicious intent. These losses often stem from a combination of factors:&lt;/p&gt;

&lt;h3&gt;
  
  
  Centralized Control of Liquidity
&lt;/h3&gt;

&lt;p&gt;Many projects have their liquidity controlled by a small number of addresses, making it easy for developers to withdraw and abandon the project, leaving investors with worthless tokens.&lt;/p&gt;

&lt;h3&gt;
  
  
  Lack of Transparency in Smart Contracts
&lt;/h3&gt;

&lt;p&gt;Hidden functions, backdoors, or undisclosed minting capabilities within smart contracts have enabled malicious actors to manipulate token supply or re-route funds.&lt;/p&gt;

&lt;h3&gt;
  
  
  Market Manipulation and Wash Trading
&lt;/h3&gt;

&lt;p&gt;Projects often use fake trading volumes to appear legitimate, drawing in unsuspecting investors. When the project’s true nature is revealed, prices crash, leaving users trapped in illiquid assets.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Ffastercapital.com%2Fi%2FWash-trading--An-Inside-Look-into-Circular-Trading-Strategies--The-Impact-of-Wash-Trading-on-Markets.webp" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Ffastercapital.com%2Fi%2FWash-trading--An-Inside-Look-into-Circular-Trading-Strategies--The-Impact-of-Wash-Trading-on-Markets.webp" alt="Market Manipulation" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Fundamental Flaws
&lt;/h2&gt;

&lt;p&gt;The root cause of these issues lies in the lack of standardized security measures and risk assessment tools in the decentralized ecosystem. Traditional investment vehicles have rigorous vetting and due diligence processes, whereas Web3 operates in a more open, permissionless environment. This makes it easy for bad actors to exploit vulnerabilities, leveraging the opacity and complexity of blockchain technology to create deceptive projects.&lt;/p&gt;

&lt;h2&gt;
  
  
  How InfluxAI Addresses These Issues
&lt;/h2&gt;

&lt;p&gt;Our Rogue Project and Token Detector is specifically designed to address these systemic flaws. By integrating AI and blockchain analytics, our platform scrutinizes projects at multiple levels:&lt;/p&gt;

&lt;h3&gt;
  
  
  Smart Contract Analysis
&lt;/h3&gt;

&lt;p&gt;AI models decompile and analyze smart contracts to identify hidden functions, backdoors, or unusual permissions. This automated code auditing flags potential vulnerabilities before they are exploited.&lt;/p&gt;

&lt;h3&gt;
  
  
  Behavioral Pattern Recognition
&lt;/h3&gt;

&lt;p&gt;Using machine learning, the platform monitors on-chain transactions to identify suspicious activities such as flash loan attacks, abnormal token swaps, or sudden liquidity withdrawals. The model adapts to new threat patterns, continuously learning from past incidents.&lt;/p&gt;

&lt;h3&gt;
  
  
  Risk Scoring &amp;amp; Predictive Models
&lt;/h3&gt;

&lt;p&gt;Our platform assigns a dynamic &lt;strong&gt;Risk Score&lt;/strong&gt; based on historical data, liquidity distribution, community sentiment, and holder concentration. For instance, a token with 80% of its liquidity in one wallet is flagged as high-risk, while a sudden spike in trading volume with no substantial backing can signal wash trading.&lt;/p&gt;

&lt;h3&gt;
  
  
  Historical Data Aggregation &amp;amp; Market Impact Analysis
&lt;/h3&gt;

&lt;p&gt;Leveraging extensive historical data, InfluxAI’s models predict the likelihood of price manipulation, developer misconduct, and other exploitative behaviors. By comparing new projects against thousands of historical cases, the system provides a robust analysis of potential outcomes, helping users make informed decisions.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fres.cloudinary.com%2Fdevkp5za2%2Fimage%2Fupload%2Fv1728650167%2Ffbb6dc38-a31f-4781-ac9b-c7f97279d659.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fres.cloudinary.com%2Fdevkp5za2%2Fimage%2Fupload%2Fv1728650167%2Ffbb6dc38-a31f-4781-ac9b-c7f97279d659.png" alt="AI Analysis" width="800" height="1188"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Bringing AI and Web3 Together
&lt;/h2&gt;

&lt;p&gt;The integration of AI in the Web3 space is transformative. Traditional Web3 analytics tools often lack real-time detection and predictive capabilities, which is where AI steps in. InfluxAI uses a combination of &lt;strong&gt;Natural Language Processing (NLP)&lt;/strong&gt; for code reviews, &lt;strong&gt;Deep Learning&lt;/strong&gt; for transaction pattern recognition, and &lt;strong&gt;Graph Neural Networks (GNN)&lt;/strong&gt; to map interactions between addresses and tokens.&lt;/p&gt;

&lt;p&gt;This multi-layered approach creates a holistic view of a project’s risk profile, offering users insights beyond what conventional tools can achieve. InfluxAI’s platform not only detects potential red flags but also provides a detailed breakdown of why a project is considered risky, thereby educating users and raising the standard of due diligence.&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;By harnessing the power of AI and blockchain, InfluxAI is setting a new benchmark in securing the decentralized ecosystem. Our Rogue Project and Token Detector aims to make the Web3 space safer, protecting users from the financial and emotional distress caused by scams and rug pulls. As the industry continues to evolve, so will our technology, ensuring that we stay one step ahead of malicious actors and deliver a secure, transparent, and trustworthy environment for all.&lt;/p&gt;

&lt;p&gt;Twitter: &lt;a href="https://x.com/Influx_AI_pro" rel="noopener noreferrer"&gt;https://x.com/Influx_AI_pro&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fro1udwht21t14a7asi3q.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fro1udwht21t14a7asi3q.png" alt="Secure Blockchain" width="750" height="315"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Bridging Web2 and Web3: Simplifying Platform Authentication with Dynamic.xyz</title>
      <dc:creator>David Adeola</dc:creator>
      <pubDate>Mon, 09 Oct 2023 14:33:31 +0000</pubDate>
      <link>https://dev.to/davidadeola/bridging-web2-and-web3-simplifying-platform-authentication-with-dynamicxyz-2ahf</link>
      <guid>https://dev.to/davidadeola/bridging-web2-and-web3-simplifying-platform-authentication-with-dynamicxyz-2ahf</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;Blockchain technology's advent has catalyzed the emergence of decentralized applications (DApps), offering heightened levels of security, privacy, and control to users. This article explores the mechanics of On-Chain (Metamask, Rainbow, Coinbasewallet) and Off-Chain (Facebook, Google) platforms for authentication via &lt;a href="https://dynamic.xyz" rel="noopener noreferrer"&gt;dynamic.xyz&lt;/a&gt;, a robust platform for streamlined user onboarding. &lt;/p&gt;




&lt;h3&gt;
  
  
  Table of Contents
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Getting to Know dynamic.xyz&lt;/li&gt;
&lt;li&gt;The SDK Suite&lt;/li&gt;
&lt;li&gt;Building a login/logout application using dynamic.xyz&lt;/li&gt;
&lt;li&gt;Connecting to the dynamic.xyz dashboard&lt;/li&gt;
&lt;li&gt;Wrapping Up&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Getting to know dynamic.xyz
&lt;/h2&gt;

&lt;p&gt;Dynamic.xyz offers robust authentication and authorization solutions. They provide an exceptionally user-friendly onboarding process and highly flexible, fully functional developer tools. Additionally, their interactive dashboard is fully customizable to align with the specific UI/UX experience users aim to achieve.&lt;/p&gt;

&lt;p&gt;One of their most groundbreaking features is the seamless integration of multiple wallets. Surprisingly, implementing this feature is extremely straightforward, requiring no manual coding. I'll delve into this in a bit.&lt;/p&gt;




&lt;h2&gt;
  
  
  The SDK Suite
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Dynamic is compatible with React (v17 and upward) and NextJS (v12 and upward). &lt;/li&gt;
&lt;li&gt;For its SDK, Dynamic utilizes either &lt;strong&gt;Ethers&lt;/strong&gt; or &lt;strong&gt;Web3.js&lt;/strong&gt; libraries to interact with Ethereum blockchain. - Ethers.js has surpassed Web3.js as the primary library for establishing connections between decentralized applications (DApps) and smart contracts on EVM blockchains.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;code&gt;npm install @dynamic-labs/sdk-react&lt;br&gt;
&lt;/code&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;All-Chains SDK (Complete) vs Modular SDK:
The All-Chains SDK, &lt;code&gt;@dynamic-labs/sdk-react&lt;/code&gt;, provides a comprehensive package with all features and wallet support. Nevertheless, if your aim is to minimize the bundle size by removing any redundant libraries from our SDK, you now have the option to select and use a specific set of new packages that cater to your preferences.&lt;/li&gt;
&lt;/ul&gt;


&lt;h2&gt;
  
  
  Building a login/logout application using dynamic.xyz
&lt;/h2&gt;

&lt;p&gt;Here, I will guide you through the process of building a sample project using the dynamic.xyz SDK. Additionally, I will share my thought process and insights regarding its implementation.&lt;/p&gt;
&lt;h2&gt;
  
  
  Pre-requisites:
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Ensure you have the following before proceeding:&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Environmental_Id: Acquire this post sign-up on the &lt;a href="https://app.dynamic.xyz/" rel="noopener noreferrer"&gt;developer page&lt;/a&gt;. navigate to the &lt;a href="https://app.dynamic.xyz/dashboard/developer" rel="noopener noreferrer"&gt;Developer Dashboard&lt;/a&gt; to obtain your &lt;code&gt;environmental_id&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fv52j5fbp1f4ehk2932wn.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fv52j5fbp1f4ehk2932wn.png" alt="Developer Dashboard"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;First step&lt;/strong&gt;&lt;br&gt;
Initiate a React App&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npx create-react-app dynamicxyz-demo-app
&lt;span class="nb"&gt;cd &lt;/span&gt;dynamicxyz-demo-app
npm start
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Second step&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm &lt;span class="nb"&gt;install&lt;/span&gt; @dynamic-labs/sdk-react
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;&lt;strong&gt;Third step&lt;/strong&gt;&lt;br&gt;
&lt;strong&gt;&lt;em&gt;Initialize the SDK in your Project&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The &lt;code&gt;DynamicContextProvider&lt;/code&gt; component serves to initialize the SDK and provide accessibility throughout the application. To ensure widespread access to Dynamic, it's advisable to position this component as high in the component tree as feasible.&lt;/p&gt;

&lt;p&gt;The &lt;code&gt;EnvironmentId&lt;/code&gt; is what you obtain from your Developer Dashboard as I mentioned earlier. The environment ID is required to identify your Sandbox or Live settings.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;Index.js&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;
&lt;span class="o"&gt;/&lt;/span&gt;&lt;span class="p"&gt;...&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;DynamicContextProvider&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@dynamic-labs/sdk-react&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;


&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;root&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;ReactDOM&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;createRoot&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;root&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;span class="nx"&gt;root&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;render&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
  &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;DynamicContextProvider&lt;/span&gt;
    &lt;span class="nx"&gt;settings&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{{&lt;/span&gt;
      &lt;span class="na"&gt;environmentId&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Your environmentID&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="p"&gt;}}&lt;/span&gt;
  &lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;App&lt;/span&gt;&lt;span class="o"&gt;/&amp;gt;&lt;/span&gt;
  &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/DynamicContextProvider&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="nx"&gt;App&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;useDynamicContext&lt;/code&gt; A Dynamic React Context set via &lt;code&gt;DynamicContextProvider&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;setShowAuthFlow&lt;/code&gt; Triggers the user's signature request.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;user&lt;/code&gt; Holds data regarding the authenticated person&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;code&gt;App.js&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="p"&gt;...&lt;/span&gt;&lt;span class="o"&gt;/&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;useDynamicContext&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@dynamic-labs/sdk-react&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;App&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;setShowAuthFlow&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;handleLogOut&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useDynamicContext&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
  &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="nx"&gt;setShowAuthFlow&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;setShowAuthFlow&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="sr"&gt;/&amp;gt;&lt;/span&gt;&lt;span class="err"&gt;;
&lt;/span&gt;  &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;Dashboard&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="nx"&gt;handleLogOut&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;handleLogOut&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="sr"&gt;/&amp;gt;&lt;/span&gt;&lt;span class="err"&gt;;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="nx"&gt;App&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;&lt;strong&gt;Flexibility of Logging in&lt;/strong&gt;&lt;br&gt;
dynamic.xyz provides a variety of login functionality which is easy to setup in your Developer Dashboard.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;Login.js&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="p"&gt;...&lt;/span&gt;&lt;span class="o"&gt;/&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;Login&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="nx"&gt;setShowAuthFlow&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;return &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&amp;gt;&lt;/span&gt;
      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="nx"&gt;onClick&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nf"&gt;setShowAuthFlow&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;)}&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
       &lt;span class="nx"&gt;Connect&lt;/span&gt; &lt;span class="nx"&gt;Wallet&lt;/span&gt;
      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;&lt;strong&gt;Fourth step&lt;/strong&gt;&lt;br&gt;
&lt;strong&gt;Logout Functionality&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;handleLogOut:&lt;/code&gt; Logs out the current user.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;user.verifiedCredentials[0].address:&lt;/code&gt; Retrieves the user's wallet address.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;user.email:&lt;/code&gt; Displays the user's email if logged in with email instead of a wallet.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;code&gt;Dashboard.js&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="p"&gt;...&lt;/span&gt;&lt;span class="o"&gt;/&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;Dashboard&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;handleLogOut&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;return &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;h1&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Welcome&lt;/span&gt; &lt;span class="o"&gt;!!!&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/h1&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;verifiedCredentials&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nx"&gt;address&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;email&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt;
          &lt;span class="nx"&gt;onClick&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;handleLogOut&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
        &lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
          &lt;span class="nx"&gt;Logout&lt;/span&gt;
        &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Fifth step
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Great job!!!&lt;/strong&gt; You have successfully set up your first application with dynamic.xyz&lt;/p&gt;




&lt;p&gt;At this point, it should look like this when you click on the connect Wallet button:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fx78dknpj1vjrix89djtc.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fx78dknpj1vjrix89djtc.png" alt="Connect Wallet"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Connecting to the Dynamic Dashboard
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Logging into the Dashboard&lt;/strong&gt;&lt;br&gt;
The Dynamic Developer Dashboard is developed using this same SDK, this offers over 320 wallets, or email for Login or Sign up.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Sign in with Email or Social&lt;/strong&gt;&lt;br&gt;
&lt;code&gt;Enable Email/Social Signup:&lt;/code&gt; navigate to the Developer &lt;a href="https://app.dynamic.xyz/dashboard/configurations" rel="noopener noreferrer"&gt;Dashboard Configurations&lt;/a&gt;, and click on the Sign in with Email or Socials section:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fr8bjxg28h629ygzgzgkv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fr8bjxg28h629ygzgzgkv.png" alt="Developer Dashboard"&gt;&lt;/a&gt;&lt;br&gt;
Click on the &lt;strong&gt;&lt;em&gt;Enable Email/Social Sign up(No wallet)&lt;/em&gt;&lt;/strong&gt;, this feature is for users that doesn't have a wallet.&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjcov03ghc6oclpo3c0hk.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjcov03ghc6oclpo3c0hk.png" alt="Email sign up"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;Enable Email/Social Sign up + Magic.link:&lt;/code&gt; &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8d2vpi7ntfe9yycvc7ap.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8d2vpi7ntfe9yycvc7ap.png" alt="Social sign up"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;You will need to setup &lt;a href="https://magic.link/" rel="noopener noreferrer"&gt;Magic.link&lt;/a&gt;&lt;/em&gt;&lt;/strong&gt; to enable the social media authentication with Dynamic.&lt;br&gt;
Once you have logged in to &lt;a href="https://magic.link/" rel="noopener noreferrer"&gt;Magic.link&lt;/a&gt;, navigate to your Dedicated wallet, and obtain two credentials being the &lt;code&gt;PUBLISHABLE_API_KEY&lt;/code&gt; and the &lt;code&gt;SECRET_KEY&lt;/code&gt;&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F08ea4wk8ixv9afu8beg2.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F08ea4wk8ixv9afu8beg2.png" alt="Magic Dashboard"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Once you have obtained both keys, input them in the Dynamic Developer Dashboard:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn3fjbmyidvfb3lh13wbh.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn3fjbmyidvfb3lh13wbh.png" alt="Dynamic Dashboard"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;After adding the extra features from your dashboard it should look like this:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpry279ndpwo5t6uuy81p.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpry279ndpwo5t6uuy81p.png" alt="Wallet connect"&gt;&lt;/a&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  Wrapping up
&lt;/h2&gt;

&lt;p&gt;In conclusion, the rapid evolution of blockchain technology has opened up exciting possibilities for transformative applications like those facilitated by Dynamic. By seamlessly integrating blockchain capabilities through their powerful SDK, developers can unlock a new realm of potential for their applications. The versatility offered by Dynamic, supporting popular frameworks like React and NextJS, as well as the option to choose between Ethers and Viem libraries, equips developers with the tools they need to tailor solutions to their precise needs.&lt;/p&gt;

&lt;p&gt;In this article, we've provided a step-by-step guide to building a simple DApp using Dynamic. From initializing the SDK and integrating it into your project to connecting to the Dynamic Dashboard, you now possess the knowledge to embark on your web3-focused development journey.&lt;/p&gt;

&lt;p&gt;Happy coding and innovating! 🚀&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Source Code:&lt;/strong&gt;&lt;br&gt;
View the code and contribute to this project on &lt;a href="https://github.com/davidadeola/dynamicxyz-demo-app" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Connect with me on &lt;a href="https://twitter.com/DavidAdeola_" rel="noopener noreferrer"&gt;Twitter&lt;/a&gt; for more updates and discussions.&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
