If you've been living under a rock or buried in projects throughout 2017, this is the article for you.
A lot happened in 2017 that is setting up 2018 for a lot of action and innovation.
You can also use this as a guide to plan out your growth as a developer in 2018 to help you get on more innovative projects.
React vs. Vue.js
Let's get straight to the good stuff: This time last year, not many had faith that Vue would ever become a big competitor to React when it comes to company adoption, but it was impossible to ignore Vue this year, even sending Angular into the shadows in terms of developer hype.
As we look ahead to 2018, we're about to embark on an intense 2 years filled with a lot of excitement for Vue.
But let’s not forget React still has the financial backing of one of the richest companies in the world, not to mention some incredibly talented maintainers. Both core teams also collaborate and inspire one another.
So what’s giving Vue the spotlight?
Vue is doing all the things that make developers really happy:
- Vue is lightweight, easy to learn, has incredible tooling, has great state management and routing built-in (!), etc.
Vue's community certainly isn't as large as React yet, but communities grow based on whether the core team has great ambassadors and listens to its community (both of which are in place).
When it comes to pleasing developers, let's not forget Facebook's epic fail this year with the BSD + Patents license snafu that went over really well with developers.
Sure, Twitter wars never killed a framework, but we’ve seen before how mismanagement (ex: Angular 2 delay) can create a window of opportunity to allow an alternative to step in and take the spotlight.
We've actually reached the point where you might as well start every project with Vue to simplify life, and that's an impressive accomplishment by their core team.
Here's a great write-up on React vs. Vue vs. Angular from this year.
The likely end scenario? Facebook does what it does best: copy the innovators and the world continues to use React.
Every JS developer should still consider learning Vue.js, as it's made a big enough splash to where we are starting to see the requests for Vue.js developers for hire come in, meaning you can create some value for yourself in the short-term at least.
And then there's Next.js, which we'll call 'insurance for React.'
React coupled with Next.js gets you much closer to the Vue experience in terms of tooling, code splitting, routing and state management, allowing you to also retain the massive React ecosystem and support.
Next is also especially useful for server-side rendered apps built in React, an increasing trend on its own.
Plus, add in Now.js (created by the same team) and you have a super fast way to deploy your React apps.
As the Vue vs. React battle continues, expect to see more and more adoption of Next in tandem with React to make everyone in the React camp feel more comfortable.
Despite Angular's growing difficulties at pleasing developers, it will still continue to be a widely used framework in 2018.
Many companies adopted Angular 1.0 years ago, and as they look to migrate to something better in 2018-19, they'll be looking at React or Vue.js as potential alternatives than Angular 2.
Angular’s remaining advocates have taken the stance that Angular will be the JS framework of choice for the enterprise because big companies like OS projects backed by a big company (Google). But can’t the same argument be made about React and Facebook?
It's always worth paying attention to anything that Facebook is using in production.
In 2017, they also released reason-react which creates bindings for React so you can actually write Reason code that compiles to idiomatic ReactJS.
So imagine not needing to install Babel (+ many plugins), Flow, etc. and only needing the power of OCaml + Reason (which now supports React bindings). That's a big trend waiting to explode.
Reason gained far more attention this year in the JS realm than most other compile-to-js languages (sorry Elm, we still love you anyway), so it's definitely one to keep watching and playing with in 2018.
GraphQL is a query language for APIs (think: a modern take on REST).
GraphQL lived up to the hype in 2017, as major companies like Yelp, Spotify, Github, Walmart, NYTimes, etc. all now have GraphQL-based APIs.
Some of these APIs are even exclusively GraphQL, with no REST option even available. Put simply: innovative companies are placing their bets on GraphQL.
RESTful APIs are certainly far from dead, but again, looking at the trends of where startups are moving, GraphQL is a popular option.
Alternatives like Falcor, on the other hand, are barely ever discussed anymore.
This is definitely the time to start learning GraphQL if you want to get jobs at innovative companies.
Redux, Relay Modern and Apollo
But GraphQL really shook things up for Redux, primarily when it comes to data fetching.
But as one developer points out about Recolay/Apollo/Redux:
These frameworks and their benefits do not have to be mutually exclusive. In fact, using them together can provide a nice separation of concerns that is so important in web development.
This means you can still use Redux in tandem with Relay, using Redux for local state and some complex non-server state and then Relay for fetching.
Storybook is an environment for defining, developing, and testing UI components.
It went from practically dead at the start of the year, to massively popular in mid-2017 thanks to a huge community effort. It's such an inspiring story of how open source work should evolve and worth reading about.
It's so incredibly useful (and even fun to use), letting you build and test UI components in isolation. It's like a living UI styleguide that actually provides real value to the developer.
You've likely come across an open source project using Storybook already, but to see it in action for yourself, check out the Storybook for Airbnb's date picker.
If you want to stand out as a developer in 2018, then show up to an interview with a Storybook from your last project.
As the name suggests, Prettier is a code formatter that makes your code much more readable and, well, pretty.
foo(reallyLongArg(), omgSoManyParameters(), IShouldRefactorThis(), isThereSeriouslyAnotherOne());
foo( reallyLongArg(), omgSoManyParameters(), IShouldRefactorThis(), isThereSeriouslyAnotherOne() );
With more than 18,000 stars on Github, developers are loving this simple and valuable project.
It's also used on a ton of other projects you likely already love, like Webpack, React, Next.js, Babel and more.
Then again, you could just become a Go developer and not even need to install this.
Jest and Enzyme
As you'll see here, Jest is now dominating Jasmine in downloads.
Jest's Snapshots feature really took off in 2017, making it far less painful to deal with testing. Watch this talk from React Conf 2017 to learn all about it.
Jest's Snapshots + Enzyme's super simple API for testing React components makes for a great testing combo that will continue to rise in popularity in 2018.
Webpack has risen to become the most popular asset bundler. Webpack has also had an INCREDIBLE year.
This time last year, Webpack barely even had documentation and most developers had no idea how to get started with it.
Then, by the start of the year, I wrote about how incredible it was that Webpack had raised $15,000 in 3 months (and how happy we were to be one of its earliest sponsors) to support the project. They now have hundreds of thousands of dollars in funding.
Not only is Webpack paving the future of how open source projects can thrive, but the project's development has maintained its massive momentum throughout the year.
And with Sean Larkin thankfully still leading the Webpack movement, there's really no end in sight for what Webpack is capable of achieving next.
Because of how well supported this project it is (and how much they care about their community), it makes it the easiest trend to predict for 2018.
But with every massive trend, there is a rising force of disgruntled developers.
Parcel, a competing bundler, is gaining momentum rather quickly with 12,000 Github stars out of the gate in 2017 and going directly after Webpack.
Parcel's pitch is that all other bundlers have become too bloated, while Parcel works twice as fast at bundling as Webpack (10 times faster when using its cache).
It also goes after Webpack's somewhat confusing configuration setup, as with Parcel, there is no configuration needed.
"Just point it at the entry point of your application, and it does the right thing."
Although simplifying configuration and improving speed are both great improvements, I wouldn't be surprised if Webpack doesn't copy these improvements by the first half of 2018.
Similar to Vue vs. React, the little guy will always innovate faster, but it's up to the big guy to be inspired by that innovation and improve their projects.
This is one of the #webpack teams favorite pieces of Parcel as well.
But we also started from a really clean architecture day one. Extensibility as with all options comes with a cost. :) https://t.co/3BlZoe4Ub1