React Tricks

I've been testing several React animation libraries and Framer Motion made the highest impression on me. In this post we'll explore how to use Framer Motion to animate Next.js page transitions.

Animating Next.js page transitions with Framer Motion

How to implement nested and dynamic layouts is a question that comes up often in the Next.js community. In this post, we'll explore how to create a Next.js app with one global layout and multiple (dynamic) sub-layouts for different sections of the website.

Nested dynamic layouts in Next.js apps

Next.js 9 has been released yesterday with some amazing new features. In this post we'll create a simple RSS feed reader to explore how to use the new file system based dynamic routing and API routes.

Exploring Next.js 9 Dynamic Routing & API Routes

A new Next.js 8.1 release with support for authoring AMP pages has been introduced last week. In this post we'll explore how to set up AMP pages with Next.js.

Building an AMP website with React & Next.js

How to use some global data in Next.js pages is a very common question new developers have. In this post, we'll do it with a custom App component and useContext Hook that's included in new React 16.8.

Sharing global data in Next.js with custom App and useContext Hook

I started using React Hooks for my new projects and I love the simplicity of code and increased productivity. In this post I'll give you a high level overview of Hooks and how you can start using them now without having to learn everything there is to know about them.

A high level overview of React Hooks

If you are new to React, my suggestion is to try to build a simple, but production ready website. Learn just enough of React to be able to build upon your existing html/css/js knowledge. In this guide we'll use React & Next.js to build a simple portfolio website for an imaginary photography studio.