Why Invoicerr is the Ultimate Game Changer for Freelancers

Freelancing can be a rewarding career, but managing finances and paperwork can be a nightmare. Invoicerr is here to change that. This open-source invoicing app is designed specifically for freelancers, making it easy to create quotes, generate invoices, track payments, and collect secure signatures. Let's dive into why Invoicerr is the game changer you've been waiting for.

What is Invoicerr?

Invoicerr is a freelance-focused invoicing application that streamlines the process of managing quotes and invoices. Created by Impre-visible, Invoicerr is built with freelancers in mind, offering a clean interface and robust features to help you get paid faster and with less hassle. With its growing popularity, Invoicerr is trending now as a must-have tool for freelancers worldwide.

Key Features

Invoicerr packs a punch with its feature set. Here are some of the standout capabilities:

Create and manage invoices: Easily generate professional invoices.
Create and manage quotes: Convert quotes to invoices seamlessly.
Client management: Keep track of client details and communication.
Track status: Monitor the status of quotes and invoices (signed, paid, unread, etc.).
Secure signatures: Built-in quote signing system with secure tokens.
Email integration: Send quotes and invoices directly from the app.
PDF generation: Generate clean PDF documents for quotes, invoices, and receipts.
Custom branding: Add your logo, company name, VAT, and more.
Authentication: Secure login via JWT or OIDC.
International-friendly: Default English UI with customizable currencies.
Database options: SQLite for quick local setup or PostgreSQL for production.
Self-hosting ready: Docker and docker-compose ready for easy deployment.
Modern tech stack: Built with React, NestJS, Prisma, and more.
REST API: Backend ready for future integrations.
Plugin system: Extend functionality with community-made features.

Use Cases

Invoicerr shines in various real-world scenarios. Here are a few examples:

Freelance Designers

Freelance designers often juggle multiple clients and projects. Invoicerr allows them to create detailed quotes and invoices, track payments, and manage client information all in one place. The ability to send secure quotes and collect signatures ensures a smooth workflow.

Freelance Developers

For freelance developers, Invoicerr provides a streamlined way to manage project quotes and invoices. The REST API backend makes it easy to integrate with other tools, and the secure signature feature ensures that agreements are legally binding.

Freelance Writers

Freelance writers can use Invoicerr to create professional invoices and track payments. The clean UI and efficient workflow make it easy to manage multiple clients and projects.

Small Business Owners

Small business owners can leverage Invoicerr to manage invoices for their freelance work. The custom branding options allow them to maintain a professional image, and the secure signature feature ensures that all agreements are legally sound.

Step-by-Step Installation & Setup Guide

Docker Installation (Recommended)

Supported Architectures

linux/amd64 (x86_64)
linux/arm64/v8 (ARMv8)

Why not `linux/arm/v7`?

The linux/arm/v7 architecture is not supported due to the use of Prisma, which does not provide prebuilt binaries for this architecture.

Quick Start

Clone the repository:

git clone https://github.com/Impre-visible/invoicerr.git
cd invoicerr

Edit the docker-compose.yml to set your environment variables.
Run the app:
```
docker compose up -d
```
Open your browser at:
```
http://localhost
```

Environment Variables

These environment variables are defined in docker-compose.yml under the invoicerr service:

