Όταν αναφερόμαστε σε web application εννοούμε κάθε είδους υπηρεσία η οποία είναι διαθέσιμη μέσω φυλλομετρητη - web browser, αυτό μπορεί από ένα δυναμικό website μέχρι πολύπλοκες εφαρμογές όπως είναι το web mail, τα social media, ψηφιακά αποθετηρία, λογισμικό ηλεκτρονικών καταστημάτων και κάθες είδος εφαρμογή προσβάσιμη μέσω διαδικτύου.

Ο τρόπος λειτουργίας του web application - διαδικτυακής εφαρμογής ξεκινάει από τους χρήστες όταν ανοίξουν ένα web browser όπου ξεκινάει μια σειρά από αλληλεπιδράσεις, αυτές λαμβάνουν χώρα στο παρασκήνιο μεταξύ του web browser - φυλομμετρητή και του web server.

Το γενικότερο σύστημα που ενώνει όλη αυτήν την αλληλουχία και ορίζει τους κανόνες για την προβολή των δεδομένων ονομάζεται αρχιτεκτονική ενός web application.

Τι είναι web application με απλά λόγια; Είναι πρόγραμμα που αποθηκεύεται σε έναν απομακρυσμένο server και η χρήση γίνεται μέσα από ένα web browser.

Τα μέρη Web Application Architecture Components

Τα μέρη που το αποτελούν είναι το middleware, οι βάσεις δεδομένων και η σύνδεση με άλλες εφαρμογές μέσω web services, η ροή της πληροφορίας που εμφανίζεται στου χρήστες και των διάφορων διεργασιών που εκτελούνται ορίζονται από κανόνες business logic σε επίπεδo authentication και authorization.

Σε ένα τελικό λειτουργικό αποτέλεσμα μπορούμε να φτάσουμε,  ανεξάρτητα από την τεχνολογία με την οποία έχει κατασκευαστεί το κάθε web app. Αυτό επιτυγχάνεται έχοντας χρησιμοποιήσει μια οποιαδήποτε ομάδα από γλώσσες προγραμματισμού σε επίπεδο server side ή client side.

1) Web Browser Δηλαδή όταν χρήστης πληκτρολογεί ένα URL και πατήσει "GO" o φυλλομετρητής θα βρει τον υπολογιστή όπου "υπάρχει" το website και του ζητλησει μια συγκεκριμένη ιστοσελίδα. Οπότε η αρχιτεκτονική αποτελείται από δύο βασικά μέρη το client-side (browser) και το server-side (διακομιστής).

2) Web Server τα αιτήματα που έρχονται από τους clients, δρομολογούνται στα σωστά σημεία μιας εφαρμογή end points, που μπορούν να τρέχουν από σύγχρονες server-site τεχνολογίες όπως το NodeJS.

3) Database Server  αποθηκεύσει αλλά και κάνει διαθέσιμα τα δεδομένα για την εφαρμογή. Χειρίζεται εργασίες που σχετίζονται με δεδομένα. Σε μια πολυεπίπεδη αρχιτεκτονική, οι διακομιστές βάσεων δεδομένων μπορούν να διαχειρίζονται το business logic μια εφαρμογής.

Οι εφαρμογές γίνονται πιο περίπλοκες οπότε οι developers που έχουν αναλάβει απαιτητικές εφαρμογές θα πρέπει να έχουν ευκολία και αρκετή τεχνογνωσία στο να εργάζονται και σε όλα τα μέρη της εφαρμογής, αν θέλετε να προσλάβεται ειδικούς στο web development επικοινωνήστε μαζί μας.

Η γενική λειτουργία σε μια διαδικτυακή εφαρμογή

Οι εφαρμογές web αποτελούνται δύο βασικά λειτουργικά μέρη, όπου το καθένα εκτελεί τη λειτουργία σε κώδικα ξεχωριστά και σε διαφορετικό χρόνο, αλλά ταυτόχρονα συνεργάζονται ώστε να παρέχουν ένα τελικό αποτέλεσμα.

1. Το πρώτο μέρος - browser rendering περιλαμβάνει το λογισμικό που εκτελείται απευθείας στο browser  client-side. H λειτουργία ξεκινάει από τη στιγμή που ένας χρήστης φορτώσει το application ή και αρχίσει να εισάγει απευθείας δεδομένα στη διεπαφή - user interface. Τις περισσότερες φορές αυτό το μέρος είναι γραμμένο σε Javascript ή σε Frameworks βασισμένα σε αυτή τη γλώσσα VueJs, ReactJS και Αngular.

