‫الحديثة‬ ‫الويب‬ ‫تقنيات‬
Modern web technologies
</> {}
‫مرحب‬‫ا‬!
Oday Alqarra
Frameworks
Front-end JavaScript Framework
Angular 2
1.3 Million
Developers
Google products in Angular 1
Angular 1 Releases
Angular 1 vs Angular 2
Angular 1
(angularjs.o
rg)
Angular 2
(angular.i
o)
0 300,000 600,000 900,000 1,200,000
93%
7%
October 20, 2015
Modern web technologies
Features & Benefits
Speed & Performance
Simple & Expressive
Cross Platform
Seamless upgrade from angular 1
Flexible Development
Legacy Browser Support
Animations
Compile to JavaScript
JavaScript is everywhere
Modern web technologies
TypeScript
Mobile Frameworks
Ionic
Modern web technologies
Modern web technologies
NativeScript
Modern web technologies
Modern web technologies
Modern web technologies
Cross platform desktop apps
Electron
Web Tech Open Source Cross Platform
Use HTML, CSS, and JavaScript GitHub and an active community Run on Mac, Windows, and Linux.
Built on Electron
Game Frameworks
Babylon.js
Task Runner
Why use a task runner?
Grunt
Gulp
Package Manager
NPM
OVERVIEW
Bower
OVERVIEW
NuGet
OVERVIEW
Generation Framework
Modern web technologies
Back End
Web API
Modern web technologies
NodeJS
Firebase
Firebase Realtime Database
Firebase Authentication
Modern Web Layout
‫كذلك‬ ‫كانت‬.
HTML Tables
‫كذلك‬ ‫إنها‬.
HTML Tables
CSS 1
CSS 2
Back to HTML Tables
‫كذلك‬ ‫إنها‬.
Fixed Width vs. Fluid
‫كذلك‬ ‫إنها‬.
Fixed Width vs. Fluid
480P
‫كذلك‬ ‫إنها‬.
Fixed Width vs. Fluid
1080P
‫كذلك‬ ‫إنها‬.
Float Based
nav {
float: left;
width: 200px;
}
section {
margin-left: 200px;
}
Faux Columns
‫كذلك‬ ‫إنها‬.
Devices & Resolutions !
480P 1080P 1440P720P 4K 8K
Responsive Web Design
‫كذلك‬ ‫ليست‬ ‫إنها‬.
! ‫قادم‬ ‫التغيير‬ ‫من‬ ‫المزيد‬
Flexbox CSS Grid Layout
Flexbox
1 2 3 4
Flexbox
4 3 2 1
Flexbox
4
3
2
1
Flexbox
1
2
3
4
Flexbox
2
3
1
4
Flexbox CSS Grid Layout
Flexbox VS. Grid
One Dimension Two Dimensions
Flexbox CSS Grid Layout
Flexbox VS. Grid
Lets content size itself Relies on defined gridlines
Hosted Web App
manifoldjs
‫عن‬ ‫نتحدث‬ ‫دعنا‬
‫وتجارب‬ ‫نصائح‬.
‫استماعك‬ ‫حسن‬ ‫على‬ ‫شكرا‬‫م‬
Oday Alqarra
</> {}
‫سالم‬!
Fb/Oday9

More Related Content

PPTX
Intro to modern web technology
PPTX
Introduction to Modern and Emerging Web Technologies
PPTX
Getting Started with ASP.NET vNext
PDF
Front End Applications Using One Stop JavaScript Library from Telerik
PPTX
Jumpstart your ASP.NET Project Development with Sitefinity Platform
PPTX
Web Applications Development with MEAN Stack
PDF
Progressive web applications development
PDF
Easy HTML5 Data Visualization with Kendo UI DataViz
Intro to modern web technology
Introduction to Modern and Emerging Web Technologies
Getting Started with ASP.NET vNext
Front End Applications Using One Stop JavaScript Library from Telerik
Jumpstart your ASP.NET Project Development with Sitefinity Platform
Web Applications Development with MEAN Stack
Progressive web applications development
Easy HTML5 Data Visualization with Kendo UI DataViz