DATABASE_URL PostgreSQL connection string. Example: postgresql://invoicerr:invoicerr@invoicerr_db:5432/invoicerr_db
APP_URL Full public URL of the frontend (e.g., https://invoicerr.example.com).
SMTP_HOST, SMTP_USER, SMTP_PASSWORD Credentials and server used for sending emails.
SMTP_FROM Optional — address used as the sender for emails. If omitted, defaults to SMTP_USER.
JWT_SECRET Optional but recommended for JWT authentication. Can be any random string.

Manual Installation (Local Development)

Prerequisites

Node.js v20+
SQLite (or configure another DATABASE_URL)
PNPM or NPM

Steps

Clone the project:

git clone https://github.com/Impre-visible/invoicerr.git
cd invoicerr

Backend setup:

cd backend
npm install
npx prisma generate
npm run start

Frontend setup (in a new terminal):
```
cd frontend
npm install
npm run start
```
Open in your browser:
- Frontend: http://localhost:5173
- API: http://localhost:3000

Real Code Examples from the Repository

Backend Setup

Here's how you can set up the backend for Invoicerr:

// Backend setup
const express = require('express');
const app = express();
const prisma = require('./prisma');

app.use(express.json());

app.post('/invoices', async (req, res) => {
  const { client, items, total } = req.body;
  const invoice = await prisma.invoice.create({
    data: {
      client: {
        create: client,
      },
      items: {
        createMany: { data: items },
      },
      total,
    },
  });
  res.json(invoice);
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

This code sets up an Express server and uses Prisma to interact with the database. The create method is used to insert a new invoice into the database.

Frontend Setup

Here's how you can set up the frontend for Invoicerr:

// Frontend setup
import React, { useState } from 'react';
import axios from 'axios';

function InvoiceForm() {
  const [client, setClient] = useState('');
  const [items, setItems] = useState([]);
  const [total, setTotal] = useState(0);

  const handleSubmit = async (event) => {
    event.preventDefault();
    const response = await axios.post('http://localhost:3000/invoices', {
      client,
      items,
      total,
    });
    console.log(response.data);
  };

  return (
    <form onSubmit={handleSubmit}>
      <input
        type='text'
        value={client}
        onChange={(e) => setClient(e.target.value)}
        placeholder='Client Name'
      />
      <input
        type='number'
        value={total}
        onChange={(e) => setTotal(Number(e.target.value))}
        placeholder='Total Amount'
      />
      <button type='submit'>Create Invoice</button>
    </form>
  );
}

export default InvoiceForm;

This code sets up a simple React component to create a new invoice. The axios library is used to send a POST request to the backend.

Generating PDF Documents

Here's how you can generate PDF documents for invoices:

// Generating PDF Documents
const pdf = require('pdfkit');
const fs = require('fs');

function generateInvoicePDF(invoice) {
  const doc = new pdf();
  doc.text('Invoice', 100, 50);
  doc.text(`Client: ${invoice.client.name}`, 100, 100);
  doc.text(`Total: ${invoice.total}`, 100, 150);
  doc.pipe(fs.createWriteStream('invoice.pdf'));
  doc.end();
}

// Example usage
generateInvoicePDF({
  client: { name: 'John Doe' },
  total: 1000,
});

This code uses the pdfkit library to generate a PDF document for an invoice. The text method is used to add text to the PDF, and the pipe method is used to save the PDF to a file.

Advanced Usage & Best Practices

Pro Tips

Customize your brand: Add your logo and company details to make your invoices look professional.
Use environment variables: Keep your configuration secure by using environment variables for sensitive information.
Regular backups: Ensure your data is safe by regularly backing up your database.
Monitor performance: Keep an eye on your application's performance and optimize as needed.

Optimization Strategies

Database indexing: Use database indexes to speed up query performance.
Caching: Implement caching to reduce load times and improve user experience.
Load balancing: Use load balancing to distribute traffic and ensure high availability.

Comparison with Alternatives

Feature	Invoicerr	Alternative 1	Alternative 2
Open Source	Yes	No	No
Custom Branding	Yes	Limited	Limited
Secure Signatures	Yes	No	No
REST API	Yes	No	No
Self-Hosting	Yes	No	No
Modern Tech Stack	Yes	No	No

FAQ

How do I install Invoicerr?

You can install Invoicerr using Docker or manually. Follow the installation guide in the README for detailed instructions.

Is Invoicerr free to use?

Yes, Invoicerr is open source and free to use under the AGPL-3.0 license. There is also a commercial license available for commercial use.

Can I customize the branding?

Yes, you can add your logo, company name, VAT, and more to customize the branding.

Is Invoicerr secure?

Invoicerr uses JWT or OIDC for authentication and secure tokens for signatures, ensuring your data is safe.

How do I report an issue?

You can report issues on the GitHub Issues page.

Can I contribute to Invoicerr?

Yes, contributions are welcome! Check out the Contributing Guide for more information.

Conclusion

Invoicerr is a powerful tool for freelancers looking to streamline their invoicing process. With its robust feature set, modern tech stack, and open-source nature, it's a game changer in the world of freelance invoicing. Check out the Invoicerr GitHub repository to get started today and take control of your invoicing workflow.