An Introductions to Modern Web Technologies By Amarsingh Rathod
Web Technology Trends in 2022 Why should be care about it.
Agenda Modern web development New web standard Java script frameworks and libraries Web design trends and CSS frameworks JavaScript at back end Hybrid mobile app framework Developer productivity Some interesting facts
Modern web development
Modern web development Fluid user experience with no page reloads. Single page applications(SPA) architecture. SOA,API and rest based development Multiple clients, consuming the services. Server side vs. client side views Client playing vital role by taking more responsibility. High performance apps with low bandwidth utilization Server side implementations are becoming a thin layer.
New web standards
HTML 5 Latest and most enhanced versio of HTML Published in 2014 by W3c,supported by all modern browsers A candidate for crosss -platform mobile apllications . Designed with low power devices in mind Natively handle multiedia and graphical content New semantics elements <article> <aside> <section>… and many more New API Canvas Offline Web storage Geolocation Web sockets and many more
css3 The latest standards for CSS Completely backward- compatibale with earlier version Divided into sepreate modules Selectors Box model Background and borders Text effect 2D/3D Transformations Animations Multiple column layout
Java script frameworks and libraries
Angular 2 The next version of Google’s MV* framework Relaesed on 14 th sept 2016 and latest version is 2.4.1 Huge performance improvement Designed with keeping mobileoriented architecture in mind Developed using typescript Component based programming Simple and expressive Seamless upgrade from angular 1 Legacy browser support Great support for Animations
ReactJs A JavaScript library for building user interface. Developed and maintain by facebook Key Features. JSX- Javascript syntax extension. Components-React is all about the components Unidirectional data flow and flux Advantages Use virtual DOM Can be used on client side and server side Componets and data patterns are improved readability which helps to maintain large apps Can be used with other framework
Web design trends and css framework
Access the ultimate library with scribd The end of traditional web design. Conversational UI Next generation of responsive design Minimalistic web design Fewer stock photos, more authenticity Long scrolling websites Typography goes big.
Bootstrap world’s most popular framework for building responsive, mobile-first sites and applications. Developed and maintained by twitter Bootstrap 4 is in alpha(5) Not recommended for production use but highly recommended for learning New features Bootstrap’s source is now sass Improved grid system based on “ rems ” An opt-in flex box Grid Cards Sass variables for customizing Dropped IE & support
JAVASCRIPT AT BACK END
REALESED IN 2009 BY Ryan Dahi Written in c/c++ Built on Google chrome’s v8 JavaScript Engine Extremely lightweight and efficient What JavaScript has done for the web browser, Node.js is doing for backend user. Does module loading and asynchronous IO Single threaded ,one node process per CPU Easily scalable( just create a cluster ) Great community and well maintained.
Hybrid mobile app frameworks
Ionic 2 Complete open-source SDK for hybrid mobile app development. Enables the creation of cross platform mobile applications with HTML,CSS and Javascript (angular 2) Leverage the skills you already have from developing web applications. Take advantage of progressive web apps. Target all major mobile platform. Native functionality is easy to implement.
metror An Open-source Javascripts web framework written using Nodels . An Isomorphic development ecosystem. Allows rapid prototyping and produces cross-platform ( android,IOS , web)code Its is a cohensive development Platform Reactivity-real time syncing of data is built into metror at the core. It has lots of other cool things like a templating system called blaze. A database on client called minimango .
Developer Prodcutivity tools
webPAck Webpack is a module Bundler It splits the dependancy tree into chunks loaded on demand Its keps initial loading time low Provide ability to integrate third libraries as module Provide ability to customise nearly every part of the module bunlder Best suited for big Project Angular 2 command line interface (CLI) tool uses webpack .
Task runner Grunt linting our JS files Minifying JS files Compiling less Watching for file change etc. Gulp Spinning up a web server Bundling and minifying libraries and style sheets Refreshing your browser when you save a file Quickly running unit tests Running code analysis Less/ Saas to CSS compilation Copying modified files to an output directory.
Beyond web technologies
IOT Refer to ever growing network of physical objects Extends the internet connectivity beyond traditional device. Enables the exchange of data that was never possible before IOT is going to trigger a massive influx of big data As more and more devices are being connected and accessible t o the network, we’ll find web developers coming up with upgraded solutions to help users control and communicate with their everyday gadgets and equipment.
Big data anaytics A Process of examining large data sets to uncover hidden patters, unknown correlation, market trends, customer preferences and other useful business information. Apache sparks A fast and general engine for fast data processing Run programs up to 100x faster than Hadoop map reduce in memory Combine SQL,Streaming , and complex analytics Sparks runs on Hadoop ,MESOS, standalone, or in the cloud Scala - Scalable Language A JVM language that smoothly integrates the features of object-oriented and functional Programming. Java labs may be used directly in scala code and vice versa Scala’s design decisions were inspired by criticism of java’s shortcomings.
Some interesting facts
Javascript is everywhere JavaScript is the most commonly used programming languages on the earth. Even all the professional developers are more likely to use it than any other programming language.
Trending tech on stack overflow Newer web development technologies like React,Node.js and angular.js are growing in use.