What's hot (20)

PPTX
Headless CMS. Sitecore JSS getting started, tips and tricks
PPTX
Microservices Architecture for Content Management Systems using AWS Lambda an...
PPTX
Micro-frontends – is it a new normal?
PDF
Bringing swift to cloud
PDF
Micro frontends with react and redux dev day
PDF
SWIFTly, Go Cloud!! - Swift@IBM
PDF
Browser and Cloud - The Future of IDEs?
PPTX
Angular vs react vs vue
KEY
The future of webapp development
PPTX
Microsoft Azure Cloud Services
PPTX
Developing ASP.NET MVC Applications Quicker With Kendo UI
PPTX
Building SPA with Kendo UI
PPTX
MicroserviceArchitecture in detail over Monolith.
PPTX
Few Tips for asp.net developers 2014 and beyond
PDF
App Engine Overview @ Google Hackathon SXSW 2010
PPTX
Node.js BFFs: our way to better/micro frontends
PPTX
Serverless is FaaS-tastic - All Things Open Meet-up
PPTX
Native Touches to your Hybrid Mobile Apps
PPTX
MVVM & Validation with Kendo UI
PPTX
WinJS at NYC Code Camp 2012
Headless CMS. Sitecore JSS getting started, tips and tricks
Microservices Architecture for Content Management Systems using AWS Lambda an...
Micro-frontends – is it a new normal?
Bringing swift to cloud
Micro frontends with react and redux dev day
SWIFTly, Go Cloud!! - Swift@IBM
Browser and Cloud - The Future of IDEs?
Angular vs react vs vue
The future of webapp development
Microsoft Azure Cloud Services
Developing ASP.NET MVC Applications Quicker With Kendo UI
Building SPA with Kendo UI
MicroserviceArchitecture in detail over Monolith.
Few Tips for asp.net developers 2014 and beyond
App Engine Overview @ Google Hackathon SXSW 2010
Node.js BFFs: our way to better/micro frontends
Serverless is FaaS-tastic - All Things Open Meet-up
Native Touches to your Hybrid Mobile Apps
MVVM & Validation with Kendo UI
WinJS at NYC Code Camp 2012
Ad

Viewers also liked (20)

PDF
Latest Trends in Web Technologies
PPTX
Web Development Trends 2016
PPT
introduction to web technology
PPT
حل المتباينات بالضرب أو بالقسمة
PDF
Front-End Frameworks: a quick overview
PPT
Social Networking Sites
PPTX
How to use glogster
PPTX
Web technologies: recap on TCP-IP
PPT
Glogster poster tutorial
PDF
Web Application Frameworks - Web Technologies (1019888BNR)
PPTX
Architecture & Workflow of Modern Web Apps
PPTX
Web technologies course, an introduction
PDF
The Social Intranet
PDF
اللغة العربية للسادس الابتدائى ترم ثانى 2016 Arabic grade 6 t2 for 2016 omn...
PPT
Web Tech
PPT
Social Web Technologies
PPTX
Seminar presentation on embedded web technology
PPTX
Web technologies lesson 1
DOC
Web technology
PPTX
Modern web technologies
Latest Trends in Web Technologies
Web Development Trends 2016
introduction to web technology
حل المتباينات بالضرب أو بالقسمة
Front-End Frameworks: a quick overview
Social Networking Sites
How to use glogster
Web technologies: recap on TCP-IP
Glogster poster tutorial
Web Application Frameworks - Web Technologies (1019888BNR)
Architecture & Workflow of Modern Web Apps
Web technologies course, an introduction
The Social Intranet
اللغة العربية للسادس الابتدائى ترم ثانى 2016 Arabic grade 6 t2 for 2016 omn...
Web Tech
Social Web Technologies
Seminar presentation on embedded web technology
Web technologies lesson 1
Web technology
Modern web technologies
Ad