2. To δεύτερο μέρος - server side processing είναι το λογισμικό που εκτελείται από την πλευρά του εξυπηρετητή - server side και επιστρέφει τις ανάλογες πληρoφορίες όπου γίνονται request από τον υπολογιστή-πελάτη client side μέσω του πρωτοκόλλου HTTP.

web development τι είναι;

Είναι η διαδικασία προγραμματισμού όπου ο developer δημιουργεί μια εφαρμογή web, με τη οποία μπορεί να έχει απλά μόνο μια διεπαφή - user interface να είναι προσβάσιμη μέσω web browser για εργασίες που απαιτούν  χειρισμό δεδομένων. Επιπλέον μπορεί να περιλαμβάνει διασύνδεσες με συστήματα άλλων πληροφοριακών συστημάτων ή με πολλαπλούς clients όπως είναι τα mobile apps.  

Yπάρχουν πολλοί τρόποι και τεχνολογίες όπου κάποιος μπορεί να φτάσει σε ένα τελικό αποτέλεσμα. Η κάθε μια τεχνολογία, γλώσσα προγραμματισμού ή web framework έχει τα δικά του πλεονεκτήματα και μειονεκτήματα, οπότε η επιλογή σε project μπορεί να εξαρτάται από το χρόνο υλοποίησης, τη ποιότητα του πηγαίου κώδικα καη βελτιστοποίηση του με code refactoring, τη σχεδίαση του user interface αλλά και το επίπεδο και τη διαθεσιμότητα του εργατικού δυναμικού.

Μοντέρνες αρχιτεκτονικές για web applicationς

Single-page applications (SPA)

Οι μοντέρνες εφαρμογές που περιλαμβάνουν πολλά μέρη σύνθετα στοιχεία σε μια ιστοσελίδα όπως είναι πλέγματα grids, οι λίστες δεδομένων όπου είναι προτιμότερο να κατασκευαστούν ως SPA. Εδώ προσφέρεται καλύτερη εμπειρία χρήση όσον αφορά πλοήγηση και αναζήτηση δεδομένων, συγκεκριμένα η εφαρμογή "φορτώνεται" μόνο μια φορα στο browser και στη συνέχεια ανανεώνονται δυναμικά τμήματα αυτή της ιστοσελίδας, όπου αντίθετα με το συνηθισμένο τρόπο φορτώνονται συνεχώς καινούργιες σελίδες.

Μια άμεση συνέπεια είναι καλύτερο User Experience, στο Single-page web, όπου ο χρήστης έχει πιο δυναμική αλληλεπίδραση με το app. Αυτή η περίπτωση είναι καλύτερα να δημιουργείται σε διαδικτυακές εφαρμογές όπως είναι ένα ERP όπου ο παράγοντας του Search Engine Optimization δεν παίζει κεντρικό ρόλο στην τεχνική σχεδίαση και λειτουργία της εφαρμογής, αυτό είναι αντίθετο σε μια εφαρμογή όπως ένα online store όπου θα είχε να γίνει SPA μόνο στο κομμάτι του Checkout Cart.

Microservices

Αυτός ο τύπος διαχωρίζει τις λειτουργίες ενός συστήματος σε ομάδες που τις ονομάζει μικροϋπηρεσίες. Με αυτό τον τρόπο έχουμε πολλά ανεξάρτητα μέρη όπου το καθένα είναι υπεύθυνο γύρω από μια συγκεκριμένη επιχειρηματική λειτουργία (business domain), και επικοινωνεί με τα υπόλοιπα μέσω application programming interfaces (APIs).

Η GoLang αποτελεί μια διαδεδομένη γλώσσα για microservices και data pipelines έχοντας ως βασικό χαρακτηριστικό concurrency model

Αυτό έχει ως αποτέλεσμα τη μεγαλύτερη ευελιξία για γρήγορη προσθήκη καινούργιων χαρακτηριστικών, επιπλέον επιτρέπει σε αυτές τις αυτόνομες  ομάδες λειτουργίας να κατασκευαστούν σε διαφορετικές γλώσσες προγραμματισμού και τεχνολογίες. Γενικά αυτό ο τύπος αρχιτεκτονικής λογισμικού θα μπορούσε να χαρακτηριστεί ως μια μορφή του service-oriented architecture.

Serverless architecture

