I created a full stack open source invoicing application using the MERN stack

Hello All,
This happen to be my first post since I join this forum in 2019 and I’m happy to share with you a side project I’ve been working on for some months now. Having gone through many web projects on Github, I noticed that these projects are mostly ecommerce or blog sites, so I decided to do something different in order to challenge myself and to up my skills in software development.
I build a full stack invoicing application, using the MERN stack (MongoDB, Express, React & Nodejs). This app is specially designed for freelancers and small businesses, but can be used for almost any type of business need. With this application, you can send beautiful invoices, receipts, estimates, quotes, bills etc to your clients. I have made the Source code available in my GitHub profile for anyone who is interested. You can also find a Demo link in the Github repo of this project.

Key Features

• Send invoices, receipts, estimates, quotations and bills via email
• Generate and send/download pdf invoices, receipts, estimates, quotations and bills via email
• Set due date.
• Automatic status change when payment record is added
• Payment history section for each invoice with record about payment date, payment method and extra note.
• Record partial payment of invoice.
• Clean admin dashboard for displaying all invoice statistics including total amount received, total pending, recent payments, total invoice paid, total unpaid and partially paid invoices.
• Multiple user registration.
• Authentication using jsonwebtoken (jwt) and Google auth

Technologies used

This project was created using the following technologies.

Client

• React JS
• Redux (for managing and centralizing application state)
• React-router-dom (To handle routing)
• Axios (for making api calls)
• Material UI & CSS Module (for User Interface)
• React simple Snackbar (To display success/error notifications)
• Cloudinary (to allows users to upload their business logo)
• Apex Charts (to display payment history)
• React-google-login (To enable authentication using Google)

Server

• Express
• Mongoose
• JWT (For authentication)
• bcryptjs (for data encryption)
• Nodemailer (for sending invoice via email)
• html-pdf (for generating invoice PDFs)

Database

MongoDB (MongoDB Atlas)

I have written a detailed documentation of how to run this project locally, and it can be found in the readme file of the project repository here.

I intend to keep adding more features to this application, so if you found this project interesting, please give it a star, it will encourage me a lot.

Comments

[Sparshsing]

I had built something similar but not so many functionalities. I can understand the amount of time and effort required. really appreciate your effort in this.

[Panshak]

Thanks so much. I really appreciate.

[Shayan]

I am creating a community for developers, would you be interested to join?

discord.gg/ncRsYT33uG

[Sparshsing]

I have joined.

[Prabhu]

I have gone through ur app . I noticed one issue there. The issue is that if u login with wrong credentials it says user does not exist as it's correct but the loader which comes in place of login button keeps moving continuosly which is supposed to stop once back end sends response to frond end. I hope u are aware of this issue. If you are not aware of this issue then I think u should look into it.

[Panshak]

Thanks so much for reporting. I'll definitely look at it.

[Jefry Pozo]

Congratulations on a well done project 👏
I'm interested in the database structure, I'm new to NoSQL databases and I'm having a time understandimg how to organize related data. Any advice in that aspect?

[Panshak]

Thanks very much. Can you give an example of what you wanted to do?

[Carl-W]

There's a lot of interesting code in this project to look at, even is one is not looking for this particular application. Many of the bits and pieces inside are universal to most apps and are worth to take a look at.

Thanks for sharing!

[Panshak]

Very true. Thanks so much

[DARPAN ANEJA]

Superb project mate. Truly inspiring!!!

[Panshak]

Thanks so much.

[Arun K]

Awesome, i would love to try that. But would like to know if you have any documentation describing features, implementation. So that i can take up as user stories and develop each feature and hopefully do similar as urs

[Panshak]

Thanks so much. There's no documentation describing features yet. But I'll definitely look into it.

[Josh]

Dude, this is legit. I'll take a look at it later this weekend.

[Panshak]

Thanks very much. I'll really appreciate your feedback.

[michaelguch]

Hi Panshak, great work. Am in Abuja. How can I contact you please?

[Panshak]

Thanks bro. Feel free to shoot me a mail. My email is in my github profile

[michaelguch]

Baa yawa. I go Hala you.

[francisco-louro]

Thanks a lot for this contribute. I'll definitely use it for a small business experiment.

[Panshak]

Thanks so much, and I'm glad this will help.

[SnuppeDeluxe]

Something like this is a project idea for me, too. I will check your code for inspiration 😘

[RamR]

Thanks buddy, thanks for sharing I have given one star

[Panshak]

Thanks so much. I really appreciate.

[Anuj]

How much did it took for you to build this?
Also I have just learned MERN, so how much time should it take for me to build?

[Panshak]

It took me close to 6 months but I wasn't working on it full time.

[Arthur]

Good job on that !

[Panshak]

Thanks very much

[Busari Ridwan]

This is awesome! 👌 You did a great job with that.

[Panshak]

Thanks so much.

[Sparshsing]

Hi. Do you want to say something?