Is Vue.js taking over React.js in 2017?

Answer by Polina Polukhina

I think that this is a rather difficult question, which is most easily answered by yourself, just by trying, below I will describe all the experience in these tools and you will be able to learn a lot of information about this.
So….
React.JS

React is actually a JavaScript library created to build user interfaces. It is supported by Facebook and Instagram, and has become a core technology in the endless feed of these two applications. As a JS library, React has quite a limited sphere of usage, but when bundled with other libraries it becomes a powerful solution, which nowadays is one of the main competitors of Angular. And this is why:

Advantages of React

  • Component model
    React doesn’t use any templates. The component logic is written in JavaScript, which gives more flexibility, enables rich data to easily pass through your app, and keep state out of the DOM. Though this approach is used in all the compared frontend frameworks, React was the first one to introduce a component model.
  • Virtual DOM
    As already explained, a virtual DOM enables creating a simplified copy of the DOM. All the changes that need to be implemented are made in the virtual DOM. Later on, two DOMs are compared and when the differences are identified, the real DOM will re-render only the changed part. This is much faster and more efficient than working directly with the DOM.
  • One-way data binding
  • Two-way data binding was an advantage for Angular, and the one-way data binding of React may be an advantage as well. This approach makes the view react to any changes made to the model, but the view itself cannot affect the model. As a result, the data only flows in one direction, which reduces the possibility of any side effects.
  • Native mobile development framework

React Native is an affiliate of React.js, a framework created to develop native mobile apps using JavaScript. With its help, applications include native building blocks and look exactly the same as apps built with Objective-C or Java. The big advantage is that you only need one developer to build the native application for two platforms, as only a knowledge of JavaScript is needed. When compared to hybrid mobile apps built with Angular, React Native apps show much higher performance and are almost as powerful as native apps.

  • Big community
    Being supported by the world’s two major social media companies, React has millions of users across the globe. The strong community means access to quick help from experienced developers. On Github React has gathered over 73 thousand stars, and the usage statistics on npm shows that the framework was downloaded more than 4,766 million in the last month. A very impressive score!

Disadvantages of React

  • Need to use third-party technologies
    As already mentioned, React is a JavaScript library, not a framework. As a result, its possibilities are limited. To extend the functionality, it is necessary to use third-party modules and libraries. Reading the documentation and learning how to use these technologies may take some time.
  • Using JSX
    React recommends using JSX instead of regular JavaScript and HTML. Actually, this is JavaScript, but extended with XML syntax. The creators claim that JSX is faster, safer and easier than JS. So, to get the most from React you will need to learn this modification of JavaScript.
  • Complex app structure
    React doesn’t have any predefined structure. This means that structuring the app is fully the responsibility of the developer, and depends a lot on his knowledge and experience.
  • Steep learning curve
    React isn’t the easiest technology to learn. Besides React itself, you will need to get to know several other libraries and modules as well.

When to use React?

React is pretty universal, which means you can build nearly anything with it. However, there are some cases, where React is an absolute must. For these apps it is currently the best solution available on the market.

  • Dynamic application
    Building an app that needs to re-render quickly? React is a good choice due to the ability to quickly reflect the data changes in the view.
  • Single page apps
    Since React can display content changes without reloading the current page, it is a great solution for single page apps.
  • Native mobile apps
    React Native enables building mobile apps that are indistinguishable from native apps built with Java or Objective-C.

Vue.js

Vue.js is a progressive framework for UI building. This alternative to Angular and React is now gaining popularity. It is extremely popular in China, and is now spreading to the west, which is to be expected.

