Part 1 — Laravel Vue Inertia — See the Project We Will Build
Hello, everyone. This is my first ever writing tutorial that is written on Medium. I hope you give me feedback so in the future I will write a better tutorial. First, before we dirty our hands, it’s better for us to understand the whole project we will build. Let’s go!
Part 1 — Laravel Vue Inertia — See The Project We Will Build ←We’re here.
Part 2 — Laravel Vue Inertia — Explaining Why We Choose Them
Next part is coming soon!
In this tutorial, we will make a simple website for school library. Yes, we will make a library management system. Library management system is a system to manage all entities in library. It’s responsible for managing books, the readers, and handing all the transaction happened (borrow or return a book from library). It only has one user, admin or staff that responsible for managing the whole library. For clearance, let’s see the Entity/Relationship Diagram below.
From the diagram above, it can be used as a blueprint for our database scheme. It also explains the whole process in our application. The question is, How?
First, I will explain the user flow. Let’s assume that we are a staff in a school library. When a student came to library to borrow a book, then the student would have come to us. We ask them to give us their library member card and for how long they borrow the book. Then, we input their id number, book id (we’re not using ISBN in this tutorial) , and the date returning the book to our application. Once the data is stored, it will print out an invoice that must be keep. If the return date come, they must show that invoice. That’s the end-to-end process in our app.
Second, I will also show you a little bit explanation about the database scheme. From the diagram above, we can see that the diagram has 5 entities (rectangle shows an entity) and each entity has attributes (ellips shows an attribute). What does an entity mean? Well, it’s safe to say that in our application an entity is equal to a table. So does the attribute associated with it, it represents the column in table. What about a transaction entity? Why does it differ from the other entity? It’s called associative entity. Entity that connects two entities with M:N cardinality. But, for now don’t mind it if you were confused. We are not talking about ERD or database in this tutorial.
Let’s examine all 5 entities we’ve talked before. Entity means table. Take a look at list below.
- Staff table. It has 2 column. Id and name.
- Author table. It has 2 column, same as staff.
- Book table. It has 5 column. Id, title, year, description, and author_id. One book is must be written by an author.
- Reader table. It has 2 column. Id and name. (I’m sorry mistyped in the diagram above)
- Transaction table. It has 5 column. Id, book_id, reader_id, return_date, and borrow_date. Each transaction (borrow/ return a book) is definitely done by a reader with at least one book.
You might be wondering, why does all tables have an at least one id column? Think of every record in a data is unique. How to identify it as an unique record? We name it with id. Simple.
What we’ve studied in this section?
- We will build a simple library management system.
- Examining the application ERD.
- The database scheme.
That’s all for introduction in our application. Next article we will learn the tools we would be using. Laravel, Inertia, and Vue JS.
If you have a feedback or question, please leave a comment below. If you find it useful, please share and like this article. Thank you.
Cheers, Nur Sabilly.