Είναι ένας τρόπος που επιτρέπει σε εφαρμογές να λειτουργήσουν και να εκτελέσουν διεργασίες χωρίς να υπάρχει η ανάγκη συντήρησης πληροφοριακών υποδομών ή τη χρήση συγκεκριμένων τεχνολογιών οπότε δε υπάρχει ανάγκη από system administration να παρακολουθεί την ομαλή λειτουργία υπολογιστικών πόρων στο backend.

Για παράδειγμα κάποιος μπορεί να σχεδιάσει λειτουργίες όπως για παράδειγμα ένα function στην πλατφόρμα Amazon Lambda. Σε αυτή τη περίπτωση πληρώνει μόνο για όσες φορές εκτελείται το συγκεκριμένο function.

Αφού κάναμε μια σύντομη περιγραφή της έννοιας διαχωρισμού ενός web application σε δύο βασικά μέρη client side και server side,καθώς με μια σύντομη περιγραφή μοντέρνων μορφών αρχιτεκτονικής στη συνέχεια θα δούμε τι εργαλεία υπάρχουν και αυτό στις βασικές γλώσσες προγραμματισμού καθώς και σε υπάρχοντα framework όπως είναι Python με το Django, .NET, Java enterprise development, Node.js, PHP  κτλ.

Progressive Web Apps

Ένα progressive web app (PWA) είναι μια ιστοσελίδα που συμπεριφέρεται όπως ένα mobile application. Τα PWAs σχεδιάζονται για να κάνουν χρήση χαρακτηριστικών των smartphones χωρίς όμως ο χρησης να το κατεβάζει μέσα από app store.

Web Frameworks και γλώσσες προγραμματισμού

Python web development

H python είναι μια γλώσσα προγραμματισμού η οποία είναι εύκολη στην εκμάθηση και ταυτόχρονα αρκετά ισχυρή για να υποστηρίξει πολύπλοκες εφαρμογές, είναι ιδιαίτερα δημοφιλής στο start-up ecosystem.

Το πιο δημοφιλές framework είναι το Django, επιπλέον υπάρχουν διαθέσιμες πολλαπλές βιβλιοθήκες λογισμικού όπου αφορούν data analysis, machine learning αυτό μάλλον επειδή είναι η αγαπημένη γλώσσα των επιστημόνων λόγω της απλότητας της. Όσον αφορά το development μπορούν να βρεθούν api wrappers για τα web services της Google, της Amazon κτλ..

PHP web application

Η PHP είναι μια από τις πιο δημοφιλής γλώσσες προγραμματισμού web με μεγάλο πλήθος εργαλείων και web frameworks όπως είναι το Laravel, το Symfony και πολλά άλλα. Η συγκεκριμένη γλώσσα βρίσκεται πίσω από καθιερωμένα συστήματα διαχείρισης περιεχομένου όπως το wordpress καθώς και ηλεκτρονικού εμπορίου.

Διαθέτει μεγάλη κοινότητα developers και είναι κατάλληλη για εφαρμογές που είναι έντασης input-out data σε βάση δεδομένων, καθώς και για δημιουργία backend API σε εφαρμογές mobile.

Node.js web application

Το Node.js είναι ένα runtime environment το οποίο δίνει τη δυνατότητα στα προγράμματα javascript που αρχικά λειτουργούσαν στη πλευρά του browser να εκτελεστούν και ως server-side. Το κύριο χαρακτηριστικό που συναντάμε εδώ είναι το event-driven programming, με χαρακτηριστικά non-blocking I/O. Αυτό σημαίνει ότι node έχει μια μονονηματική διαδικασία που πετυχαίνει non-blocking μέσω ενός event-loop.

Το Javascript με το Νode.js αποτελούν ολοκληρωμένη τεχνολογία για full-stack development frameworks με τις ΜΕΑΝ Stack και MERN Stack

Εφαρμογές που χτίζονται χρησιμοποιώντας το nodejs είναι για δημιουργία Api υψηλής διαθεσιμότητας και ταυτόχρονα έχουν ένταση συγχρονισμού όπως είναι τα chat όπου ανήκουν στις εφαρμογές πραγματικού χρόνου real-time applications.

NestJS

NestJS ένα a framework για αποτελεσματικα  Node.js web applications, χρησιμοποιεί JavaScript με υποστήριξη του Typescript και GraphQL.

NextJs

Είναι η κορυφαία επιλογή ποιότητα και προτύπων λαμβάνουν λύνουν προβλήματα όπως τα core web vitals, αυτόματο code splitting, typescript, server side rendering και σχεδιασμένο για performance -driven applications