Advantages of Vue.js

  • MVC framework
    Just like Angular, Vue is an MVC (or Model-View-Controller) framework. The advantage of this is obvious – the ability to write well-structured code, which is extremely important when working on complex applications.
  • Lightweight solution
    One of the significant advantages of Vue is the small size of the framework as it doesn’t include many features right “out the box”, but the functionality is easily extended with a variety of third-party solutions. It is often compared to Angular, which is a monolithic framework with a bunch of built-in features, which are unlikely to be used in your app at all. Of course, tree-shaking allows eliminating the unused code, but the size of the framework remains higher compared to what Vue offers. A full-featured Vue 2 project with Vuex + vue-router weighs ~30kb gzipped. At the same time, an out-of-the-box, AOT-compiled application generated by angular-cli has the size of ~130kb gzipped. A compact size and the ability to include third-party modules to extend the functionality make Vue.js a wiser choice for those who care about reducing the size, and therefore improving the speed of the web app.
  • Declarative templates

The templates in Vue.js are written in HTML, which makes them readable without the knowledge of other programming languages.

  • Virtual DOM
    Due to lighter-weight virtual DOM implementation, apps built with Vue.js have the highest performance in comparison to other frontend frameworks.
  • Two-way data binding
    Vue.js automatically syncs the whole model with the DOM.
  • Supported by Laravel “out of the box”
    Laravel is one of the best PHP backend frameworks. The support of Vue allows building web apps using two of the most progressive technologies without any additional installations.
  • Pure JavaScript
    Vue.js uses pure JavaScript, so there’s no need for the developers or testers to learn any other programming language or its variation.
  • Low learning curve
    Compared to Angular and React, Vue.js is the easiest frontend technology to learn and start working with. In addition to this, you can start adding Vue.js to your project step by step.

Disadvantages of Vue.js

  • Small community
    Vue is less popular when compared to Angular and React, both of which have an impressive number of users. However, you can still count on support from other community members.
  • Fewer libraries for Vue.js
    Since there are fewer users of the framework, they share fewer solutions to extend the framework functionality.
  • Chinese roots
    This framework was created by Evan You a former Angular developer. He knew exactly the weak points of Angular and started to work on an alternative, while keeping all its advantages. The new framework quickly became extremely popular in his native country China. As a result, documentation for some of the third-party libraries may be available only in Chinese.
  • Rising popularity
    With about 658,000 downloads per month, Vue.js is showing great results. Over 63 thousand Github stars prove the rising popularity, and reflects the views of the community as well. Vue.js is now being used all over the world. This means that there will be more and more solutions compatible with this JS framework.

When to use Vue.js?

Vue can be used for many different types of applications. Due to its compatibility with other JavaScript libraries and ability to add more complex logic to the existing apps, it can provide a perfect solution for nearly any type of project. But you should consider Vue.js as a primary option for the following requirements:

  • Dynamic high-performance applications
    Similar to React, Vue.js is a good choice for dynamic applications, however thanks to virtual DOM it offers higher performance, which is beneficial for complex apps.
  • Single page apps
    Vue.js allows changing the content quickly without reloading the page, which makes this framework perfect for SPAs.

The family of JavaScript frameworks is huge. They are built to solve different tasks, their functionality can be extended by using various third party solutions, which require different levels of expertise. They are all different. So now you know a little more about this, check out this article and find out more about Frontend frameworks

Advertisements

What is the future of web development in 2018?

Answer by Polina Polukhina

2017 is almost over and web development trends are changing rapidly. So I’ll tell you the future web development trend in 2018:

Progressive Web Applications

The world first heard about progressive web apps in 2015. The next year we met the pioneers of this technology, and in 2017 progressive Web Applications seem to have become the major competitor of native mobile apps.

Progressive web apps (or PWAs) are websites that feel like native mobile apps. Thanks to service workers, they can work offline, delivering an extraordinary user experience.

Online customer support

2016 was the year of chatbots. 2018 will be the year of helpful chatbots. Since there are thousands of bots out now, the quality of their services will be the next web development trend.

The prediction is that 85% of all customer interactions will proceed without human assistance till 2020.

A customer service chatbot becomes a must on almost every website. Whether you are selling electronics, crocheted toys or software development services, you should have a chatbot.

