64 lines
2.1 KiB
Plaintext
64 lines
2.1 KiB
Plaintext
---
|
||
title: "Invoice"
|
||
date: 2023-08-21
|
||
cover: ./images/bg.jpg
|
||
icon: "/projects/invoice.svg"
|
||
tags: ["sveltekit", "unocss", "prisma", "sqlite"]
|
||
toc: true
|
||
links:
|
||
[
|
||
["live", "https://invoice.app.max-richter.dev"],
|
||
["git", "https://git.max-richter.dev/max/invoice"],
|
||
]
|
||
---
|
||
|
||
import bg from './images/bg.jpg'
|
||
import invoices from './images/invoices.png'
|
||
import customers from './images/customers.png'
|
||
import editCustomers from './images/edit-customer.png'
|
||
import editProfile from './images/edit-profile.png'
|
||
import overview from './images/overview.png'
|
||
import ImageSlider from '@components/ImageSlider.svelte'
|
||
import Image from '@components/Image.astro'
|
||
|
||
|
||
# Introduction
|
||
|
||
In my free time, I like to take on small jobs, such as deliveries, setups, and pickups for others.
|
||
|
||
An unavoidable part of these tasks is creating invoices in PDF format. Initially, I followed a manual process and created my first invoices in Figma. But as programmers often say:
|
||
|
||
> Why do something manually in 5 minutes when I can automate it in 24 hours?
|
||
|
||
This thought led to my latest hobby project – **"Invoice."**
|
||
|
||
<ImageSlider title="Invoice Screens" client:load>
|
||
<Image src={invoices} alt="Invoices" />
|
||
<Image src={customers} alt="Customers" />
|
||
<Image src={editCustomers} alt="Edit Customers" />
|
||
<Image src={editProfile} alt="Edit Profile" />
|
||
<Image src={overview} alt="Overview" />
|
||
</ImageSlider>
|
||
|
||
# Development
|
||
|
||
During development, I always kept the principle 'K.I.S.S.' in mind: Keep it simple, stupid. For this project, that meant choosing "boring" but well-known technologies:
|
||
|
||
## [🚀 SvelteKit](https://kit.svelte.dev)
|
||
For an efficient and reactive user interface.
|
||
|
||
## [🎨 UNOcss](https://unocss.dev/)
|
||
The faster alternative to Tailwind.
|
||
|
||
## [🌍 TypesafeI18n](https://github.com/ivanhofer/typesafe-i18n)
|
||
To enable multilingual support without complex logic.
|
||
|
||
## [🛠️ Prisma](https://prisma.io)
|
||
As a database access layer for smooth data management.
|
||
|
||
## [🗃️ SQLite](https://www.sqlite.org/index.html)
|
||
As a reliable backend, ideal for small projects.
|
||
|
||
## [📄 Playwright](https://playwright.dev)
|
||
For generating PDFs.
|