Custom Authentication

Learn how to secure your application with Custom Authentication.

The Custom Authentication strategy in our template provides a simple yet effective starting point for managing user authentication. This approach is built using React Server Actions and relies on a cookie-based system for user identification and session management.

Get Started Wisely

While the Custom Authentication strategy is a valuable learning tool, we encourage you to evaluate your project's requirements and security considerations. Choose the authentication solution that aligns with your application's needs, security standards, and scalability goals. Implementing a robust authentication solution is crucial to ensuring a secure and seamless user experience.

Configuration

If you open the global configuration at src/config.ts, you'll find the auth object:

import { AuthStrategy } from '@/lib/auth/strategy';
 
export const config = {
  // ...
  auth: {
    strategy: AuthStrategy.CUSTOM,
  },
  // ...
};

To use this method, you need to set the auth.strategy to AuthStrategy.CUSTOM.

How it Works

  1. User Login: When a user attempts to log in, the provided credentials are sent to the server for validation through React Server Actions. Then the server checks the credentials against a hard-coded user repository.
  2. Creating a Session: Upon successful validation, the server generates a session token, uniquely identifying the user's session. This token is securely stored in an HTTP cookie on the client's browser.
  3. React Server Components: With the session token in place, React Server Components come into play. These components are used to fetch user-specific data directly on the server, utilizing the session token for authentication. This ensures that sensitive user information remains secure.
  4. Rendering React Components: The data fetched by React Server Components is then passed to the relevant React components for rendering. This allows us to provide a personalized user experience without exposing sensitive information to the client-side JavaScript.

Social Login and OAuth

It's important to note that our Custom Authentication method doesn't include social login capabilities out of the box. Implementing social login requires intricate OAuth integrations with various platforms. We recommend using third-party solutions like Next Auth for streamlined OAuth-based social login functionality.

Exploring Alternatives

For production-grade applications and projects requiring advanced authentication features, we highly recommend considering alternative authentication solutions that offer comprehensive security features, social login integrations, and third-party support. Some popular alternatives include:

  • Auth0: A powerful authentication and authorization platform that offers robust security features, social login, and seamless integration options.
  • AWS Cognito: A fully managed identity service that provides user authentication and authorization capabilities.
  • Firebase Authentication: A comprehensive authentication service with support for social login, multi-factor authentication, and user management.
  • Supabase: An open-source platform that provides authentication, database, and API functionalities, all tightly integrated and ready to use.
  • Clerk: A developer-friendly authentication and user management service that simplifies complex authentication workflows.

These alternatives offer additional benefits like OAuth support, multi-factor authentication (MFA), and user management interfaces, allowing you to focus on building your application's unique features.