This week, I thought of making a simple invoice application, that lets the user to create an invoice, add items to the invoice and creates a PDF version of that. It is not something new in the market. In fact, I tried to remake this invoice generator, trying to make the UI as similar as that. It is not a copycat though; I’m not that good at CSS. Instead, I focused on the Angular part and another tool called Gulp.js.
- How to name files
- How to make Controllers and Directives
- When to use Services and Factories
- How to use IIFEs to wrap every component of the application
- RTFM for more
It is actually the first time I use IIFEs (Immediately-Invoked Function Expression) in a JS application; I never knew why to use them. If you don’t already know, they’re used to avoid polluting the global scope; probably there is already a dependency using the same variable name as you.
For starters, Gulp is a task automation tool. Just like Maven, Gradle and similar other tools, it makes sure to automate some tasks for the developer, simplifying work and easing the process.
Also, Rails appends a hash value to the name of the compiled files, which is created upon the content of the files. So the files are cached in the user browser and re-cached when the hash value changes (when the content of the files changes).
build/app.js. Is this file which is included in the HTML page. The same thing applies to SASS. Also, I used Gulp to create a live-reload service for the application: whenever I changed anything in the JS or SASS files, the page is automatically refreshed and the view is updated. It can be very helpful when developing with more than one screen: one for writing code and the other one for actually seeing the application running.
Probably later I will add a back-end service to this UI. Right now, I’m thinking about using Node.js or maybe Rails (or any other Ruby framework), but even Java might be an alternative, with Spring Framework or Spark.
And that’s it for the second week! You can find the source code in this GitHub repository, you can fork it and change anything if you want to. If you want to ask me anything, leave a comment below.