The State of Frontend was presented at Vadodara Frontend Developer's meetup on 4th Apr, 2016. It covers the past, present and the future trends in the frontend development.
In 2010, a photo-sharing startup launched—on a single, closed platform. Over the next two years, it gained over 100 million active users, before being acquired by Facebook for one. billion. dollars.
Only half a year after *that* did they finally release a web app.
Instagram's main purpose was sharing photos and commenting on them. If this isn't a perfect fit for the open web platform, I don't know what is. And yet the app was planted neatly within Apple's walled garden, without even an API to speak of. How did things go so wrong?
The web needs to catch up, and fast. If we want to preserve all the virtues of the web—shareable URLs, indexable content, open standards, instantly deployed updates, and so on—then we need to make the web platform more attractive, both to developers and users. We need to explore the final frontier of web development: *true* web apps, of the kind that will delight our users (and our investors). But we're not quite there … yet.
In this talk, I want to explore the efforts underway to bring the web platform up to speed as a genuine competitor. We have the most momentum of any platform in history, but there are still many unanswered questions. What are the major functionality gaps, and how are we closing them? Can we make app development as easy for web as it is for native? How do we fix mobile performance? Can you even use a web app while you're offline? I want to tell you about that not-too-distant future where these problems have been solved. Editors are speccing up new APIs; implementers are leveling up their browsers; and the community is building new frameworks. Together, we're slowly but surely pushing into that final frontier. And once we're past it, the mobile web will be a natural choice for the next big content-sharing app, enabling us to share by simply sending a URL—from any browser, to any device, on any platform.
Keynote at Codebits in Portugal, April 2014, explaining the how and why of Firefox OS and how to use it.
Video: https://videos.sapo.pt/ZYQyY57ZlB6lhgIdBzrs
Learn how apex design patterns and limits apply to flow, and how you can use flow to become a developer.
Hear about Meighan’s journey from Admin to developer and the impact Flow had on that journey.
See how best practices in Flow that are used every by admin apply to code, and can help you make that jump from admin to admineloper less scary, and how the confidence you have in your admin skills can be used to help lead the way to writing better code with Apex.
The HTML5 standard turned out to be not so standard when it comes to cross-platform implementations - from handling touch events, to CSS transitions, to WebSockets, to performance. This presentation will share some of the lessons we learned the hard way developing the TitanFile mobile app using HTML5/JavaScript/CSS3.
In 2010, a photo-sharing startup launched—on a single, closed platform. Over the next two years, it gained over 100 million active users, before being acquired by Facebook for one. billion. dollars.
Only half a year after *that* did they finally release a web app.
Instagram's main purpose was sharing photos and commenting on them. If this isn't a perfect fit for the open web platform, I don't know what is. And yet the app was planted neatly within Apple's walled garden, without even an API to speak of. How did things go so wrong?
The web needs to catch up, and fast. If we want to preserve all the virtues of the web—shareable URLs, indexable content, open standards, instantly deployed updates, and so on—then we need to make the web platform more attractive, both to developers and users. We need to explore the final frontier of web development: *true* web apps, of the kind that will delight our users (and our investors). But we're not quite there … yet.
In this talk, I want to explore the efforts underway to bring the web platform up to speed as a genuine competitor. We have the most momentum of any platform in history, but there are still many unanswered questions. What are the major functionality gaps, and how are we closing them? Can we make app development as easy for web as it is for native? How do we fix mobile performance? Can you even use a web app while you're offline? I want to tell you about that not-too-distant future where these problems have been solved. Editors are speccing up new APIs; implementers are leveling up their browsers; and the community is building new frameworks. Together, we're slowly but surely pushing into that final frontier. And once we're past it, the mobile web will be a natural choice for the next big content-sharing app, enabling us to share by simply sending a URL—from any browser, to any device, on any platform.
Keynote at Codebits in Portugal, April 2014, explaining the how and why of Firefox OS and how to use it.
Video: https://videos.sapo.pt/ZYQyY57ZlB6lhgIdBzrs
Learn how apex design patterns and limits apply to flow, and how you can use flow to become a developer.
Hear about Meighan’s journey from Admin to developer and the impact Flow had on that journey.
See how best practices in Flow that are used every by admin apply to code, and can help you make that jump from admin to admineloper less scary, and how the confidence you have in your admin skills can be used to help lead the way to writing better code with Apex.
The HTML5 standard turned out to be not so standard when it comes to cross-platform implementations - from handling touch events, to CSS transitions, to WebSockets, to performance. This presentation will share some of the lessons we learned the hard way developing the TitanFile mobile app using HTML5/JavaScript/CSS3.
This talk explores some strategies and gives some recommendations when building and maintaining large apps.
Given at Drund HQ on Thursday, March 9th 2016.
Angular Remote Conf - Building with Angular & WordPressRoy Sivan
WordPress is a great solution as a CMS, especially when working with a content creation team filled with non-developer content creators. Leveraging the WordPress REST API and AngularJS the sky is the limit on what you can build with that content. From Single Page Applications, to mobile apps, Angular and WordPress are a good match. I will run through some basics of the WordPress REST API, some potential use cases for what you can build with Angular, and why it is important for WordPress as a platform moving into the future.
Geek Sync | How to Deal with an Inherited SQL ServerIDERA Software
You can watch the replay for this Geek Sync webcast in the IDERA Resource Center: http://ow.ly/lF4i50A5r4Q
Join Idera and SQL Savant Andy Warren for a Geek Sync where we walk you through a set of Week 1 Best Practices and provide insight on how to prioritize the tasks necessary to navigate the new SQL database to ensure you provide maximum results with minimal negative impact to the organization.
(Best) Practices for the Solo DeveloperMichael Eaton
You are the only developer in your company. Maybe you’re an independent consultant. Maybe you work from home, maybe not. Any way it goes, being the lone developer can be tough. Whether you work in a cube or the comfort of your home office or the local coffee shop, there are many challenges facing the solo developer. Project management, estimation, testing and even writing code all change when you work alone. In this session, I will discuss many of the lessons learned and practices I’ve developed working almost exclusively as a single developer for the past ten years.
Chzech SharePoint Conference - intranets on share point and office365 - the g...Thomas Gölles
"What's the deal with Communication and Teams Sites?", "Should I use Teams or Groups for collaboration?", "Is on-premises dead?" Those questions sound familiar? Then let's talk about the different opportunities on how to orchestrate the core services of Office365 and SharePoint on-premises to deliver an intranet architecture that not only adds value but also drives user adoption. SPFx, PnP and Microsoft Graph build the technology base layer, whereas services like Flow, PowerApps or the Azure Bot Framework take your intranet to a new level. But never forget about the main target: your users must use it on a daily basis. This session gives an overview of the not so techie side, focusing on the tools in the design, architecture and roll-out phase and of course the setup of an ideal intranet project.
Tools For jQuery Application Architecture (Extended Slides)Addy Osmani
Hey guys. I just wrapped up my talk on Tools for jQuery Application Architecture over at Web Directions in London and wanted to make sure everyone interested had access to the slides. Some of the topics I cover include:
MVC & MVVM architecture patterns for client-side development
JavaScriptMVC, Backbone, Spine, SproutCore, Sammy.js
Design patterns for JavaScript applications
Dependency management
JavaScript templating
Cross-browser persistent storage
Feature detection
Widgets & Component libraries
Unit Testing & testing environments
Build Processes, concatenation and minification.
and more!
I was invited by the Hatchery+ to give a presentation and workshop on building products - a brief overview on modern web apps, tech stacks, languages, frameworks, services, APIs and more.
This talk explores some strategies and gives some recommendations when building and maintaining large apps.
Given at Drund HQ on Thursday, March 9th 2016.
Angular Remote Conf - Building with Angular & WordPressRoy Sivan
WordPress is a great solution as a CMS, especially when working with a content creation team filled with non-developer content creators. Leveraging the WordPress REST API and AngularJS the sky is the limit on what you can build with that content. From Single Page Applications, to mobile apps, Angular and WordPress are a good match. I will run through some basics of the WordPress REST API, some potential use cases for what you can build with Angular, and why it is important for WordPress as a platform moving into the future.
Geek Sync | How to Deal with an Inherited SQL ServerIDERA Software
You can watch the replay for this Geek Sync webcast in the IDERA Resource Center: http://ow.ly/lF4i50A5r4Q
Join Idera and SQL Savant Andy Warren for a Geek Sync where we walk you through a set of Week 1 Best Practices and provide insight on how to prioritize the tasks necessary to navigate the new SQL database to ensure you provide maximum results with minimal negative impact to the organization.
(Best) Practices for the Solo DeveloperMichael Eaton
You are the only developer in your company. Maybe you’re an independent consultant. Maybe you work from home, maybe not. Any way it goes, being the lone developer can be tough. Whether you work in a cube or the comfort of your home office or the local coffee shop, there are many challenges facing the solo developer. Project management, estimation, testing and even writing code all change when you work alone. In this session, I will discuss many of the lessons learned and practices I’ve developed working almost exclusively as a single developer for the past ten years.
Chzech SharePoint Conference - intranets on share point and office365 - the g...Thomas Gölles
"What's the deal with Communication and Teams Sites?", "Should I use Teams or Groups for collaboration?", "Is on-premises dead?" Those questions sound familiar? Then let's talk about the different opportunities on how to orchestrate the core services of Office365 and SharePoint on-premises to deliver an intranet architecture that not only adds value but also drives user adoption. SPFx, PnP and Microsoft Graph build the technology base layer, whereas services like Flow, PowerApps or the Azure Bot Framework take your intranet to a new level. But never forget about the main target: your users must use it on a daily basis. This session gives an overview of the not so techie side, focusing on the tools in the design, architecture and roll-out phase and of course the setup of an ideal intranet project.
Tools For jQuery Application Architecture (Extended Slides)Addy Osmani
Hey guys. I just wrapped up my talk on Tools for jQuery Application Architecture over at Web Directions in London and wanted to make sure everyone interested had access to the slides. Some of the topics I cover include:
MVC & MVVM architecture patterns for client-side development
JavaScriptMVC, Backbone, Spine, SproutCore, Sammy.js
Design patterns for JavaScript applications
Dependency management
JavaScript templating
Cross-browser persistent storage
Feature detection
Widgets & Component libraries
Unit Testing & testing environments
Build Processes, concatenation and minification.
and more!
I was invited by the Hatchery+ to give a presentation and workshop on building products - a brief overview on modern web apps, tech stacks, languages, frameworks, services, APIs and more.
These are the slides I've prepared for presenting at CampSmalltalkVI2014 flow, a full-stack smalltalk framework for doing Single Page Applications.
tl;dr: it's Smalltalk for startups.
In a nutshell: flow is Amber frontend, Pharo backend and Mapless for networking objects in JSON and uncomplicated MongoDB persistence.
MIT license
Breaking out of the endless callback look - #jsday Italy keynoteChristian Heilmann
As JavaScript developers we are hot property. This can be overwhelming and in this keynote Chris Heilmann gives some history lessons to show that we don't need to get frustrated, but pick our battles.
How Open Source / Open Technology Could Help On Your ProjectWan Leung Wong
ITFest 2014, Seminar on Free & OSS in HK
How Open Source / Open Technology Could Help On Your Project?
A talk brief to talk about how to use open source or open technology to help on start a new project. How to choose technology, and what should people to concern on.
Talk from IoT World in Santa Clara, May 12, 2016. How to make IoT objects interoperable and adapble by adding JavaScript. Introduces XS6 open source JavaScript engine optimized for embedded development. Hat tip to Hallelujah the Hills for the epigrams.
Cross platform technologies have changed considerably. Should you even write an app using one of them in 2018? What tooling, processes and best practices can’t you live without? Which problems will you face and how will you overcome them? How would you organize your team and project? Join us as we share valuable lessons from the last two years of engineering the Covve Ionic/Angular cross platform app.
Whether you want to add some serious eye candy to your XPages Applications or just want to do more with less code, jQuery, the world’s most popular JavaScript framework can help you. Come to this webinar and find out how you can use some of the thousands of jQuery plugins, in harmony with Dojo, within your XPages applications to create a better experience not only for your users, but for you as a developer. In this webinar, we'll look at how jQuery works, how to add it to your XPages, and how a complete JavaScript beginner can take advantage of its power. We'll demonstrate many working examples -- and a sample database will be provided.
[DevDay2019] Web Development In 2019 - A Practical Guide - By Hoang Nhu Vinh,...DevDay.org
This is the step-by-step guide to becoming a web developer in 2019. We will look at nearly all aspects of web technology including the necessities as well as some of the new trends for 2019.
No more excuses! Let's build beautiful things. #codemotion Rome Christian Heilmann
A quick reminder of how we make it too complex for ourselves as web developers these days, and how changes in the browser world mean mainly one thing: build to standards.
Experience our free, in-depth three-part Tendenci Platform Corporate Membership Management workshop series! In Session 1 on May 14th, 2024, we began with an Introduction and Setup, mastering the configuration of your Corporate Membership Module settings to establish membership types, applications, and more. Then, on May 16th, 2024, in Session 2, we focused on binding individual members to a Corporate Membership and Corporate Reps, teaching you how to add individual members and assign Corporate Representatives to manage dues, renewals, and associated members. Finally, on May 28th, 2024, in Session 3, we covered questions and concerns, addressing any queries or issues you may have.
For more Tendenci AMS events, check out www.tendenci.com/events
Multiple Your Crypto Portfolio with the Innovative Features of Advanced Crypt...Hivelance Technology
Cryptocurrency trading bots are computer programs designed to automate buying, selling, and managing cryptocurrency transactions. These bots utilize advanced algorithms and machine learning techniques to analyze market data, identify trading opportunities, and execute trades on behalf of their users. By automating the decision-making process, crypto trading bots can react to market changes faster than human traders
Hivelance, a leading provider of cryptocurrency trading bot development services, stands out as the premier choice for crypto traders and developers. Hivelance boasts a team of seasoned cryptocurrency experts and software engineers who deeply understand the crypto market and the latest trends in automated trading, Hivelance leverages the latest technologies and tools in the industry, including advanced AI and machine learning algorithms, to create highly efficient and adaptable crypto trading bots
Large Language Models and the End of ProgrammingMatt Welsh
Talk by Matt Welsh at Craft Conference 2024 on the impact that Large Language Models will have on the future of software development. In this talk, I discuss the ways in which LLMs will impact the software industry, from replacing human software developers with AI, to replacing conventional software with models that perform reasoning, computation, and problem-solving.
Listen to the keynote address and hear about the latest developments from Rachana Ananthakrishnan and Ian Foster who review the updates to the Globus Platform and Service, and the relevance of Globus to the scientific community as an automation platform to accelerate scientific discovery.
Quarkus Hidden and Forbidden ExtensionsMax Andersen
Quarkus has a vast extension ecosystem and is known for its subsonic and subatomic feature set. Some of these features are not as well known, and some extensions are less talked about, but that does not make them less interesting - quite the opposite.
Come join this talk to see some tips and tricks for using Quarkus and some of the lesser known features, extensions and development techniques.
Your Digital Assistant.
Making complex approach simple. Straightforward process saves time. No more waiting to connect with people that matter to you. Safety first is not a cliché - Securely protect information in cloud storage to prevent any third party from accessing data.
Would you rather make your visitors feel burdened by making them wait? Or choose VizMan for a stress-free experience? VizMan is an automated visitor management system that works for any industries not limited to factories, societies, government institutes, and warehouses. A new age contactless way of logging information of visitors, employees, packages, and vehicles. VizMan is a digital logbook so it deters unnecessary use of paper or space since there is no requirement of bundles of registers that is left to collect dust in a corner of a room. Visitor’s essential details, helps in scheduling meetings for visitors and employees, and assists in supervising the attendance of the employees. With VizMan, visitors don’t need to wait for hours in long queues. VizMan handles visitors with the value they deserve because we know time is important to you.
Feasible Features
One Subscription, Four Modules – Admin, Employee, Receptionist, and Gatekeeper ensures confidentiality and prevents data from being manipulated
User Friendly – can be easily used on Android, iOS, and Web Interface
Multiple Accessibility – Log in through any device from any place at any time
One app for all industries – a Visitor Management System that works for any organisation.
Stress-free Sign-up
Visitor is registered and checked-in by the Receptionist
Host gets a notification, where they opt to Approve the meeting
Host notifies the Receptionist of the end of the meeting
Visitor is checked-out by the Receptionist
Host enters notes and remarks of the meeting
Customizable Components
Scheduling Meetings – Host can invite visitors for meetings and also approve, reject and reschedule meetings
Single/Bulk invites – Invitations can be sent individually to a visitor or collectively to many visitors
VIP Visitors – Additional security of data for VIP visitors to avoid misuse of information
Courier Management – Keeps a check on deliveries like commodities being delivered in and out of establishments
Alerts & Notifications – Get notified on SMS, email, and application
Parking Management – Manage availability of parking space
Individual log-in – Every user has their own log-in id
Visitor/Meeting Analytics – Evaluate notes and remarks of the meeting stored in the system
Visitor Management System is a secure and user friendly database manager that records, filters, tracks the visitors to your organization.
"Secure Your Premises with VizMan (VMS) – Get It Now"
Software Engineering, Software Consulting, Tech Lead.
Spring Boot, Spring Cloud, Spring Core, Spring JDBC, Spring Security,
Spring Transaction, Spring MVC,
Log4j, REST/SOAP WEB-SERVICES.
A Comprehensive Look at Generative AI in Retail App Testing.pdfkalichargn70th171
Traditional software testing methods are being challenged in retail, where customer expectations and technological advancements continually shape the landscape. Enter generative AI—a transformative subset of artificial intelligence technologies poised to revolutionize software testing.
Cyaniclab : Software Development Agency Portfolio.pdfCyanic lab
CyanicLab, an offshore custom software development company based in Sweden,India, Finland, is your go-to partner for startup development and innovative web design solutions. Our expert team specializes in crafting cutting-edge software tailored to meet the unique needs of startups and established enterprises alike. From conceptualization to execution, we offer comprehensive services including web and mobile app development, UI/UX design, and ongoing software maintenance. Ready to elevate your business? Contact CyanicLab today and let us propel your vision to success with our top-notch IT solutions.
Globus Connect Server Deep Dive - GlobusWorld 2024Globus
We explore the Globus Connect Server (GCS) architecture and experiment with advanced configuration options and use cases. This content is targeted at system administrators who are familiar with GCS and currently operate—or are planning to operate—broader deployments at their institution.
Advanced Flow Concepts Every Developer Should KnowPeter Caitens
Tim Combridge from Sensible Giraffe and Salesforce Ben presents some important tips that all developers should know when dealing with Flows in Salesforce.
Designing for Privacy in Amazon Web ServicesKrzysztofKkol1
Data privacy is one of the most critical issues that businesses face. This presentation shares insights on the principles and best practices for ensuring the resilience and security of your workload.
Drawing on a real-life project from the HR industry, the various challenges will be demonstrated: data protection, self-healing, business continuity, security, and transparency of data processing. This systematized approach allowed to create a secure AWS cloud infrastructure that not only met strict compliance rules but also exceeded the client's expectations.
Paketo Buildpacks : la meilleure façon de construire des images OCI? DevopsDa...Anthony Dahanne
Les Buildpacks existent depuis plus de 10 ans ! D’abord, ils étaient utilisés pour détecter et construire une application avant de la déployer sur certains PaaS. Ensuite, nous avons pu créer des images Docker (OCI) avec leur dernière génération, les Cloud Native Buildpacks (CNCF en incubation). Sont-ils une bonne alternative au Dockerfile ? Que sont les buildpacks Paketo ? Quelles communautés les soutiennent et comment ?
Venez le découvrir lors de cette session ignite
top nidhi software solution freedownloadvrstrong314
This presentation emphasizes the importance of data security and legal compliance for Nidhi companies in India. It highlights how online Nidhi software solutions, like Vector Nidhi Software, offer advanced features tailored to these needs. Key aspects include encryption, access controls, and audit trails to ensure data security. The software complies with regulatory guidelines from the MCA and RBI and adheres to Nidhi Rules, 2014. With customizable, user-friendly interfaces and real-time features, these Nidhi software solutions enhance efficiency, support growth, and provide exceptional member services. The presentation concludes with contact information for further inquiries.
Innovating Inference - Remote Triggering of Large Language Models on HPC Clus...Globus
Large Language Models (LLMs) are currently the center of attention in the tech world, particularly for their potential to advance research. In this presentation, we'll explore a straightforward and effective method for quickly initiating inference runs on supercomputers using the vLLM tool with Globus Compute, specifically on the Polaris system at ALCF. We'll begin by briefly discussing the popularity and applications of LLMs in various fields. Following this, we will introduce the vLLM tool, and explain how it integrates with Globus Compute to efficiently manage LLM operations on Polaris. Attendees will learn the practical aspects of setting up and remotely triggering LLMs from local machines, focusing on ease of use and efficiency. This talk is ideal for researchers and practitioners looking to leverage the power of LLMs in their work, offering a clear guide to harnessing supercomputing resources for quick and effective LLM inference.
Innovating Inference - Remote Triggering of Large Language Models on HPC Clus...
The State of Frontend
1.
2. Jimit Shah
Working as a freelance Developer in
Python, UI Development, Hybrid App
• Love building startups
• Always exploring new technologies
• Wannabe open source contributor and Mobile Dev
• In my free time, I work on electronics, gardening and
reading
@jimitnow codeforfood.in
7. Some notable achievements
• We finally have jQuery (Simpler way to manipulate DOM)
• Browser vendor got united through W3C standard
• AJAX started picking pace
• We began to feel limitation of Pure CSS
• Responsive design started becoming main stream
8. Problem faced
• No minification (or) concatenation
• Non-performant code
• Unmanageable code
• Lots of hacks
9. THE PAST MAY HURT, BUT YOU CAN EITHER RUN FROM IT (OR)
LEARN FROM IT
15. Benefits that framework offers
• Coherent way of coding
• Manageable and scalable code
• Built in best practices
• Component structure
• Quick turn around time
26. Five trends for 2016
3. Service Worker
TL;DR
A service worker is a script that is run by your browser in the
background, separate from a web page, opening the door to
features which don't need a web page or user interaction.
Ex. Push Notification in Chrome
Offline Web Apps
Background Sync
Extreme level of caching
27. Five trends for 2016
4. Web Components
Example
<video src=“http://youtube.com/catvideo”>
</video>
Polymer
28. Five trends for 2016
5. Material Design Everywhere
React Native Material
29. Thank You
All in all, we will be progressing faster than ever before.
30. Your work is going to fill a large part of your life, and the
only way to be truly satisfied is to do what you believe is
great work.And the only way to do great work is to love
what you do. If you haven’t found it yet, keep looking.
Don’t settle. As with all matters of the heart, you’ll know
when you find it.
-- Steve Jobs
Editor's Notes
Hi. Good morning. I am really excited to be here with you today. It has been a pretty crazy time for front-end developers. Over the last couple of years, We have seen tremendous growth of libraries, framework and build tool and it has increased our productivity and maintainability by a huge margin. And today I going to talk about this wonderful journey. Before I start here’s my small intro.
As you know my name is Jimit. I work as freelance developer in Python, UI Development and Hybrid App Development. Here’s some of the things that I like. Love building startups from ground-up, Exploring new technologies as soon as they are released, I would really love to be an open source contributor one day. Currently working on 2 soon to be open source projects. As world has gone mobile, I would love to have mobile development skill under my belt. Last but not least, In my free time I work on electronics, gardening and reading a lots technical and self-improvement articles. You can find me on twitter at @jimitnow and I blog at codeforfood.in. Enough about me, Lets get started with the keynote.
I have divided the talk in three parts and Its just like our evolution as a human.
The past, Which we members as the jQuery era where the entire front-end revolved around the one library and it was a good beginning.
The present, SPA ERA, As we all know Single Page Application has taken over the world. Finally the frontend development is as excited as backend development. For me personally, Its way more excited than backend.
The Future, We really can't predict the future. But looking at the current state, It looks like it will be nothing short of magic and I am too excited for the future that it holds.
Without a further ado, Lets start with Past.
Once upon a time, It looks something like this. “use jQuery and now you are a front end developer”. I know it has happened with most of you as it has happened with me as well. moving on.
The stack at that might look something like this,
jQuery and plugin system
Pure CSS, We were yet to be realize the pain of maintaining CSS as Application grows
Pure HTML, No templating language used and most things were still rendered on server.
No build tool, We manually download the jQuery and similar stuff and integrate that into the project. It was such a pain but we didn't have any options. Most websites avoided the concatenation and minification because of complex workflow.
This is how frontend looked like when compared to backend back then.
We finally have jQuery which provided developers with a simple way to manipulate the DOM and Its has abstracted away difficulties of using Pure Javascript from the developers. It was really a huge win for frontend developers back then.
Browser vendor got united through W3C standard. Back in those days we have really bad support for different emerging technologies. Also IE has long holded us back. But finally browser vendor start getting their act together thanks to W3C.
Ajax started picking pace. We started feeling limitation of refresh on every click on page.
We began to feel limitation of Pure CSS. It became really painful when you have to use !important to get you style right. As the application grew, this point became more apparent. More on this in my talk on react native this evening.
No minification (or) concatenation. We were literally adding each and every file as script tag in HTML. That has resulted in sever loadtime issues.
Non-performant code. We used to use jQuery and a lot of its plugin which has resulted in performance penalty. In reality, We didn't care about performance back then.
Unmanaged code, Back then we didn't have several best practices that we use today, Because of that we have written a lots of unmanaged code. Its now called the Legacy issue.
Lots of hacks : If you have written CSS then you know this. Nothing more on this.
One of my favorite quote related to past. THE PAST MAY HURT, BUT YOU CAN EITHER RUN FROM IT (OR) LEARN FROM IT. With that in mind, Lets move to present,
Which really defines that we have really learned from the past.
We finally have true frameworks. That allow us to manage each and every aspect of frontend development very well.
But then we got a lot of it.
There are over 15+ well maintained framework out there. Here are some of the popular ones. In fact there there are so many framework that we began to began so headlines like this. 10 hottest javascript framework and 20 javascript framework to watch out for. and still
Brace your self, A new javascript framework is coming. This trend will continue for the foreseeable future.
Why there are so many framework. It happening because of this.
coherent (or) ideal way of coding. This has resulted in single source of truth for anyone on the team working on the same project.
manageable and scalable code. All the framework that has been designed modern days is done with keeping this in mind. So we never face issue with managing and scaling the frontend code.
Built in best practices : All the framework comes with established best practices. And most of the time we don't have to think about this as someone already has spent a fortune on this.
component structure : This has been the biggest advantage of modern JS framework. The component structure has allowed the loosely coupled and reusable code.
quick turn around time : Because most of the things that modern application requires is built right into the framework. We can get going with it and produce the production quality code in no time.
Disadvantages:
There’s no real disadvantages to this framework structure. Other than frustrated javascript developer that needs to learn another framework because someone has developed it.
We have got cool CSS framework like foundation, bootstrap, material design lite to name a few but then there are million more out there. every other wants to build their own CSS framework and situation is so worse that we have to build something like this to search through the CSS framework.
There are a lot of benefits that CSS framework offers
to name a few
Grid Layout
Mobile First Design
Drag and Drop design
Built in Best Practices
Large Community
Build tool. My favorite section. This tools have saved a ton of time over the years and are my daily driver. Some of them are mentioned here,
Grunt,
Gulp,
Webpack, The new and powerful kid on the block
Here are some of the advantages that build tool offers
minification
concatenation
modularity
file watcher
live reload
dev server
and it keeps growing, making us more productive.
Its time for the magical tool. Why magical because they have contributed so immensely to our productivity and manageability that they deserve this status.
Npm and Bower - Who don't know the luxury of running just npm install and bower install command to install all the required dependency. Its a joy for frontend developers.
Sass - It has shown us the right way to write manageable CSS. This has lead most libraries and developer to switch to this awesome tool
require.js and browserify - These tool has helped us modularize the javascript file without worrying about concatenating it manually. This has also lead to the hot-reloading which allows javascript to get loaded on demand without intervention of any other special tool
Typescript and Babel - Javascript is nice but it has a very slow cycle of updates. Thank god we have typescript and babel at our disposal. This tools allow us to use advanced feature of upcoming javascript revisions like ES6 and ES7 today. Isn't that cool ?
Javascript is everywhere. I mean literally everywhere.
Hybrid mobile app
Cordova
Phone gap
ionic
react-native
Native script
IOT and Hardware
nodeMCU
Tessel
Virtual Reality
Oculus rift
With all that in mind, Lets look at what future holds for us
As we saw there was huge leap that we have taken from past to present. The future also looks quite similar. I have prepared 5 trends as we prepare for a huge leap forward.
Lets get started. First, Battle of framework. The giants like react and angular will compete for world domination. While other emerging framework will gain significant audience. All in all we will have better framework because of this battle. Keep fighting & keep improving.
Second ES6 becomes mainstream. We have long held back by the javascript for not implementing the modern language features like class and promises. But It will not be the case is near future and ES6 is getting good support across various browser and For all the features that we still don't have we can use babel and typescript. This tools will become much more improved to support whole slew of new features. With ES6 standard will be able to use features like
promises
arrow functions
default + rest + spread operator
Classes
Fetch
Module loader
Modules
Most of the modern framework has already started using this ES6 and ES7 features. We will see more adoption in near future.
third, service worker.
For those you who don't know about service, Here’s short summary what it is.
A service worker is a script that is run by your browser in the background, separate from a web page, opening the door to features which don't need a web page or user interaction.
example for this would be newly introduced push notification in chrome. When you allow certain website to send you push notification, It installs a service worker for them in your browser which then checks for availability of message on certain interval and notifies you if there are any notification.
Some of the application includes
offline web apps
Background sync
Extreme level of caching
Flipkart is using this for its flipkart lite website on mobile. They seen a tremendous user engagement because of this.
I am personally a huge fan of this and waiting for this to go main stream. We will likely see wide adoption and support for this technology
Fourth web components
We are already familiar with the components as we use daily when we use angular (or) react. But those are not the native web components. Native web components offers superior performance and ease of developing components. We already use some of them in the browser here’s the example video tag. We just include source URL and boom we have a video player with all the controls.
There has been a lot of activity going on in this space since all the framework are becoming component agnostic. Polymer is a library which allows us to create native component right now while still the support for it is shaggy. Here’s one example for polymer. Just add add google map component script and pass lat, long value to google-map element and we have working map. Isn't this awesome. I think web component will become main stream in near future as well.
fifth
material design everywhere
Since the introduction material design back in 2014 its gaining wide adoption among the industry. It has received good response from user. Since then most UI library has switched (or) in process of doing so. some them includes
angular-material
ionic 2
react-material
react-native-material
I think this is the year, we will finally see material design everywhere. So this includes my five trends for 2016.
All in all we will be progressing faster than ever before. Thank you. I will leave you with one of the best quotes that motivates everyday.
With that I would like to invite out next speaker who is going to speak about angular 2.