Similar to Modern web technologies (9)

PPTX
AI introduction to modern web technologies.pptx
PDF
HTML 5 & The Modern Web
PDF
Je TIC au passé, présent et au futur, Journée du 23/12/2014
PDF
AngularJS: How to code today with tomorrow tools
PDF
AngularJS: How to code today with tomorrow tools - Codemotion Milan 2013
PDF
What's next? J and beyond keynote 2015
PDF
"Top Digital Marketing Services to Boost Your Business Growth"
PDF
شرح برنامج دريم ويفر.pdf
PPTX
web development in 2024 - website development
AI introduction to modern web technologies.pptx
HTML 5 & The Modern Web
Je TIC au passé, présent et au futur, Journée du 23/12/2014
AngularJS: How to code today with tomorrow tools
AngularJS: How to code today with tomorrow tools - Codemotion Milan 2013
What's next? J and beyond keynote 2015
"Top Digital Marketing Services to Boost Your Business Growth"
شرح برنامج دريم ويفر.pdf
web development in 2024 - website development

Recently uploaded (20)

PPTX
Chapter 1 - Transaction Processing and Mgt.pptx
PDF
PDF-XChange Editor Plus 10.7.0.398.0 Crack Free Download Latest 2025
PPTX
HackYourBrain__UtrechtJUG__11092025.pptx
PDF
novaPDF Pro 11.9.482 Crack + License Key [Latest 2025]
PDF
CapCut PRO for PC Crack New Download (Fully Activated 2025)
PDF
Understanding the Need for Systemic Change in Open Source Through Intersectio...
PPT
3.Software Design for software engineering
PDF
AI-Powered Fuzz Testing: The Future of QA
PPTX
Airline CRS | Airline CRS Systems | CRS System
PDF
CCleaner 6.39.11548 Crack 2025 License Key
PPTX
Lecture 5 Software Requirement Engineering
PDF
Multiverse AI Review 2025: Access All TOP AI Model-Versions!
PPTX
string python Python Strings: Literals, Slicing, Methods, Formatting, and Pra...
PPTX
MLforCyber_MLDataSetsandFeatures_Presentation.pptx
PDF
Sun and Bloombase Spitfire StoreSafe End-to-end Storage Security Solution
PPTX
ROI Analysis for Newspaper Industry with Odoo ERP
PPTX
Bandicam Screen Recorder 8.2.1 Build 2529 Crack
PDF
AI Guide for Business Growth - Arna Softech
PDF
What Makes a Great Data Visualization Consulting Service.pdf
PDF
BoxLang Dynamic AWS Lambda - Japan Edition
Chapter 1 - Transaction Processing and Mgt.pptx
PDF-XChange Editor Plus 10.7.0.398.0 Crack Free Download Latest 2025
HackYourBrain__UtrechtJUG__11092025.pptx
novaPDF Pro 11.9.482 Crack + License Key [Latest 2025]
CapCut PRO for PC Crack New Download (Fully Activated 2025)
Understanding the Need for Systemic Change in Open Source Through Intersectio...
3.Software Design for software engineering
AI-Powered Fuzz Testing: The Future of QA
Airline CRS | Airline CRS Systems | CRS System
CCleaner 6.39.11548 Crack 2025 License Key
Lecture 5 Software Requirement Engineering
Multiverse AI Review 2025: Access All TOP AI Model-Versions!
string python Python Strings: Literals, Slicing, Methods, Formatting, and Pra...
MLforCyber_MLDataSetsandFeatures_Presentation.pptx
Sun and Bloombase Spitfire StoreSafe End-to-end Storage Security Solution
ROI Analysis for Newspaper Industry with Odoo ERP
Bandicam Screen Recorder 8.2.1 Build 2529 Crack
AI Guide for Business Growth - Arna Softech
What Makes a Great Data Visualization Consulting Service.pdf
BoxLang Dynamic AWS Lambda - Japan Edition

Modern web technologies