Static websites

You definitely remember the concept of a static website from the early years of the World Wide Web. All the first websites on the Internet were static.

But then the era of dynamic websites began.Websites became more functional and easier to update even for people with no technical background. At the same time, the development process became more complicated, as the extended functionality required communication with the server, so backend development got involved. Modern CMSs are the actual dynamic websites

Nowadays, the web is returning to its roots. Static websites are becoming the web development trend of 2018 again.

Single-page websites

Another web development trend for simplicity is single-page websites. This solution allows putting all the content onto one long scrollable page, removing any clutter.

One-page websites have a bunch of advantages. They don’t challenge the visitor with complex navigation, multi-level menu, and tons of text. The essential information is all on one page. The user only has to scroll to it.

Of course, the use-cases of single-pagers are limited. This type of website will not suit e-commerce projects and blogs. At the same time, businesses can significantly benefit, presenting their services in a simplified and more engaging manner.

Push notifications for websites

Mobile apps notifications turned out to be a highly efficient means of user re-engagement. And recently this idea has been implemented for websites and is becoming new web development trend.

The workflow looks quite simple: the user visits a website and is offered to enable push notifications. The user will then be notified of any changes on the website (like a new blog post or a private message), even after he has closed the tab with that website.

The major benefit of such a technology is obvious – you can keep the user engaged without big efforts.

Flash to HTML

In 2010 Steve Jobs published his thoughts on Flash and its future. It became clear that this technology won’t last long. Jobs’ statement about the death of Flash is quite popular for around two years now when YouTube defaulted to HTML5 players.

The major weakness of this technology is the incompatibility with mobile devices. An enormous amount of traffic is lost just because of the outdated technology.

Motion UI

Simplicity is the trend in recent years. This is also true for web design. Users are already tired of crazy GIFs and flashing ads, that’s why websites with moderate design get more appreciation.

At the same time, sophisticated motion UI is becoming more popular. Animations allow to add more style and enable you to distinguish your website from the thousands of others with the static UI.

There are several ways to add some life to your minimalistic website. Consider page header transitions, nice hovers, animated charts, background animations and modular scrolling. These and many other elements may make your web presence much more enjoyable for users. The true artwork!

JavaScript – Angular 2 and Angular 4

JavaScript is the number one programming language for web applications. With dozens of JS-related technologies already existing and still in development, it will even strengthen its positions. The highly anticipated release of the last years Angular 2 becomes highly appreciated in modern web development.

We met Angular 2 in 2016. It is a complete rewrite of the AngularJS framework. The main advantages are improved modularity, app architecture scalability, improved dependencies injections, etc.

PHP 7.x – Laravel 5.x

PHP remains the popular choice for website backend development. This programming language has improved its positions even further after the release of version 7.x. The latest update of the PHP framework Laravel 5.x is a recognized web development trend in 2018.

Laravel is the most popular open-source PHP web framework. All the benefits of it can be fully experienced on dynamic websites with complicated backend.

Laravel offers ready solutions for complex tasks. The variety of existing packages makes the development process faster and more reliable. Regular updates ensure that the framework complies with the current needs of the website owners and the requirements of the time.

And of course you should remember that nowadays having a website is more important for the company than having an office. You can read this article and find out more about web development trends in 2018

Is front end web development a good career today?

Answer by @geoffreybans

Front end development is a great career in 2017, but don’t get hit by the bus.

There is all the hype around as to which is the latest cool front end technology to learn as a beginner.

You assign yourself a task to learn front end development only to realize that the task is to find the particular framework to learn.

Let me give you a few tips that will help you be a better front end developer.

1. Learn JavaScript

It’s great that you have already mentioned that you know some jQuery.

That is great, though you should know that jQuery is not JavaScript. In fact, front end developer is another name for a JavaScript developer.

JavaScript is the programming language that you will use throughout your front end development. Forget about CoffeeScript for now.

