Next.js 5 Improves Webpack Support
Next.js 5 Improves Webpack Support
Written by Kay Ewbank   
Friday, 16 February 2018

The latest version of Next.js has been released with better server-side Webpack support and first-class TypeScript support. Next.js is a toolkit for universal, server-rendered (or statically pre-rendered) React.js applications.

The improved Webpack support means that Webpack now works universally with Next.js applications; until now, it would only execute on the client (browser) bundles, meaning developers couldn't use Webpack with Next.js for server-rendering. The developers say they have extensively refactored the codebase to make Webpack work universally.

The second improvement to the new version is the ability to import CSS files and make use of Webpack loaders. The developers say:

"Instead of enabling every conceivable feature and loader by default, we are introducing Next.js plugins, which are simple functions that decorate your configuration."
 
The plan is to develop an ecosystem of practical simple extensions, and the developers have opened the next-plugins monorepo for the Next.js community to maintain.
 
The increasing use of TypeScript by JavaScript developers is behind the announcement that TypeScript will be officially supported by Babel 7, meaning that developers will be able to use it from Next.js thanks to Next.js' use of Babel. However, the developers point out that because of the new Universal Webpack support, this offers another way that full TypeScript support is included in Next.js.
 
Support for React Altlibs and Module Overloading have also been improved in the new version. This means you can use some of the replacement drop-in implementations of React such as preact, nervjs and inferno, or react-dom-lite if you want to use a replacement DOM renderer. The new support again comes from the Universal Webpack support.

Perhaps the most interesting addition to the new version is support for Zones, a technique that lets you develop and deploy separate apps, but then merge multiple apps into a single one that your customers can browse using a single URL. A zone is a single deployment of a Next.js app, and you can have multiple zones that can then be merged as a single app. The documentation says that the concept is exactly the same as microservices, but for frontend apps. Behind the scenes, zones rely on configuration of the backend routing layer or load balancers that expose the apps to the world. You create the zone using normal <Link> components. A proxy is also needed, and the developers have released a node package called microproxy. However, zones can also be used with existing proxy solutions.

nextjs More Information

Learn Next.js

Next.JS On GitHub

Related Articles

TypeScript 2.7 Improves Type Inference

The Programmers Guide To React

React 16 Adds Fragments

To be informed about new articles on I Programmer, sign up for our weekly newsletter, subscribe to the RSS feed and follow us on, Twitter, FacebookGoogle+ or Linkedin.

 

Banner


Udacity Launches Data Scientist Nanodegree
24/05/2018

Udacity has launched a new Data Scientist Nanodegree program. At an advanced level it has projects designed by Bertelsmann, Figure Eight, IBM Watson, Insight, Kaggle and Starbucks which map to the ski [ ... ]



Are You Ready For GDPR?
04/05/2018

GDPR is European legislation that comes into force on May 25th and will affect any business, online or otherwise, that keeps personal data on European citizens. If you don't know how this affects you, [ ... ]


More News

 

justjsquare

 



 

Comments




or email your comment to: comments@i-programmer.info

Last Updated ( Friday, 16 February 2018 )
 
 

   
Banner
RSS feed of news items only
I Programmer News
Copyright © 2018 i-programmer.info. All Rights Reserved.
Joomla! is Free Software released under the GNU/GPL License.