Software Engineer ·
Needs advice
on
Vue.js
Lumen
and
Laravel

Hello everyone,

I have a final-study project, and I'm responsible for making decisions for what frameworks to use (both front-end and back-end) and the software architecture to adapt.

The project is a web application for a concrete company. The main goal is to calculate what is called OEE (Overall Equipment Effectiveness), meaning simply the efficiency of the machine. The calculation and display of OEE will be in real-time, meaning that this rate will be updated every two minutes, and it will appear in a graph. Also, we have the state of the machines to display whether the machines are working just fine or there is some problem.

This will be done using IoT, meaning that important data will be sent from the machine to the web application that I will create via the API (someone else will be responsible for this matter). Of course, the application will include employees, factories, as well as machines, ... etc.

The most important thing in the application is real-time performance monitoring of machines and the OEE.

A real example of what we want to do => https://evocon.com/

I choose to use Laravel because : - This type of applications could be implemented by Laravel - Me and my colleague have some knowledge and practice with this framework (choosing other technologies like Node.js means a huge learning curve) - Easy documentation and abandon tutorials

The only reason why I choose Vue.js because It goes well with Laravel (from what I have learned).

The second important question, which software architecture should I adapt ? should I use Microservice Architecture or the normal and well-known Monolithic Architecture? I know the benefits and disadvantages of the first and second methods, but I do not want to make a wrong decision.

If I choose microservice for this project, I will use Lumen (PHP Micro-Framework By Laravel).

Should I use micro-frontend as well? Like VuMS, or it's not necessary for this project?

I don't think that the reasons to choose Laravel are enough, so I want to understand the obstacles that I may face during the development.

In the end, I decided to ask and take expert opinions.

NOTE: this web application will be used by other companies, like in the case of evocon.

If there are tips and things that I must know to accomplish this project, please mention them.

Thank you very much.

READ LESS
8 upvotes·14K views
Replies (3)
Software Engineer, 'Nix SysAd, Agile Pro ·
Recommends
Node.js
Chart.js

There isn't a single stack or framework which is indicated for a problem like this. The important thing is that you are comfortable with the framework you choose.

Ultimately, you're creating a pattern that is common all over the web: API → server → data → browser. The biggest challenge you will encounter in this endeavor is creating the charts, so pick that first. I'd suggest looking more closely at Chart.js first, but there are many other options.

In choosing your stack, work backward from your charting tool: 1. What will be the easiest and most flexible way to get the data into the chart? 2. What will be the easiest and most flexible way to structure the data for the chart?

Then, you can start picking the rest of your stack. Really, you don't need all the wizzbang of Lumen and Vue and microservices. Each library or framework you add will add complexity, reducing performance and stability, and adding time to develop and troubleshoot. Use the fewest libraries possible to keep your code small, simple, and lightweight. With a tool like Chart.js, you need only a way to deliver some html/css/js to a browser, data to the js, and collect data from an api POST.

If you really want to strip all of that down to something super-simple, and already almost done, "IoT" POST data to google-sheets, then retrieve it for your chart directly from the sheet. No server needed, just some browser code. It comes with the benefit that most of your code will be in javascript: update browser cache from sheet, structure for chart, update chart. However, if there is a requirement to have reactive (close to real-time updates without reloading page) charts, you'll have to use Node.js. Vue could do it, but it will be a painful journey getting it working cleanly.

Lastly, IoT is rarely standard API calls. It is almost always in MQTT, which is a completely different rabbit-hole I advise you avoid for now.

READ MORE
5 upvotes·1 comment·8.3K views
Aimad Quouninich
Aimad Quouninich
·
March 25th 2021 at 11:37PM

Thanks for the advice, for that same reason I have chosen Laravel and yes I will also use chart.js as it's open-source.

what do you think about using micro-service architecture for my use case? or maybe it's not necessary?

·
Reply
Technical Lead at DPO International·
Recommends
Kafka

I advise you to use Apache Kafka messaging to keep data and then passing to front-end for showing it in your website

READ MORE
4 upvotes·5 comments·10.4K views
Aimad Quouninich
Aimad Quouninich
·
March 20th 2021 at 1:18PM

If you please, do you have an opinion about the software architecture to adapt to my project?

·
Reply
anas mattar
anas mattar
·
March 20th 2021 at 3:44PM

for architecture you should use real time technologies such as: socket io or SignalR for appearing new data in the page.

your project should flow same this:

data pass to Apache Kafka and then your page retrive a new data from Kafka messaging and for mananging your pages of daskboard you can use such as Laravel or .net asp.net mvc. this is depend on what do you know from programming laguages.

if you have any question chat me

·
Reply
Aimad Quouninich
Aimad Quouninich
·
March 24th 2021 at 12:06AM

Yes, I will use socket io & Laravel, and Apache Kafka per your recommendation (I have looked into it and it's awesome and perfect for my use case, thanks for the recommendation).

I meant by software architecture, whether should I use microservice architecture for my Laravel application or not? normally I don't opt for microservice because of its complexity, cost. But if it's necessary then we have no choice, and to be honest, we don't have the confidence to manage a microservice architecture.

Do I use Apache Kafka just for data coming from IoT devices alongside another DBMS for other storage like (users, factories, ...)? or I will just use Apache Kafka?

I really appreciate your help.

·
Reply
anas mattar
anas mattar
·
March 24th 2021 at 12:11PM

Currently just use Apache Kafaka beecuase it already has a DMBS in it

·
Reply
Aimad Quouninich
Aimad Quouninich
·
April 9th 2021 at 9:49PM

To connect my Laravel API to Apache Kafka I don't need OAuth2 because I'm not intending to use a third-party app, right?

Note: I'm not using microservice architecture I have Vuejs separated from Laravel so laravel will be used for APIs.

·
Reply
View all (3)
Avatar of Aimad Quouninich

Aimad Quouninich

Software Engineer