Laravel web development

Laravel, είναι άλλο ένα PHP web framework το οποίο χρησιμοποιεί τη τεχνική του model view controller MVC όπου είναι γραμμένο σε πολύ ποιοτικό κώδικα κάνοντας χρήση από γνωστά patterns λογισμικού όπως είναι υλοποίηση του  Laravel service container.

Έχει απλό και αποτελεσματικό σύστημα routing, authentication, caching και ένα αποδοτικό object-relational mapper για την εύκολη πρόσβαση στη βάση δεδομένων και μαζί με το σύστημα unit testing και έτοιμες βιβλιοθήκες async development αποτελούν ένα σταθερό εργαλείο για την ανάπτυξη λογισμικού web.

Το  PHP Laravel προσφέρει ασφάλεια  cross-site request forgery tokens με μόνο μειονέκτημα τη διαδικασία των αναβαθμίσεων, ταιριάζει μικρές και μεσαίες επιχειρήσεις.

Dart web application

Η γλώσσα Dart είναι μια γλώσσα που δημιουργήθηκε από την Google βελτιστοποιημένη ειδικά για τη κατασκευή mobile apps με αυτήν τη γλώσσα έχουμε φτιάξει τη δική μας εφαρμογή για τον υπολογισμό μισθού. Επιπλέον μπορεί να χρησιμοποιηθεί για τη δημιουργιά web apps με αυτήν.

Αν χρειάζεστε ειδικά features όπως ασύγχρονο προγραμματισμό async-wait για βελτιστοποίηση διεπαφών με isolate-based concurrency ίσως θα πρέπει να λάβετε υπόψη, αν κατασκευάζεται web-based εφαρμογές που σχετίζονται με την πλήρη ακεραιότητα δεδομένων όπως είναι οι εφαρμογές για μεταφορά χρημάτων.

Στη συνέχεια από τις μεμενομένες γλώσσες θα δούμε παρακάτω τις πλατφόρμες ανάπτυξης δηλαδή σύνολα εργαλείων

.NET web application

Μια άλλη δημοφιλής πλατφόρμα ιδιαίτερα στο χώρο μικρομεσαίων επιχειρήσεων προέρχεται από την Microsoft, η οποία έχει αναπτύξει αυτό το software development framework. Συγκεκριμένα για τη περίπτωση της δημιουργίας δυναμικών ιστοσελίδων έχει asp.net core με το οποίο δίνεται έμφαση στο cross platform development για cloud εφαρμογές.

Lamp Stack

Το είναι ένα από τα πιο δημοφιλή σύνολα εργαλεία για την ανάπτυξη διαδικτυακών εφαρμογών συνήθως περιλαμβάνει το λειτουργικό σύστημα linux (L), to λογισμικό του εξυπηρετητή HTTP server Apache (A), το σύστημα βάση δεδομένων MySQL (M) και η γλώσσα προγραμματισμού δυναμικών ιστοσελίδων PHP (P) όπως προαναφέραμε.

Multi-tenant environment σε εφαρμογές cloud

Στις εφαρμογές Cloud τύπου SaaS η ακεραιότητα, η ασφάλεια και διαχωρισμός των δεδομένων από τους άλλους χρήστες της εφαρμογής είναι εξαιρετικά σημαντικό. Μια επιλογή σε αυτή την περίπτωση είναι η χρήση της αρχιτεκτονική multi-tenant όπου ο κάθε χρήστης μέσα από μια εφαρμογή έχει τη δική του βάση δεδομένων για τα δεδομένα του.

Οπότε χρειάζεται μια προχωρημένη διαχείριση από την εφαρμογή σε πολλαπλές συνδέσεις στις βάσεις. Το Salesforce από τις επιτυχημένες εφαρμογές συστήματα customer relationship management έχουν κάνει χρήση εξαρxής αυτή τη δομής salesforce multitenant architecture.

Συμπέρασμα

Σε τελική ανάλυση υπάρχει μια ποικιλία από τεχνολογίες και τρόπους για να επιτευχθεί το ίδιο αποτέλεσμα, εδώ αναφέραμε μερικές βασικές τεχνολογίες. Το να επιλέξει κάποιος την κατάλληλη θα πρέπει να εξετάσει μια σειρά από παράγοντες όπως χρόνος, το κόστος, η πρόσβαση τεχνολογικούς και ανθρώπινους πόρους σε συνδυασμό με τα ειδικά χαρακτηριστικά που απαιτούνται σε ένα project.