Invoice Station

• 

• 

• 

• 

• 

• 

  Routes

• 

  Architecture

Inspiration

Invoice Station enables freelancers or just anybody to create invoices and accept payments through bank transfers across many countries.

What it does

A freelancer or an entity can register to Invoice Station. Once connected with Rapyd Wallet API, they can create invoices and share them with their customers.

The customers can pay these invoices through Bank Transfer to a virtual bank account that is connected to the invoice through one or multiple transactions. When the transactions sum up to the amount of the invoice, the invoice is marked as paid.

How we built it

We built this app using Nuxt 3 which is a framework built using VueJS for easily creating web apps. We have a mono repo and both the backend and frontend are served through the same app.

The app contains plenty of routes and api calls. Below are screenshots of the architecture of the app and some routes.

Challenges we ran into

We wanted to pick up a bleeding edge tech stack so we picked up Nuxt 3 which is not fully released yet. Upon half through we realized that the Authentication library for Nuxt 3 will be released in August 2022. So we do not have a proper means of authentication until then.

We also used Typescript for the first time to create an app so we are not sure if we have used all the best practices for writing TS code.

While working with the Rapyd API for generating vIBAN and how it works with Wallets, we initially misunderstood how it works. We didn’t realize that each vIBAN issue has an issue id that is unique and we can create any number of these.

Instead, we were assuming there would be a single vIBAN and we will have to write our own way to figure out which payment was made for which invoice. But after working with the API we realized a lot of code that we wrote is redundant because the API already takes care of maintaining unique account ids.

Accomplishments that we're proud of

We built the whole product in under a week on a tech stack and using a language that we never worked with. We had previously worked on Nuxt 2 and using Javascript but using Typescript and Nuxt 3 was a whole different level for us.

What we learned

Rapyd API is extremely easy to use. When we started 1 week ago, we never thought we would get this far, this quickly.

What's next for Invoice Station

We will wait until August to see if the Auth library is released for Nuxt 3. We will then integrate it and productionize our app. We also want to enable more forms for payment using Rapyd Collect APIs.

Built With

• firebase
• node.js
• rapyd
• typescript
• vuejs