Best of Next.js — November 2023

1. 1
   Article

   Community Picks·3y

   Do we really need a backend now? Can we build applications without backend with Next.js 14?

   The role of the backend in web development has been a critical component for many years. However, with the advent of frameworks like Next.js 14, the question arises whether a backend is still needed. The author presents their opinion that for many applications, a separate backend is not necessary. They discuss the use of third-party APIs, the challenges of syncing data with databases and external APIs, and the scalability issues of deploying a frontend-focused platform. They also highlight the benefits of building applications with a custom backend, such as full control and flexibility. The author recommends their blog for more information on backend technologies.

   222

   37
2. 2
   Article

   asayer·3y

   Best Practices for Security in Next.js

   Explore common security vulnerabilities in web applications and learn best practices for securing Next.js applications, including keeping dependencies up-to-date, input validation, authentication and authorization, data encryption, implementing security headers, and using TypeScript for type safety.

   175

   2
3. 3
   Article

   daily.dev·3y

   Moving back to React

   daily.dev migrated from Preact to React in order to resolve development issues and improve performance. The move allowed for better compatibility with Next.js, enhanced development experience, and prepared the platform for future technological advancements. The migration was successful and enabled a healthier future for all daily.dev apps.

   108

   7
4. 4
   Article

   freeCodeCamp·2y

   How to Create Scroll Animations with React, Tailwind CSS, and Framer Motion

   Learn how to create scroll animations in React using Framer Motion and Tailwind CSS. The tutorial covers setting up the project, building the scroll component, adding animation functions, and animating the components on scroll.

   103

   4
5. 5
   Article

   freeCodeCamp·3y

   Secure Next.js Applications with Role-Based Authentication Using NextAuth

   Learn how to secure Next.js applications with role-based authentication using NextAuth. This comprehensive tutorial covers the basics of NextAuth, integrating OAuth providers, custom authentication provider using MongoDB, and protecting pages on both the server and client side.

   103

   1
6. 6
   Article

   Supabase·3y

   Supabase is now compatible with Next.js 14

   Next.js 14 was released with performance and stability improvements, including server actions. Supabase is fully compatible with Next.js 14 and has a package called @supabase/ssr and a starter template to simplify building Next.js apps with Supabase.

   86

   3
7. 7
   Article

   freeCodeCamp·3y

   How to Create Dynamic API Routes in Next.js

   Learn how to create dynamic API routes in Next.js, enabling you to create API endpoints and handle HTTP requests using Node.js serverless functions.

   78
8. 8
   Article

   freeCodeCamp·3y

   How to Setup Authentication and Protected Routes in Next.js 13 with next-auth.js

   Learn how to setup authentication and protected routes in Next.js 13 using next-auth.js. The tutorial focuses on the implementation using the Google Provider and provides step-by-step instructions for setting up the next-auth.js library, creating the necessary folder structure, getting the clientId and clientSecret for Google Provider, and implementing protected routes with next-auth.js.

   44
9. 9
   Article

   Honeypot·2y

   Why Choose Next.js - Top 5 Performance Benefits

   Next.js is a flexible React framework that offers performance benefits through server-side rendering, optimized image loading, automatic code splitting, caching mechanisms, and incremental static generation. It also provides developer-friendly features like error handling, fast refresh, built-in SEO support, and integrations with third-party platforms.

   41
10. 10
    Article

    Community Picks·3y

    Recap of Next.js Conf 2023 and v14 release

    Recap of Next.js Conf 2023 highlights, including stable server actions, partial static prerendering, and updates on Turbopack. The presentations covered React's vision for the future, optimizing third-party loading, debunking the Headless CMS lie, and performance improvements with React 18 and Next.js.

    41
11. 11
    Article

    Syncfusion·3y

    Top 7 Ways to Write CSS in Your React or Next.js App

    Learn seven different approaches to writing CSS in React and Next.js apps, including global CSS, CSS modules, preprocessor, CSS-in-JS, utility classes, CSS frameworks, and component libraries. Each approach has its pros and cons, and choosing the right one depends on your project's needs.

    31