What will be the dominant front-end technology in 5 years time?

In short, you might as well play roulette and bet on black, because nobody can answer this question with fact. We can only present hypotheses.

The world of web development, especially front-end development, evolves about as quickly as the physical tech industry does, and there is no way we can predict what Samsung, Apple, Nokia, and the other’s will churn out in even the next two years. Much less five.

Let’s look at a bit of JavaScript history.

Build Tools (2014 – 2018)

  • Three years ago, Grunt was the dominant build tool.
  • Two years ago, Gulp rose up and stole the throne.
  • One year ago, was Webpack’s claim to fame.
  • Somewhere in there, Browserify fought a good fight.
  • At one point, plain npm scripts became a fad.
  • When I wasn’t looking, Rollup rolled out.
  • Along the way, I built Owlister. (It is junk. Don’t look.)
  • Now, Webpack dominates, but tomorrow is unpredictable.

Transpilers (2009 – 2018)

  • Eight years ago, Coffeescript became Earth’s favorite abstraction.
  • Six years ago, Dart arrived like a drunken monkey on weed.
  • Five years ago, TypeScript was born, bringing type safety to JavaScript.
  • Three years ago, Babel arrived to let us use future JavaScript today.
  • Two years ago, Elm became a buzzword. (Nearly irrelevant, but not quite.)
  • Now, TypeScript and Babel rule. Seemingly invincible? Time will tell…

Frameworks (2010 – 2018)

  • Seven years agojQuery was the most suggested JS “framework”.
  • Six years ago, Backbone and Knockout were widely adopted.
  • Five years ago, Angular and Ember took the stage.
  • Four year ago Meteor stormed the gates and built a following.
  • Three years ago, React took its first breath. The prophecy…
  • Two years ago, Polymer and Vue made names for themselves.
  • One year ago, [Angular 2 and Vue 2] released, [bombing and succeeding].
  • Six months agopeople quit caring that “React is not a framework.” Don’t.
  • Now, Angular 4 has arrived, React dominates, and Vue is a super-power.

*These numbers are not exact, but even the absolute correct time-frames would reveal an identical pattern of “king of the hill”. Don’t grill me.

But wait, there’s more!

In the midst of the frameworks timeline, there have also been countless other contenders take a shot at stardom. Aurelia, Riot, Spine, Dojo, Deku, Inferno, Mithrill, Stapes, Svelte, etc. Any one of these lovely ladies could become the new hotness in a matter of weeks. We just can’t tell.

If I were to revisit this answer in five years, I’d most definitely be adding weird framework titles to my timelines above, as even the power-houses of today will not last forever. These tools will probably be such that I have never even heard of at this point in time.

Behold, WebAssembly.

WASM is… difficult to explain. Simply put, WASM allows developers to compile most any language into performant, browser agnostic byte code. What this means is that the front-end community has the opportunity to detonate yet again with a landslide of developers from all walks of life developing for the browser.

JavaScript has done its job well, but as the world progresses it will be replaced. That time could very well be within the next five years. The murderer could be WASM or it could be a new browser that takes a majority of the market share that allows developers to write their applications in Haskel. Improbable, yes. Impossible, no.

The Safe Bet.

As it stands, our best guess is that JavaScript will still dominate the browser in five years. That said, your best bet would be to acquire a slew of developers who are tool/framework agnostic by means of deep JavaScript understanding. Don’t allow yourself to be contracted to a specific tool. I guarantee you that Angular, React, Vue, Backbone, Aurelia… none of these guys will reign in five years.

Those who become proficient with languages and have a firm understanding of design patterns and architecture will have no problem adapting to future tools and are, in essence, future-proof.

750 Free icons from Google for Material Design

action-icons

Google Design are open-sourcing 750 glyphs as part of the Material Design system icons pack. The system icons contain icons commonly used across different apps, such as icons used for media playback, communication, content editing, connectivity, and so on. They’re equally useful when building for the web, Android or iOS.

Check them out: https://github.com/google/material-design-icons/releases/tag/1.0.0

Top 10 Best AngularJS Templates in 2015

top-10-templates-featured-750x410

As 2015 comes to a close, it seems appropriate to round out a list of the best AngularJS templates that I’ve seen this year.

Whether you’re looking to build a dashboard application, a portfolio application, or you are merely looking for a responsive AngularJS template to build your application on, there is sure to be a template suited for your needs. Here are our top 10 best AngularJS templates this year.

There are many fantastic templates available on the web, and it is difficult to decide which is the best AngularJS template available. When looking for a suitable template, there are many decisions that you have to weigh: responsiveness, quality of code, design, price, etc. Depending on what web app you are building, the best template for you might be different from that of another web application.

This list contains 10 of my favorite templates, and I am are sure that there are many more quality templates available.

1. Metronic

metronic-dashboard-template