2. Build some Boostrap themes

It is quite easy to take a responsive Bootstrap template, paste it on a server and viola! you have a responsive website.

Nah! If you want to be a great front end developer, try and recreate the whole template ground up because in most cases you will be required to build a user interface from a Photoshop mock up, not from another bootstrap template.

Check out my other post on 7 Silly Mistakes Developers Make That Will Ruin Your Career in 2017

Take for example a WordPress theme that is full of features and create a Bootstrap template that looks similar ground up.

This will help you get a good eye for design, how to layout the page, pixelation and matching color codes among other front end stuff.

3. Build a jQuery plugin

I thought I knew a lot of JavaScript! Not until I set to build a jQuery AutoSuggest plugin here.

I had to learn JavaScript itself in order to understand document object manipulation better.

The concept of nodes, childnodes, document nodes – it’s all really interesting in native JavaScript. jQuery abstracts much of this such that you never get to know what’s going on under the hood.

You can do some front end for my open source jQuery plugin, I will be willing to help you with some JavaScript tips.

4. Consider taking a UI/UX course

If you are very very serious about front end software developer then you want to consider one of these courses that will help you understand user interaction with interfaces.

In order to design great interfaces that yield greater users experiences you need to have a better understanding of the UI/UX design and these courses go a bit into more depth about that.

I am not a front end dev so I might not say much about them.

5. Go get a job

You asked what employers like – employers like a developer who has a job!

You could task yourself reading all this content and trying to build some demo projects but without that job experience, employers will still consider you a risky investment.

Learning all these skills is only interesting if you are actually doing something useful with the skills learnt, or you will even forget what you learnt.

Because getting a front end developer job might be hard when you don’t have the experience, I suggest you build a project by yourself that you can then show off as part of your portfolio to help you get a job.

You might need to team up with a back end developer if you project will need some back end work.

Have you considered contributing to open source projects on GitHub?

If you are still stuck on how to get started with front end development then please message me if you want to work with me on some of my open source projects as you sharpen your front end skills.

Cheers!

Link to the post on Quora – https://www.quora.com/Is-front-end-web-development-a-good-career-today/answer/Geoffrey-Bans

What should a front-end web developer know in 2017?

What should a front-end web developer know in 2017? by Tracy Chou

Answer by Tracy Chou:

The most basic building blocks for frontend development are HTML (for page structure), CSS (for styling), and JavaScript (for interactivity), so it’s always good to have a baseline understanding of these fundamentals first.

As of the last few years, React, a JavaScript library, is becoming the standard framework for frontend dev — and it’s even more appealing for devs that need to work cross-platform, with the advent of React Native — as:

  1. it has an easy and intuitive philosophy around defining views and state, making it clean, understandable, and debuggable, and
  2. it’s smart and efficient about rendering and only re-rendering components as necessary, dependent on state changes.

Very roughly speaking, React ties together HTML and JavaScript.

On the CSS front, no one codes straight CSS anymore, so familiarity with a CSS pre-processor like {Sass or Less} is also table stakes for a frontend developer in 2017.

Given the ubiquity of multiple form factors like mobile, tablet, and desktop, I’d also recommend familiarity with building responsive web views. There are nice JavaScript and CSS libraries that help with this, many building on Google’s Material Design guidelines.

There are many adjacent topics worth knowing as well, e.g. Webpack for module bundling (though the Webpack experience is pretty terrible[1], and the community’s choice of bundler seems to change every 1–2 years); JSON Web Tokens for authentication (displacing cookies, which was previously standard); Relay/GraphQL or {Redux or Flux}, depending on how deep you want to get into data flows and data fetching; not to mention general software engineering skills like googling for code to copy/paste from Stack Overflow [2], debugging, performance optimization, testing, project management, working with non-devs…

[1]

https://twitter.com/iamdevloper/…

[2]

https://twitter.com/thepractical…

What should a front-end web developer know in 2017?