0% found this document useful (0 votes)
2 views12 pages

System Components

The document outlines the architecture and components of a web application developed by NewTechWays, including user authentication, product management, and order processing. It discusses various web frameworks, service architectures, and database options, highlighting the use of technologies like Django, Node.js, and Spring Framework. Additionally, it describes the structure of a single-page application and the interaction between front-end and back-end services.

Uploaded by

vishy.nitt
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views12 pages

System Components

The document outlines the architecture and components of a web application developed by NewTechWays, including user authentication, product management, and order processing. It discusses various web frameworks, service architectures, and database options, highlighting the use of technologies like Django, Node.js, and Spring Framework. Additionally, it describes the structure of a single-page application and the interaction between front-end and back-end services.

Uploaded by

vishy.nitt
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

System Components

Minisys Components

• User Auth

Single Page App

© 2022 • Product

• Order

NewTechWays Web App


• Inventory
Database

Services

Copyright © 2021 [Link] All Rights Reserved


Web Application Deployment Architecture
Serving dynamic content ??


• Serving static resources
Web Server

Manage connections – Slow & Fast © 2022


Process Managers ??
• Start, Stop, Monitor, Scale

NewTechWays
Reverse Proxy App Server /
+ Web Server Web Container

Serving dynamic content ??

Static Content Dynamic Content

Copyright © 2021 [Link] All Rights Reserved


Web Application Frameworks
Serving dynamic content with Web Server modules
• Apache Web Server

© 2022
• mod_cgi, mod_php, mod_ruby, mod_python
• Apache or Nginx with Passenger
Web Server
• Ruby, Python, [Link]

• Manage connections – Slow & Fast


• Serving static resources
Serving dynamic content with Web Frameworks on App Server
Language, Web Framework on App Server/Web Container

NewTechWays
Reverse Proxy App Server /
+ Web Server Web Container
• PHP + Laravel/CodeIgniter on PHP-FPM (quick dev, easy to learn)
• Ruby + Rails on Puma/Unicorn/Thin (quick dev)
• JS + [Link] on [Link] (large no of clients with low latency response)
• Python + Django/Flask on Gunicorn (quick dev, large sized apps)

• Apache • Unicorn • Java + Spring Framework on Tomcat/Jetty (large sized apps)


• Nginx • Passenger
• Gunicorn
• [Link] core on Kestrel (for Microsoft developers)
• Tomcat

Copyright © 2021 [Link] All Rights Reserved


Django WebApp Architecture
• MTV (MVC) framework
• Separation of concerns

© 2022
• Out of the box CRUD operations
• Along with UI
• Development mode
• Can host static content as well
url CRUD
urls map

View Model

NewTechWays Static
Content
Dynamic
Content
What to show

Template
Format to show
Data to show

HTTP
Database

Services

Copyright © 2021 [Link] All Rights Reserved


Services Architecture
Services INTEROPERABLE
• RPC
User Auth SOAP, IIOP, gRPC, Thrift

© 2022

• REST
• No RPC Stubs
Single Page App • Suitable for both apps and browser
Product
INDEPENDENT
• SOA
• Common interface schema - XSD
• Common DB schema

NewTechWays
Order
• Microservices
• Completely independent

Web App Database


Inventory SCALABLE
• Stateless
• No app state
• No client state

Copyright © 2021 [Link] All Rights Reserved


Services – Languages & Frameworks
• Python – Django/Flask Services

• JavaScript – [Link] User Auth

• Java – Spring Boot


• C# – [Link] core
• C++ - REST SDK
• …
Single Page App

© 2022 Product
• Large code base
• Code structure & organization
• Business logic & algorithms
• High CPU

NewTechWays
Order
• Object Oriented
• Better code structure
• Compiled Vs Interpreted Web App
Inventory
Database
• Better performance
• Garbage Collection
• No illegal memory access or memory leaks
• Faster programming
Copyright © 2021 [Link] All Rights Reserved
Restful Services using Spring Framework
No
REST
boilerplate
Interface

© 2022
code

• User Auth
• Catalog
{ REST } • Order Data
• Inventory

NewTechWays Server
core
Dependency
Process Injection

Copyright © 2021 [Link] All Rights Reserved


Database
• RDBMS
E M A
NS S CALE
• MySQL S CH
E X ES
CT I O T IC D S
ITE B data)

© 2022
ED D A LY
• PostgreSQL FIX INS, IN N S ANA L IM 1T
JO T RA (<
F K ,
• NoSQL A
H EM
• MongoDB ES C
NS T ICS
IBL I O
CT ates) AL Y g) ALE
• Cassandra X
FLE OINS E YS N S A
eg D AN ndexin E S C
J N K G TRA Aggr IT E ed i RE M
• HBase NO OREIG DEXIN nly o
n LIM to limit EXT
F
NO TED IN (o ue
(d

NewTechWays
I
LIM

• User Auth
• Catalog Transactions ETL Analytics
• Order
• Inventory

OLTP - RDBMS Datawarehouse - RDBMS Reports


Services
Copyright © 2021 [Link] All Rights Reserved
UserAuth id name password emailId Cart id
PK (id) PK (id)
CART

UserRole id role AUTH CartLine cartId cartLineId productid quantity


PK (id, role)

Product id name price


PRODUCT
© 2022
Order
PK (cartId, cartLineId)

id userId date status

NewTechWays
PK (id) PK (id) Index (userId)

ORDER

Inventory productId Quantity OrderLine orderId lineId productid quantity


INVENTORY
PK (productId) PK (orderId, lineId)

Copyright © 2021 [Link] All Rights Reserved


Single Page Application
• AngularJS Framework • Highly interactive UI applications
• ReactJS Library • Can be converted into Hybrid Mobile Apps

© 2022
• VueJS Framework

1 Single Page
Application
HTTP
Download
Web Server

NewTechWays Javascript
Runtime
2
Business Services





Auth
Catalog
Order
Inventory
Database

Copyright © 2021 [Link] All Rights Reserved


React Architecture
JSX File

© 2022
React JSX
Transformer

API Calls

Browser React JS DOM


Events Library Updates

NewTechWays JS File

Diff &
Sync
State Changes

Browser DOM Virtual DOM


Copyright © 2021 [Link] All Rights Reserved

You might also like