Intro to Next.JS

By Riaz Virani

WHere are We?

...Right Now

We Are Here...

What we were promised...

Use a SPA...

It will be fast!

You won't load unnecessary code!

Separation of Concerns!

PROMISES!

Traditional Client RenderING

• Really Fast After it's Loaded
• Not Tightly Coupled With Server
• Easier to Manage Sophisticated UIs

PROS

• Really Slow to First Render
• Hard on SEO and Web Crawlers
• Loads a Ton of Unneeded Code

CONS

Traditional Client RenderING

• Really Fast After it's Loaded
• Not Tightly Coupled With Server
• Easier to Manage Sophisticated UIs

PROS

• Really Slow to First Render
• Hard on SEO and Web Crawlers
• Loads a Ton of Unneeded Code

CONS

Next.JS

React-based framework for server-rendered React applications

• Enforces a minimal pattern for routing
• Server-renders first load
• Prefetches subsequent pages
• Limits loaded modules to just what's needed on page for each load
• Very, very well documented

Requirements

• React
• Node Deployment  
• Must Use Next for All Routing

(Not in NextJS 3.0)

Can I use Other Libraries?

Can I use Create React App?

NO!

Getting STarted

Questions