Very cool. Sometimes I receive invoices in the mail that give me the option to pay online. However most of the sites require a sign up and account. The smarter sites have a widget that allows you to type in your unique invoice id and pay without signing up.
This has always seemed like a possible opportunity for a SaaS product in my opinion. Essentially you'd let the site generate the invoices using your code. Give them a snippet to put on their site and handle the payment processing. Maybe give them a dashboard to see all their data.
- consider putting initial focus on the item description field and possibly using a textarea over input
- in alternating rows with white background it's difficult to determine what can be updated
- as this is desktop targeted, I'd consider throwing a hover style over the fields which are in fact editable
- rather than trying to rework styling of form elements, use the hover effect as described above and the ng-if (or ng-show/ng-hide) to toggle between the input field and text based element
- print mode you can still edit, as noted in another comment there really shouldn't be a print mode, you should have a print stylesheet to hide what you don't want on there and format everything else appropriately
- consider localStorage for the most recent invoices created, also helps with the "oh shit, I just navigated off the page with 100 line items"
these are really good feedback notes, I'll add these in into our roadmap. We were actually planning to do simple Firebase based backend integration so that people can actually save their invoices and just send out links etc.
This would be a really good idea. I've been using http://invoicemachine.com/ for a few years and I like how you can save the invoices and automatically email them out on a schedule (my client had monthly maintenance work). They let you export it in different formats like a PDF which is helpful too.
I think the print mode button is valuable. It provides an affordance that shows you you can turn of the GitHub notice and footer, and use this for actual invoices. Lots of people don't know about print-only style sheets, and how many people are going to print-preview the page as opposed to click a button out of curiosity?
I'd still keep a print button; not a enable/disable, but at least a button that triggers `window.print()`. "Print" buttons may seem useless, but they do serve as a simple bit of advertisement that "Yes, this page is print-friendly!"
Nicely done! The idea of using localstorage has been mentioned a couple times, For a couple fields localstorage does make sense. We were aiming more of a Firebase like backend support so that one is able to send out just links to invoices.
HN community has definitely given us a few ideas and we look forward to implement a couple of those.
Neat. In working with Angular it has definitely seemed that it is particularly well suited to building single-purpose form-based apps (because building really simple things in Angular is shockingly easy). I've had a few ideas like this one. Maybe this will motivate me :)
Would like to say this was my own idea, but I stole it from another HNer in one of the thousands of "what should I build?" threads. Do a search for Excel or Google Doc templates and find one that is popular. Build it into a single-purpose app like this. Great for building a little portfolio, making yourself known, and generally making the web a better place.
based on our working experience with Angular so far, it is well suited for both large and small applications. We are actually working on one project in Angular right now which is much more ambitious and frontend heavy than what this link is currently capable to show..
This has always seemed like a possible opportunity for a SaaS product in my opinion. Essentially you'd let the site generate the invoices using your code. Give them a snippet to put on their site and handle the payment processing. Maybe give them a dashboard to see all their data.
Embeddable Invoices.