WEB TECHNOLOGIES

IN PRACTICE

Sebastian Sztyper

Lead frontend developer

@ssztyper

BROWSERS


How it's working ?

Dev tools

Dev tools - modify

Protocols

HTTP 1
HTTP 2.0
DDP
REST

SSL

XML

DATA FORMATS

<note>
  <to>Tove</to>
  <from>Jani</from>
  <heading>Reminder</heading>
  <body>Don't forget me this weekend!</body>
</note>

JSON

DATA FORMATS

{
  "id": 1,
  "name": "Foo",
  "price": 123,
  "tags": [
    "Bar",
    "Eek"
  ],
  "stock": {
    "warehouse": 300,
    "retail": 20
  }
}

REST API

SERVER SIDE

Database

API

Serwer side rendering

CLIENT SIDE

FRAMEWORKS

Javascript

Typescript

GLOBAL TRENDS

INTEGRATIONS

API <-> server

API <-> client

RWD

RESPONSIVE
WEB DESIGN

ELECTRON.JS

ElectronJS

ADVANTAGES

Multiplatform

Performance

Chromium features

HTML+CSS+javascript

ElectronJS

DISADVANTAGES

Native app

Weight

System API - safety

Small group of customers

MOBILE

TECHNOLOGIES

PWA

Apache Cordova

Xamarin

Native Script

React Native

Ionic

... and more :)

PWA

Service workers

Google play

Notification API

Browser features

Bluetooth

Cache API

Sync API

Notification API

ADVANTAGES

PWA

NFC

Support Chrome/Firefox

APP Store

 

 

DISADVANTAGES

PWA

EXAMPLES

PWA

EXAMPLES

PWA

EXAMPLES

PWA

EXAMPLES

CORDOVA

WebView (url)

Fast development

Google play

App store

Native functions

Quick effect

ADVANTAGES

CORDOVA

Android developer tools

WebView -> Native functions

Complication plugins (google maps)

DISADVANTAGES

FEATURE

The demand
for technologies
is created by
the needs
of users

FEATURE
TECHNOLOGIES

machine learning
blockchain
performance
safety

 

Questions

Thank You

Web technologies in practise - basic

By Sebastian Sztyper

Web technologies in practise - basic

  • 70