CINXE.COM

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Using Rapyd for Your Gig Economy Payment Gateway and Disbursement Platform - 馃憮 Blog - Rapyd Community</title> <meta name="description" content="By: Samuel Umoren Rapyd is a fintech platform that enables you to accept, send, and store funds globally. With Rapyd, you can seamlessly integrate local commerce and fintech services into your applications, creating &hellip;"> <meta name="generator" content="Discourse 3.5.0.beta1-dev - https://github.com/discourse/discourse version 402ec6bf5c857ddc07be9cb9673734cc7152b7be"> <link rel="icon" type="image/png" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/optimized/3X/b/b/bb5b39d2c51cd978c7557bb34010d18f6a0710d5_2_32x32.svg"> <link rel="apple-touch-icon" type="image/png" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/optimized/1X/a080e5f5ba5d8cedf8fdbaa8cd2ecf5fa8276594_2_180x180.png"> <meta name="theme-color" media="(prefers-color-scheme: light)" content="#09121c"> <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#09121c"> <meta name="color-scheme" content="light dark"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, viewport-fit=cover"> <link rel="canonical" href="https://community.rapyd.net/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537" /> <link rel="search" type="application/opensearchdescription+xml" href="https://community.rapyd.net/opensearch.xml" title="Rapyd Community Search"> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/color_definitions_neutral-rapyd-light_4_1_bc74d81a3f8bf433a049d9f820221dceceb66c24.css?__ws=community.rapyd.net" media="(prefers-color-scheme: light)" rel="stylesheet" class="light-scheme"/><link href="https://sea2.discourse-cdn.com/flex016/stylesheets/color_definitions_neutral-rapyd-dark_14_1_d90c893d96051cdd5bfeb955a0578144ad37b923.css?__ws=community.rapyd.net" media="(prefers-color-scheme: dark)" rel="stylesheet" class="dark-scheme"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/automation_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="automation" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/checklist_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="checklist" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-ai_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-ai" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-akismet_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-akismet" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-assign_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-assign" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-cakeday_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-cakeday" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-calendar_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-calendar" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-chat-integration_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-chat-integration" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-data-explorer_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-data-explorer" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-details_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-details" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-docs_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-docs" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-gamification_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-gamification" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-lazy-videos_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-lazy-videos" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-local-dates_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-local-dates" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-policy_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-policy" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-post-voting_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-post-voting" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-presence_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-presence" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-solved_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-solved" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-topic-voting_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-topic-voting" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-yearly-review_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-yearly-review" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/footnote_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="footnote" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/hosted-site_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="hosted-site" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/poll_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="poll" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/spoiler-alert_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="spoiler-alert" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-ai_desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-ai_desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-calendar_desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-calendar_desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-gamification_desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-gamification_desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-post-voting_desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-post-voting_desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/discourse-topic-voting_desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="discourse-topic-voting_desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/poll_desktop_addb2c22f72015c030a269a2f61f95dda0569d1b.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="poll_desktop" /> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_14_2f2d08cfc325e7f6155037144db73300639eb021.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="14" data-theme-name="blog post styling"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_50_ecd1d210b23b5a3c67531ac22da2964fc29948fe.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="50" data-theme-name="custom header links"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_49_559ec5b4108b9a7a2ca06f15c75480699c61975a.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="49" data-theme-name="discotoc"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_29_ad4daa91cb4f7a84cda306e4ca5d47eb3f7b5689.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="29" data-theme-name="discourse avatar component"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_11_e99258c8ece0b2bf420a581dec3492a9c45b75a4.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="11" data-theme-name="easy footer"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_52_822295980185b15a6c128cd9979df12e226a0e02.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="52" data-theme-name="full width"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_26_2afa759d1bb8ad58c2c3c8a9d41e329ed0af42f1.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="26" data-theme-name="slick - gallery component"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_48_85fb082a43a04bc8ecafb903462131fa43ddcc91.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="48" data-theme-name="tag icons"/> <link href="https://sea2.discourse-cdn.com/flex016/stylesheets/desktop_theme_1_c873454ec0939bff4b31a981d717fab8f3711bee.css?__ws=community.rapyd.net" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="1" data-theme-name="default"/>  <script src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js" type="text/javascript" charset="UTF-8" data-domain-script="ec7df849-2205-4c3b-9a46-c2e5ea2812f1-test" nonce="iX3v2WzDCLPfN8L4eluabaSnu"></script>  <meta name="google-site-verification" content="mAfH7Ur7w7T_8U05fR-hWeob3BVbvxdLsISpZOyf0lI"><script defer="" src="https://sea2.discourse-cdn.com/flex016/theme-javascripts/6843d717b7d7473126a405edb8eab9b72fac4095.js?__ws=community.rapyd.net" data-theme-id="1" nonce="iX3v2WzDCLPfN8L4eluabaSnu"></script> <script defer="" src="https://sea2.discourse-cdn.com/flex016/theme-javascripts/c3bdbdffede472947bf81fe99cb44bb1e0b4f354.js?__ws=community.rapyd.net" data-theme-id="38" nonce="iX3v2WzDCLPfN8L4eluabaSnu"></script> <link rel="alternate nofollow" type="application/rss+xml" title="RSS feed of 'Using Rapyd for Your Gig Economy Payment Gateway and Disbursement Platform'" href="https://community.rapyd.net/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537.rss" /> <meta property="og:site_name" content="Rapyd Community" /> <meta property="og:type" content="website" /> <meta name="twitter:card" content="summary" /> <meta name="twitter:image" content="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/1/a/1ad9fbd3f2a6b117a6f2d4ce79e1c13a23e81f05.jpeg" /> <meta property="og:image" content="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/1/a/1ad9fbd3f2a6b117a6f2d4ce79e1c13a23e81f05.jpeg" /> <meta property="og:url" content="https://community.rapyd.net/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537" /> <meta name="twitter:url" content="https://community.rapyd.net/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537" /> <meta property="og:title" content="Using Rapyd for Your Gig Economy Payment Gateway and Disbursement Platform" /> <meta name="twitter:title" content="Using Rapyd for Your Gig Economy Payment Gateway and Disbursement Platform" /> <meta property="og:description" content="By: Samuel Umoren Rapyd is a fintech platform that enables you to accept, send, and store funds globally. With Rapyd, you can seamlessly integrate local commerce and fintech services into your applications, creating functional and tailored local experiences anywhere in the world. One of Rapyd鈥檚 essential offerings is the Disburse platform. Rapyd Disburse lets you pay contractors, workers, suppliers, or any business. In this guide, you鈥檒l learn how to use the Rapyd Disburse API to build a gi..." /> <meta name="twitter:description" content="By: Samuel Umoren Rapyd is a fintech platform that enables you to accept, send, and store funds globally. With Rapyd, you can seamlessly integrate local commerce and fintech services into your applications, creating functional and tailored local experiences anywhere in the world. One of Rapyd鈥檚 essential offerings is the Disburse platform. Rapyd Disburse lets you pay contractors, workers, suppliers, or any business. In this guide, you鈥檒l learn how to use the Rapyd Disburse API to build a gi..." /> <meta property="og:article:section" content="馃敠 Community" /> <meta property="og:article:section:color" content="FF007A" /> <meta property="og:article:section" content="馃憮 Blog" /> <meta property="og:article:section:color" content="ffd8eb" /> <meta property="og:article:tag" content="disburse-api" /> <meta property="og:article:tag" content="tech-blog" /> <meta property="og:article:tag" content="gig-economy" /> <meta property="article:published_time" content="2024-11-12T12:51:31+00:00" /> <meta property="og:ignore_canonical" content="true" /> </head> <body class="crawler browser-update"> <script defer="" src="https://sea2.discourse-cdn.com/flex016/theme-javascripts/1b72c23f0a326da109773d247438a0a41cedc878.js?__ws=community.rapyd.net" data-theme-id="26" nonce="iX3v2WzDCLPfN8L4eluabaSnu"></script> <header> <a href="/"> Rapyd Community </a> </header> <div id="main-outlet" class="wrap" role="main"> <div id="topic-title"> <h1> <a href="/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537">Using Rapyd for Your Gig Economy Payment Gateway and Disbursement Platform</a> </h1> <div class="topic-category" itemscope itemtype="http://schema.org/BreadcrumbList"> <span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a href="/c/community/rapyd-dev-blog-posts/39" class="badge-wrapper bullet" itemprop="item"> <span class='badge-category-bg' style='background-color: #FF007A'></span> <span class='badge-category clear-badge'> <span class='category-name' itemprop='name'>馃敠 Community</span> </span> </a> <meta itemprop="position" content="1" /> </span> <span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a href="/c/community/rapyd-dev-blog-posts/39" class="badge-wrapper bullet" itemprop="item"> <span class='badge-category-bg' style='background-color: #ffd8eb'></span> <span class='badge-category clear-badge'> <span class='category-name' itemprop='name'>馃憮 Blog</span> </span> </a> <meta itemprop="position" content="2" /> </span> </div> <div class="topic-category"> <div class='discourse-tags list-tags'> <a href='https://community.rapyd.net/tag/disburse-api' class='discourse-tag' rel="tag">disburse-api</a>, <a href='https://community.rapyd.net/tag/tech-blog' class='discourse-tag' rel="tag">tech-blog</a>, <a href='https://community.rapyd.net/tag/gig-economy' class='discourse-tag' rel="tag">gig-economy</a> </div> </div> </div> <div itemscope itemtype='http://schema.org/DiscussionForumPosting'> <meta itemprop='headline' content='Using Rapyd for Your Gig Economy Payment Gateway and Disbursement Platform'> <link itemprop='url' href='https://community.rapyd.net/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537'> <meta itemprop='datePublished' content='2024-11-12T12:51:31Z'> <meta itemprop='articleSection' content='馃憮 Blog'> <meta itemprop='keywords' content='disburse-api, tech-blog, gig-economy'> <div itemprop='publisher' itemscope itemtype="http://schema.org/Organization"> <meta itemprop='name' content='Rapyd'> <div itemprop='logo' itemscope itemtype="http://schema.org/ImageObject"> <meta itemprop='url' content='https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/b/d/bdacb483afecf14cacbeef84245285a01da3fca5.png'> </div> </div> <div id='post_1' class='topic-body crawler-post'> <div class='crawler-post-meta'> <span class="creator" itemprop="author" itemscope itemtype="http://schema.org/Person"> <a itemprop="url" rel='nofollow' href='https://community.rapyd.net/u/Community_Team'><span itemprop='name'>Community_Team</span></a> </span> <link itemprop="mainEntityOfPage" href="https://community.rapyd.net/t/using-rapyd-for-your-gig-economy-payment-gateway-and-disbursement-platform/59537"> <link itemprop="image" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/1/a/1ad9fbd3f2a6b117a6f2d4ce79e1c13a23e81f05.jpeg"> <span class="crawler-post-infos"> <time datetime='2024-11-12T12:51:31Z' class='post-time'> November 12, 2024, 12:51pm </time> <meta itemprop='dateModified' content='2024-12-18T20:02:07Z'> <span itemprop='position'>1</span> </span> </div> <div class='post' itemprop='text'> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/1/a/1ad9fbd3f2a6b117a6f2d4ce79e1c13a23e81f05.jpeg" data-download-href="/uploads/short-url/3PxrpFmhaYCw6wYPzw5JhRxCx25.jpeg?dl=1" title="GigEconomyGatewayPlatform"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/1/a/1ad9fbd3f2a6b117a6f2d4ce79e1c13a23e81f05.jpeg" alt="GigEconomyGatewayPlatform" data-base62-sha1="3PxrpFmhaYCw6wYPzw5JhRxCx25" width="690" height="288" data-dominant-color="82A199"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">GigEconomyGatewayPlatform</span><span class="informations">1000脳420 67.3 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <p>By: <strong>Samuel Umoren</strong></p> <p>Rapyd is a fintech platform that enables you to accept, send, and store funds globally. With Rapyd, you can seamlessly integrate local commerce and fintech services into your applications, creating functional and tailored local experiences anywhere in the world. One of Rapyd鈥檚 essential offerings is the Disburse platform.</p> <p>Rapyd Disburse lets you pay contractors, workers, suppliers, or any business. In this guide, you鈥檒l learn how to use the Rapyd Disburse API to build a gig payment app for freelancers. The app will allow freelancers to add their profile and bank details and request payments on demand or periodically.</p> <h2><a name="p-105383-preparing-the-project-1" class="anchor" href="#p-105383-preparing-the-project-1"></a>Preparing the Project</h2> <p>This article focuses mainly on integration rather than building the entire app from scratch. The only prerequisite for the integration is having a Rapyd Client Portal account. The complete source code can be found on GitHub.</p> <p>To get started, you have to clone the project <a href="https://github.com/Rapyd-Samples/gig-economy-payment-app">GitHub repo</a>, install the dependencies, and switch to the starter branch:</p> <pre data-code-wrap="bash"><code class="lang-bash">git clone https://github.com/officialsamtech/gig-economy-payment-app.git cd gig-economy-payment-app npm install git checkout starter </code></pre> <p>Navigate to the backend folder and install the dependencies:</p> <pre data-code-wrap="bash"><code class="lang-bash">cd backend; npm install; cd - </code></pre> <p>Head to the frontend directory and install the dependencies:</p> <pre data-code-wrap="bash"><code class="lang-bash">cd frontend; npm install; cd - </code></pre> <p>Navigate back to the root directory and run the project using this command:</p> <pre data-code-wrap="bash"><code class="lang-bash">npm run dev </code></pre> <p>Your app is now ready to integrate with the Rapyd Disburse API, but first, let鈥檚 take a look at the UI and app structure.</p> <h2><a name="p-105383-overview-of-the-project-ui-and-app-structure-2" class="anchor" href="#p-105383-overview-of-the-project-ui-and-app-structure-2"></a>Overview of the Project UI and App Structure</h2> <p>Navigate to <code>http://localhost:3000/</code> on your browser, and you鈥檒l see the gig payment app鈥檚 user interface (UI). The UI features four pages, each dedicated to a specific functionality within the app.</p> <p><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/1/e/1e8596d760b6488f308a77e70f4e5745f50d1ac2.gif" alt="The project UI" data-base62-sha1="4m0xkWjQoRE1JSXp9iz6PvD9hD4" width="690" height="390" class="animated"></p> <p>The first page, <strong>Your Profile</strong>, allows freelancers to create and manage their profiles. Freelancers request payments for completed projects on the <strong>Request Payments</strong> page. They start by specifying the amount and then providing the required details regarding the payment request.</p> <p>The <strong>Bank Accounts</strong> page allows the freelancer (beneficiary) to save and view their bank account information. The last page, labeled <strong>Payments</strong>, displays the freelancer鈥檚 recent payment history.</p> <p>The two main parts of the app are the backend and the frontend.</p> <h3><a name="p-105383-backend-3" class="anchor" href="#p-105383-backend-3"></a>Backend</h3> <p>The backend uses Node.js, Express, and TypeScript, starting off with <strong>app.ts</strong>, which initializes the server and sets up various middleware. It also includes controllers like <strong>authController.ts</strong> to handle authentication, <strong>beneficiaries.ts</strong> to manage beneficiaries, and <strong>payouts.ts</strong> to take care of payouts. The <code>services</code> folder houses the business logic, featuring <strong>authService.ts</strong> for authentication, <strong>rapydService.ts</strong> for consuming all Rapyd API endpoints, and <strong>profileService.ts</strong> for user profiles. <code>SQLite</code> serves as the database, initialized in <strong>database.ts</strong>. You can find detailed documentation for the backend in its <strong>README.md</strong>.</p> <h3><a name="p-105383-frontend-4" class="anchor" href="#p-105383-frontend-4"></a>Frontend</h3> <p>The frontend uses Next.js, TypeScript, and Tailwind CSS. <strong>_app.tsx</strong> is the main entry point, managing global styles and checking for token expiration. Upon loading, <strong>index.tsx</strong> automatically redirects users to the profile page. The <code>auth,</code> <code>request-payments,</code> <code>payment-methods,</code> and <code>payments</code> pages handle user authentication, request payouts and bank account information, and view payment history features.</p> <h2><a name="p-105383-integrating-the-rapyd-disburse-api-5" class="anchor" href="#p-105383-integrating-the-rapyd-disburse-api-5"></a>Integrating the Rapyd Disburse API</h2> <p>The Rapyd Disburse API has various API endpoints designed to facilitate different aspects of your app鈥檚 payout processes. This guide will focus on three critical aspects鈥攑ayouts, payout method types, and beneficiary endpoints鈥攖o create a functional gig payment application:</p> <ul> <li><strong>Payouts:</strong> These transactions represent the payment disbursement from your Rapyd Wallet to the beneficiaries. They form the core of any payment processing in the gig economy platform.</li> <li><strong>Payout method types:</strong> These refer to how payouts can be processed depending on the country and financial infrastructure, such as bank transfers and digital wallets.</li> <li><strong>Beneficiary:</strong> This term refers to the individuals or entities receiving the payouts. In the context of your gig payment app, beneficiaries are the freelancers who receive payments for their services.<br> You鈥檒l use the payouts and beneficiary endpoints to implement the essential features of your gig payment app. Through these endpoints, you鈥檒l be able to create beneficiaries, understand the required details for different payout methods, and process payouts to freelancers based on the provided bank details.</li> </ul> <h3><a name="p-105383-creating-and-funding-a-wallet-with-the-client-portal-6" class="anchor" href="#p-105383-creating-and-funding-a-wallet-with-the-client-portal-6"></a>Creating and Funding a Wallet with the Client Portal</h3> <p>Before you start writing code, you need to create and fund a wallet on the Client Portal.</p> <p>Navigate to <a href="https://dashboard.rapyd.net/ewallets"><strong>Wallets</strong></a> on your browser and click <a href="https://dashboard.rapyd.net/ewallets/accounts"><strong>Accounts</strong></a> in the left sidebar:</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/9/4/9411d18d98fee5b98df0d3ba198db0851d543010.jpeg" data-download-href="/uploads/short-url/l7SQbBNDXYgg0cGBgejA9pyFXWw.jpeg?dl=1" title="Create wallet screen on the Rapyd client dashboard"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/9/4/9411d18d98fee5b98df0d3ba198db0851d543010.jpeg" alt="Create wallet screen on the Rapyd client dashboard" data-base62-sha1="l7SQbBNDXYgg0cGBgejA9pyFXWw" width="690" height="392" data-dominant-color="FBF5F8"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Create wallet screen on the Rapyd client dashboard</span><span class="informations">2880脳1638 200 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <p>Create a wallet and fill in the form with whatever details you like. When you鈥檝e done that, you should have a wallet like this. Copy the wallet ID.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/e/f/ef929d77cc3586a4c12a043a558d7b72519ec5c0.jpeg" data-download-href="/uploads/short-url/ybmeGuozte6kPw4dfjEkDwz7nMc.jpeg?dl=1" title="The wallet details screen of the Rapyd client dashboard"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/e/f/ef929d77cc3586a4c12a043a558d7b72519ec5c0.jpeg" alt="The wallet details screen of the Rapyd client dashboard" data-base62-sha1="ybmeGuozte6kPw4dfjEkDwz7nMc" width="690" height="393" data-dominant-color="FAF6F8"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">The wallet details screen of the Rapyd client dashboard</span><span class="informations">2876脳1642 272 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <p>Navigate to <a href="https://dashboard.rapyd.net/account/balance/">the accounts balance view of the Rapyd client dashboard</a> and click the <strong>Transfer funds</strong> button.</p> <p>In the <strong>Transfer funds</strong> modal, select the <strong>User wallet</strong> tab and paste your wallet ID. Insert an amount and select USD for the currency. Click <strong>Transfer</strong> to transfer the funds to the user wallet view of the client dashboard.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/0/4/04b6d38dccae711238b0db4c3c3ab8ba82986735.jpeg" data-download-href="/uploads/short-url/FHC2FYEO85vGYFIW03CCw10VEh.jpeg?dl=1" title="Transfering funds to user wallet view of the client dashboard"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/0/4/04b6d38dccae711238b0db4c3c3ab8ba82986735.jpeg" alt="Transfering funds to user wallet view of the client dashboard" data-base62-sha1="FHC2FYEO85vGYFIW03CCw10VEh" width="690" height="394" data-dominant-color="A09EA0"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Transfering funds to user wallet view of the client dashboard</span><span class="informations">2880脳1646 222 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <p>After you鈥檝e done the transfer, your wallet should have some funds in it.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/d/7/d70521be78395848c964c23584ecf342f5f4f52e.jpeg" data-download-href="/uploads/short-url/uG9EmsykscXvhFJPdyj90JG0ppY.jpeg?dl=1" title="Funded wallet details view of the client dashboard"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/d/7/d70521be78395848c964c23584ecf342f5f4f52e.jpeg" alt="Funded wallet details view of the client dashboard" data-base62-sha1="uG9EmsykscXvhFJPdyj90JG0ppY" width="690" height="390" data-dominant-color="FAF6F9"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Funded wallet details view of the client dashboard</span><span class="informations">2878脳1630 271 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <h3><a name="p-105383-accessing-the-rapyd-api-keys-7" class="anchor" href="#p-105383-accessing-the-rapyd-api-keys-7"></a>Accessing the Rapyd API Keys</h3> <p>In the root of your project, create a file named <strong>.env</strong> to house your environment variables. Populate this file with your Rapyd API credentials.</p> <p>To obtain the <code>accessKey</code> and <code>secretKey</code> from Rapyd, open your Rapyd Client Portal and navigate to <a href="https://dashboard.rapyd.net/developers/api-control"><strong>Developers</strong></a>.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/b/2/b21a6ad137d4790e1e6f40dbc9908a3b8081d626.png" data-download-href="/uploads/short-url/ppzAtZwNA8DJ2KL4r7YKGO1drbE.png?dl=1" title="Access and secret key credentials from the client dashboard"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/b/2/b21a6ad137d4790e1e6f40dbc9908a3b8081d626.png" alt="Access and secret key credentials from the client dashboard" data-base62-sha1="ppzAtZwNA8DJ2KL4r7YKGO1drbE" width="690" height="391" data-dominant-color="F9F4F8"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Access and secret key credentials from the client dashboard</span><span class="informations">2880脳1636 324 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <p>Paste the keys into your <strong>.env</strong> file:</p> <pre data-code-wrap="bash"><code class="lang-bash">RAPYD_ACCESS_KEY= RAPYD_SECRET_KEY= PORT=5000 BASERAPYDAPIURL=https://sandboxapi.rapyd.net </code></pre> <p>Keep this file secure and excluded from version control by adding it to your <strong>.gitignore</strong> file. You鈥檙e now ready to integrate the app with Rapyd.</p> <h3><a name="p-105383-constructing-the-api-requests-body-8" class="anchor" href="#p-105383-constructing-the-api-requests-body-8"></a>Constructing the API Requests Body</h3> <p>Before making requests to the Rapyd Disburse API endpoints, it鈥檚 crucial to accurately prepare the header parameters and request signatures. This ensures secure and authorized interactions with the Rapyd API. Use the following code snippet to prepare the header parameters and request signatures for secure and authorized interactions with the Rapyd API:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript"> private _accessKey: string; private _secretKey: string; private _baseUrl: string; private _axiosClient: AxiosInstance; constructor() { this._accessKey = config.accessKey; this._secretKey = config.secretKey; this._baseUrl = config.baseRapydApiUrl; this._axiosClient = axios.create({ baseURL: this._baseUrl, }); this._axiosClient.interceptors.request.use(req => { const method = req.method as HttpMethod; const salt = this.generateRandomString(8); const timestamp = Math.floor(Date.now() / 1000); const signature = this.generateSignature(method, req.url, salt, timestamp, req.data); req.headers.salt = salt; req.headers.timestamp = timestamp; req.headers.access_key = this._accessKey; req.headers.signature = signature; req.headers['Content-Type'] = 'application/json'; return req; }); } </code></pre> <h2><a name="p-105383-implementing-the-beneficiaries-api-endpoint-9" class="anchor" href="#p-105383-implementing-the-beneficiaries-api-endpoint-9"></a>Implementing the Beneficiaries API Endpoint</h2> <p>The beneficiaries endpoint allows you to create a beneficiary profile, which is essential for payouts in the gig payment app.</p> <h3><a name="p-105383-making-a-request-to-create-a-beneficiary-10" class="anchor" href="#p-105383-making-a-request-to-create-a-beneficiary-10"></a>Making a Request to Create a Beneficiary</h3> <p>You can simplify the process of creating a beneficiary or payee by sending a POST request to the Rapyd Disburse beneficiary API endpoint. Implement the following code snippet to create a new beneficiary:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript"> public async createBeneficiary(body: Beneficiary): Promise<any> { // Implement the API call to create a beneficiary try { const response = await this._axiosClient.post<RapydResponse<Beneficiary>>('/v1/payouts/beneficiary', body); return response.data } catch (error) { if (error.isAxiosError) { throw new HttpException(+error.response.status, error.response.data?.status || error.response.data); } } } </code></pre> <p>The <code>createBeneficiary</code> function creates a new beneficiary by making a POST request to the Rapyd API. It takes a <code>Beneficiary</code> object as its argument and returns the API response.</p> <h3><a name="p-105383-making-a-request-to-retrieve-beneficiaries-11" class="anchor" href="#p-105383-making-a-request-to-retrieve-beneficiaries-11"></a>Making a Request to Retrieve Beneficiaries</h3> <p>You now need to fetch beneficiary information by sending a GET request to the Rapyd API:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript"> public async getBeneficiaries(beneficiaryId: string): Promise<Beneficiary[]> { try { const response = await this._axiosClient.get<RapydResponse<Beneficiary[]>>(`/v1/payouts/beneficiary/${beneficiaryId}`); return response.data?.data; } catch (error) { if (error.isAxiosError) { // Handle the error based on your application's requirements throw new HttpException(+error.response.status, error.response.data?.status || error.response.data); } throw error; } } </code></pre> <p>The <code>getBeneficiaries</code> method fetches a specific beneficiary鈥檚 details from the Rapyd API. It takes a <code>beneficiaryId</code>, makes a GET request, and returns the beneficiary data. If the request fails, it throws an <code>HttpException</code> with the error details.</p> <p>The UI for this feature lists the bank account information of beneficiaries, including their category, country, and entity type.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/8/9/891b1238d4032b374cf1419c2b6a9ca12feec26e.png" data-download-href="/uploads/short-url/jyTpChSPQsltCxf5kYqIz7XMtRk.png?dl=1" title="UI for beneficiary details"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/8/9/891b1238d4032b374cf1419c2b6a9ca12feec26e.png" alt="UI for beneficiary details" data-base62-sha1="jyTpChSPQsltCxf5kYqIz7XMtRk" width="690" height="376" data-dominant-color="FDFDFD"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">UI for beneficiary details</span><span class="informations">2880脳1570 172 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <h3><a name="p-105383-retrieve-required-payout-method-fields-12" class="anchor" href="#p-105383-retrieve-required-payout-method-fields-12"></a>Retrieve Required Payout Method Fields</h3> <p>Before you create a payout, you must retrieve the fields required to use a payout method type. The fields are returned as an array of objects. The name of each field appears in the name field of each object. Implement the following code snippet to retrieve the required fields for the payout method in your gig payment app:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript"> public async getPayoutMethodRequiredFields(payout_method_type: string, queryParams: PayoutMethodRequiredFieldsQuery): Promise<any> { try { const queryString = Object.entries(queryParams) .map(([key, value]) => `${key}=${value}`) .join('&'); const url = `/v1/payouts/${payout_method_type}/details?${queryString}`; const response = await this._axiosClient.get(url); return response.data; } catch (error) { console.error('this is an error', error); throw new HttpException(error.response?.status, error.response?.data || 'An error occurred'); } } </code></pre> <h2><a name="p-105383-implementing-the-payouts-api-endpoints-13" class="anchor" href="#p-105383-implementing-the-payouts-api-endpoints-13"></a>Implementing the Payouts API Endpoints</h2> <p>The gig payment app relies on payouts to disburse payments. The source of the payout is the Rapyd Wallet, which you set up earlier.</p> <h3><a name="p-105383-making-requests-to-create-a-payout-14" class="anchor" href="#p-105383-making-requests-to-create-a-payout-14"></a>Making Requests to Create a Payout</h3> <p>Integrate the following <code>createPayout</code> function into your code to initiate a new payout by making a POST request with a payout payload:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript">import { Payout } from '@/models/payout'; public async createPayout(body: Payout): Promise<any> { // Implement the API call to create a payout try { const response = await this._axiosClient.post<RapydResponse<Payout>>('/v1/payouts', body); return response.data } catch (error) { if (error.isAxiosError) { throw new HttpException(+error.response.status, error.response.data?.status || error.response.data); } } } </code></pre> <p>The UI for this feature prompts the user to enter the payout amount first.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/a/4/a4196173906bb2f63b318538ea356ab417465bf0.png" data-download-href="/uploads/short-url/npGGlp30zqWFXkxdCMOxgFJHpny.png?dl=1" title="Enter payout amount"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/a/4/a4196173906bb2f63b318538ea356ab417465bf0.png" alt="Enter payout amount" data-base62-sha1="npGGlp30zqWFXkxdCMOxgFJHpny" width="690" height="375" data-dominant-color="FDFDFD"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Enter payout amount</span><span class="informations">2880脳1568 162 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <p>Then, based on the freelancer鈥檚 bank account details, the required form fields are generated.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/2/2/2210f05e50b016cc87dfdeb869f925c8bcee804f.png" data-download-href="/uploads/short-url/4RmwA2yjGdxKLUAcg7eYAT5dHLV.png?dl=1" title="Payout required form fields"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/2/2/2210f05e50b016cc87dfdeb869f925c8bcee804f.png" alt="Payout required form fields" data-base62-sha1="4RmwA2yjGdxKLUAcg7eYAT5dHLV" width="320" height="500" data-dominant-color="FCFCFD"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Payout required form fields</span><span class="informations">2880脳4496 523 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <h3><a name="p-105383-making-requests-to-complete-payouts-15" class="anchor" href="#p-105383-making-requests-to-complete-payouts-15"></a>Making Requests to Complete Payouts</h3> <p>Once a payout has been created, the status of the transaction is returned in the response object. Once the status is <strong>Created</strong>, use the following code snippet to complete a payout by sending a POST request:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript"> public async completePayout(payout: string, amount: number): Promise<any> { try { const url = `/v1/payouts/complete/${payout}/${amount}`; const response = await this._axiosClient.post<RapydResponse<CompletePayout>>(url); return response.data; } catch (error) { console.error(error); throw new HttpException(error.response?.status, error.response?.data || 'An error occurred'); } } </code></pre> <p>The UI for this feature includes a button to complete payments and a list of previous payments with their status.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/0/f/0fd1820395fe9a0f27f47484f05364ed23f16b86.png" data-download-href="/uploads/short-url/2fW1TAWYnZbz5aVGNCAaqISVhvE.png?dl=1" title="UI for completing payouts"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/0/f/0fd1820395fe9a0f27f47484f05364ed23f16b86.png" alt="UI for completing payouts" data-base62-sha1="2fW1TAWYnZbz5aVGNCAaqISVhvE" width="690" height="391" data-dominant-color="FAFAFB"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">UI for completing payouts</span><span class="informations">2880脳1634 279 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <h3><a name="p-105383-implementing-recurring-payouts-16" class="anchor" href="#p-105383-implementing-recurring-payouts-16"></a>Implementing Recurring Payouts</h3> <p>In gig economy platforms, recurring payouts are common. To implement this functionality, you鈥檒l utilize the <code>node-cron</code> package to schedule tasks. Install the package:</p> <pre data-code-wrap="bash"><code class="lang-bash">npm install node-cron </code></pre> <p>Integrate the following code snippet into your project to implement the functionality for recurring payouts:</p> <pre data-code-wrap="TypeScript"><code class="lang-TypeScript"> constructor() { this.initializeCronJob(); } private initializeCronJob() { cron.schedule('0 0 * * *', () => { // Loop through inMemoryPayouts to find payouts that need to be processed for (const payout of inMemoryPayouts) { if (payout.nextPayoutDate && payout.recurrenceFrequency) { const now = new Date(); if (now >= new Date(payout.nextPayoutDate)) { // Create a new payout based on the existing one const newPayout = { ...payout }; // Update nextPayoutDate based on recurrenceFrequency const nextDate = new Date(payout.nextPayoutDate); if (payout.recurrenceFrequency === 'weekly') { nextDate.setDate(nextDate.getDate() + 7); } else if (payout.recurrenceFrequency === 'monthly') { nextDate.setMonth(nextDate.getMonth() + 1); } newPayout.nextPayoutDate = nextDate; // For demo purposes, you can log the payout console.log(`Creating a new recurring payout for ${newPayout.beneficiary_country}`); // Add the new payout to inMemoryPayouts inMemoryPayouts.push(newPayout); } } } }); } </code></pre> <p>The <code>initializeCronJob</code> method schedules a task to run daily at midnight, scanning through <code>inMemoryPayouts</code> to find payouts due for processing. If a payout is due, a new payout object is created based on the existing one, updating the <code>nextPayoutDate</code> according to the <code>recurrenceFrequency</code>. This new payout is then logged to the console and added to <code>inMemoryPayouts</code>.</p> <h2><a name="p-105383-exploring-the-api-documentation-17" class="anchor" href="#p-105383-exploring-the-api-documentation-17"></a>Exploring the API Documentation</h2> <p>You can explore the comprehensive API documentation available for the backend to enhance the app with additional features. Access it by navigating to <code>http://localhost:5000/api/docs/</code> once your server is running. The documentation, generated using Swagger UI and OpenAPI, provides an interactive interface for understanding and testing the available endpoints.</p> <p><div class="lightbox-wrapper"><a class="lightbox" href="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/3/8/38ed9dd244c11923d83807c0628a56ed0c4e44df.png" data-download-href="/uploads/short-url/87BPpVHJPcZXdoutX1Q0ODf4flt.png?dl=1" title="Interactive interface for understanding and testing the available endpoints"><img src="https://us1.discourse-cdn.com/flex016/uploads/rapyd/original/3X/3/8/38ed9dd244c11923d83807c0628a56ed0c4e44df.png" alt="Interactive interface for understanding and testing the available endpoints" data-base62-sha1="87BPpVHJPcZXdoutX1Q0ODf4flt" width="385" height="500" data-dominant-color="E9EDEE"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">Interactive interface for understanding and testing the available endpoints</span><span class="informations">2880脳3740 569 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div></p> <h2><a name="p-105383-get-the-code-18" class="anchor" href="#p-105383-get-the-code-18"></a>Get the Code</h2> <p>Grab the <a href="https://github.com/Rapyd-Samples/gig-economy-payment-app">code</a>, try out the Rapyd API, and see what you come up with. Share what you build or any takeaways in the developer community. Questions or feedback? Just reply below.</p> <div data-theme-toc="true"> </div> </div> <div itemprop="interactionStatistic" itemscope itemtype="http://schema.org/InteractionCounter"> <meta itemprop="interactionType" content="http://schema.org/LikeAction"/> <meta itemprop="userInteractionCount" content="0" /> <span class='post-likes'></span> </div> </div> </div> <div id="related-topics" class="more-topics__list " role="complementary" aria-labelledby="related-topics-title"> <h3 id="related-topics-title" class="more-topics__list-title"> Related topics </h3> <div class="topic-list-container" itemscope itemtype='http://schema.org/ItemList'> <meta itemprop='itemListOrder' content='http://schema.org/ItemListOrderDescending'> <table class='topic-list'> <thead> <tr> <th>Topic</th> <th></th> <th class="replies">Replies</th> <th class="views">Views</th> <th>Activity</th> </tr> </thead> <tbody> <tr class="topic-list-item" id="topic-list-item-59538"> <td class="main-link" itemprop='itemListElement' itemscope itemtype='http://schema.org/ListItem'> <meta itemprop='position' content='1'> <span class="link-top-line"> <a itemprop='url' href='https://community.rapyd.net/t/github-rapyd-samples-gig-economy-payment-app-gig-economy-app-using-rapyd-api-rapyd-disburse/59538' class='title raw-link raw-topic-link'>GitHub - Rapyd-Samples/gig-economy-payment-app: Gig Economy app using Rapyd API - Rapyd Disburse</a> </span> <div class="link-bottom-line"> <a href='/c/rapyd-api-resources/code-samples/33' class='badge-wrapper bullet'> <span class='badge-category-bg' style='background-color: #d8ffed'></span> <span class='badge-category clear-badge'> <span class='category-name'>馃敩 Code Samples</span> </span> </a> <div class="discourse-tags"> <a href='https://community.rapyd.net/tag/github' class='discourse-tag'>github</a> </div> </div> </td> <td class="replies"> <span class='posts' title='posts'>0</span> </td> <td class="views"> <span class='views' title='views'>59</span> </td> <td> November 12, 2024 </td> </tr> <tr class="topic-list-item" id="topic-list-item-55871"> <td class="main-link" itemprop='itemListElement' itemscope itemtype='http://schema.org/ListItem'> <meta itemprop='position' content='2'> <span class="link-top-line"> <a itemprop='url' href='https://community.rapyd.net/t/paying-vendors-with-the-rapyd-disburse-api/55871' class='title raw-link raw-topic-link'>Paying Vendors with the Rapyd Disburse API</a> </span> <div class="link-bottom-line"> <a href='/c/community/rapyd-dev-blog-posts/39' class='badge-wrapper bullet'> <span class='badge-category-bg' style='background-color: #ffd8eb'></span> <span class='badge-category clear-badge'> <span class='category-name'>馃憮 Blog</span> </span> </a> <div class="discourse-tags"> <a href='https://community.rapyd.net/tag/tutorials' class='discourse-tag'>tutorials</a> ,  <a href='https://community.rapyd.net/tag/tech-blog' class='discourse-tag'>tech-blog</a> </div> </div> </td> <td class="replies"> <span class='posts' title='posts'>0</span> </td> <td class="views"> <span class='views' title='views'>1211</span> </td> <td> September 14, 2022 </td> </tr> <tr class="topic-list-item" id="topic-list-item-59270"> <td class="main-link" itemprop='itemListElement' itemscope itemtype='http://schema.org/ListItem'> <meta itemprop='position' content='3'> <span class="link-top-line"> <a itemprop='url' href='https://community.rapyd.net/t/payroll-payment-processing-with-rapyd-disburse/59270' class='title raw-link raw-topic-link'>Payroll Payment Processing with Rapyd Disburse</a> </span> <div class="link-bottom-line"> <a href='/c/community/rapyd-dev-blog-posts/39' class='badge-wrapper bullet'> <span class='badge-category-bg' style='background-color: #ffd8eb'></span> <span class='badge-category clear-badge'> <span class='category-name'>馃憮 Blog</span> </span> </a> <div class="discourse-tags"> <a href='https://community.rapyd.net/tag/disburse-api' class='discourse-tag'>disburse-api</a> ,  <a href='https://community.rapyd.net/tag/tutorials' class='discourse-tag'>tutorials</a> ,  <a href='https://community.rapyd.net/tag/tech-blog' class='discourse-tag'>tech-blog</a> </div> </div> </td> <td class="replies"> <span class='posts' title='posts'>0</span> </td> <td class="views"> <span class='views' title='views'>1153</span> </td> <td> April 9, 2024 </td> </tr> <tr class="topic-list-item" id="topic-list-item-59290"> <td class="main-link" itemprop='itemListElement' itemscope itemtype='http://schema.org/ListItem'> <meta itemprop='position' content='4'> <span class="link-top-line"> <a itemprop='url' href='https://community.rapyd.net/t/rapyd-api-request-signatures-in-java/59290' class='title raw-link raw-topic-link'>Rapyd API Request Signatures in Java</a> </span> <div class="link-bottom-line"> <a href='/c/community/rapyd-dev-blog-posts/39' class='badge-wrapper bullet'> <span class='badge-category-bg' style='background-color: #ffd8eb'></span> <span class='badge-category clear-badge'> <span class='category-name'>馃憮 Blog</span> </span> </a> <div class="discourse-tags"> <a href='https://community.rapyd.net/tag/tech-blog' class='discourse-tag'>tech-blog</a> </div> </div> </td> <td class="replies"> <span class='posts' title='posts'>2</span> </td> <td class="views"> <span class='views' title='views'>519</span> </td> <td> May 16, 2024 </td> </tr> <tr class="topic-list-item" id="topic-list-item-1897"> <td class="main-link" itemprop='itemListElement' itemscope itemtype='http://schema.org/ListItem'> <meta itemprop='position' content='5'> <span class="link-top-line"> <a itemprop='url' href='https://community.rapyd.net/t/rapyd-disburse/1897' class='title raw-link raw-topic-link'>Rapyd Disburse</a> </span> <div class="link-bottom-line"> <a href='/c/business-resources/44' class='badge-wrapper bullet'> <span class='badge-category-bg' style='background-color: #25AAE2'></span> <span class='badge-category clear-badge'> <span class='category-name'>馃捈 Business Resources</span> </span> </a> <div class="discourse-tags"> </div> </div> </td> <td class="replies"> <span class='posts' title='posts'>0</span> </td> <td class="views"> <span class='views' title='views'>1052</span> </td> <td> February 1, 2022 </td> </tr> </tbody> </table> </div> </div> </div> <footer class="container wrap"> <nav class='crawler-nav'> <ul> <li itemscope itemtype='http://schema.org/SiteNavigationElement'> <span itemprop='name'> <a href='/' itemprop="url">Home </a> </span> </li> <li itemscope itemtype='http://schema.org/SiteNavigationElement'> <span itemprop='name'> <a href='/categories' itemprop="url">Categories </a> </span> </li> <li itemscope itemtype='http://schema.org/SiteNavigationElement'> <span itemprop='name'> <a href='/guidelines' itemprop="url">Guidelines </a> </span> </li> <li itemscope itemtype='http://schema.org/SiteNavigationElement'> <span itemprop='name'> <a href='http://iconslib.rapyd.net/assets/client-portal/Service_Agreement.pdf' itemprop="url">Terms of Service </a> </span> </li> <li itemscope itemtype='http://schema.org/SiteNavigationElement'> <span itemprop='name'> <a href='https://www.rapyd.net/security-compliance/site-privacy-policy/' itemprop="url">Privacy Policy </a> </span> </li> </ul> </nav> <p class='powered-by-link'>Powered by <a href="https://www.discourse.org">Discourse</a>, best viewed with JavaScript enabled</p> </footer> <div class="cookie-bg">  <button id="ot-sdk-btn" class="ot-sdk-show-settings">Cookie Settings</button>  </div> <div class="buorg"><div>Unfortunately, <a href="https://www.discourse.org/faq/#browser">your browser is unsupported</a>. Please <a href="https://browsehappy.com">switch to a supported browser</a> to view rich content, log in and reply.</div></div> </body> </html>