Metronic is a responsive and multipurpose theme powered through the Twitter Bootstrap and AngularJS frameworks. It is a flexible theme that can be used for many different kinds of applications.

Metronic has a beautifully designed flat UI, and works on all major web browsers and on mobile devices. Metronic currently comes with 6 complete admin themes. Metronic’s beautiful UI and flexibility makes it one of our all time favorite AngularJS themes, and is definitely one of the best AngularJS templates available.

2. Xenon

xenon-dashboard-theme

Xenon is a lightweight responsive dashboard and admin template built with Bootstrap. Xenon contains plenty of UI components, layout variants and themes that make up a total of 136 HTML files. Talk about value for money!

Despite its large number of files, Xenon practices neat organization of files, clean code, and easily expandable features. Xenon is responsive and retina ready and works perfectly with mobile devices. It is one of the best AngularJS templates available that has almost everything, and is sure to save you plenty of development time when working on a large project.

3. INSPINIA

inspinia-angularjs-template

INSPINIA is a premium responsive admin template built with Bootstrap 3, HTML 5, and CSS 3. INSPINIA comes with a huge collection of reusable UI components and features a beautifully designed flat UI. It can be used in a wide variety of applications such as admin panels, application backends, content management systems, and more.

INSPINIA not only supports AngularJS, but also many other frameworks such as Ruby on Rails and Meteor, and comes with a seed project for each. It is an easily reusable template that promises continuous free updates, making it one of the most versatile and best AngularJS templates for use in almost any application.

4. Admin Box

admin-box-dashboard-template

Admin Box is a beautifully presented AngularJS dashboard template. It is powered by SASS and Grunt for easy development, testing and production.

Admin Box comes packaged with a suite of features, such as form validation and customization, vector maps, and many more. The Admin Box template also uses SASS files, which makes it extremely easy to customize it to your needs, making it a fantastic template to use for web development.

5. Material

material-responsive-template

Material is a powerful, lightweight, fully responsive AngularJS template. Material is inspired by Google Material Design and sports a gorgeous UI powered by Bootstrap 3.

Material comes with a variety of UI components and form components such as a date picker, color picker, toggle elements, and retina display compatible icons and images. All the components used in Material are completely customized to match Material Design, making it a beautifully cohesive template to start your next application on.

6. Pages

pages-responsive-template

Pages is not just a dashboard template, but a multi-purpose, carefully designed UI framework. It is crafted with special attention to detail. It comes with a large variety of application templates such as a calendar, social dashboard, email application, and many other UI features such as a navigation menu.

Pages is a responsive AngularJS theme with a beautifully designed UI. Its large number of potential uses and promises of free updates makes it one of the best AngularJS templates available. It’s a steal at $23 on the ThemeForest market.

7. Angle

angle-dashboard-theme

Angle is a web dashboard app based on Bootstrap and AngularJS. This dashboard template contains many ideal components for use in your next dashboard page or web project.

Angle contains two dashboard templates: for use in AngularJS as well as jQuery, allowing you to utilise this dashboard template in non-AngularJS apps as well. It is a great responsive theme with many useful components, making it one of the best AngularJS templates to build your dashboard project with.

8. Angulr

anglr-angularjs-template

Angulr is a web admin theme powered by Bootstrap 3 and AngularJS. Angulr features nested views, routing and lazy loading making it suitable for large projects. Angulr is fully responsive and works on mobile devices as well as across browsers.

Angulr is a very comprehensive template that can be used for a wide variety of applications. It also comes with a single page music application template, perfect for rapid prototyping of your next music application.

9. SmartAdmin

smart-admin-angularjs-template

SmartAdmin is a responsive web application template that contains working variations for multiple web frameworks, including AngularJS. It makes use of Grunt for working tasks and uses LESS and SASS CSS for easy customization, allowing you to easily modify the template for use in your web applications.

SmartAdmin comes with over 50 customized plugins and promises free lifetime updates. It claims to be a “chameleon” template that adapts to your needs, and it is built using modern technologies. It is fully responsive and is one of the best AngularJS templates that also caters to other frameworks, should you choose to use it as such.

10. Triangular

triangular-angularjs-template

Triangular is a unique Material Design AngularJS dashboard template. It is built from the ground up using Google’s Angular Material Design project. It claims to be the only fully Material Design AngularJS template around.

Triangular is a well organized template that uses best practices for front-end development. It comes bundled with 4 premium packages that include tons of Material Design resources, such as avatars, backgrounds, and fonts, making it one of the best AngularJS templates that makes full use of Material Design.

 

How to trust a host using AngularJS

How to tell to AngularJS that a site is a trusted host, You can use $sce.getTrustedResourceUrl() to trust the URL.

You may optionally configure $sceDelegateProvider to white list the URLs.

Reference:  https://docs.angularjs.org/api/ng/service/$sce#getTrustedResourceUrl