diff --git a/assets/figures/chapter-4/4.3.react-logo.png b/assets/figures/chapter-4/4.3.react-logo.png new file mode 100644 index 0000000..713bd65 Binary files /dev/null and b/assets/figures/chapter-4/4.3.react-logo.png differ diff --git a/assets/figures/chapter-4/4.3.redux-logo.png b/assets/figures/chapter-4/4.3.redux-logo.png new file mode 100644 index 0000000..148b674 Binary files /dev/null and b/assets/figures/chapter-4/4.3.redux-logo.png differ diff --git a/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies.tex b/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies.tex index 85bf487..a1cc25c 100644 --- a/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies.tex +++ b/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies.tex @@ -3,3 +3,5 @@ Στην παρούσα υποενότητα περιγράφονται όσες τεχνολογίες σχετίζονται με τη διεπαφή του χρήστη (UI), δηλαδή με το Presentation tier. % TODO: add technologies like redux, sagas + +\input{chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies/4.3.2.1.react} \ No newline at end of file diff --git a/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies/4.3.2.1.react.tex b/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies/4.3.2.1.react.tex new file mode 100644 index 0000000..febc1d4 --- /dev/null +++ b/chapters/4.application-implementation/4.3.implementation-technology-stack/4.3.2.ui-technologies/4.3.2.1.react.tex @@ -0,0 +1,11 @@ +\subsubsection{React} \label{subsection:4-3-2-1-react} + +\logo{chapter-4/4.3.react-logo}{React logo} + +Η React\footnote{\url{https://reactjs.org/}} αποτελεί βιβλιοθήκη Javascript, η οποία χρησιμοποιείται για την κατασκευή διεπαφών χρήστη. Είναι δηλωτική (declarative) και βασίζεται σε components, τα οποία διαχειρίζονται την κατάστασή τους (state) και συντίθενται για να δημιουργήσουν πολύπλοκα διαδραστικά UIs. + +%TODO: When https://2021.stateofjs.com/en-US/ is available, add to the paragraph above that is the most popular js front-end framework (by usage), according to https://2020.stateofjs.com/en-US/technologies/front-end-frameworks/ and also add this beautiful chart. + +Ένα σημαντικό εργαλείο για την ταχεία ανάπτυξη web εφαρμογών σε React είναι το Create React App\footnote{\url{https://create-react-app.dev/}}. Με τη χρήση μίας και μόνο εντολής (\texttt{npx create-react-app my-app}), εγκαθίσταται αυτόματα ένας development server σε περιβάλλον Node.js (ως μία μοναδική βιβλιοθήκη). Αυτός εμπεριέχει μία πληθώρα από build tools (π.χ. Webpack, Babel, ESLint), τα οποία προσφέρουν ισχυρές δυνατότητες, όπως άμεσα reloads και παραγωγή βελτιστοποιημένων bundles. Έτσι, η διαδικασία της υλοποίησης αποκτά ποικίλες διευκολύνσεις, χωρίς να απαιτεί την εκμάθηση, την χειροκίνητη εγκατάσταση και την προηγμένη διαμόρφωση των τεχνολογιών στο εσωτερικό. + +Η React έχει το αποθετήριό της στο GitHub (\url{https://github.com/facebook/react/}) και διατίθεται μέσω του μητρώου npm (\url{https://www.npmjs.com/package/react}). diff --git a/thesis.pdf b/thesis.pdf index 4d5b5e9..90b80bd 100644 Binary files a/thesis.pdf and b/thesis.pdf differ