🛑 Admin Pages

Create an AuthCheck component to render content for signed-in users

Client-side security logic will keep your app 100% secure?

Auth Check or Route Guard

file_type_js components/AuthCheck.js
import Link from 'next/link';
import { useContext } from 'react';
import { UserContext } from '../lib/context';

// Component's children only shown to logged-in users
export default function AuthCheck(props) {
  const { username } = useContext(UserContext);

  return username ? props.children : props.fallback || <Link href="/enter">You must be signed in</Link>;

Usage in a Component

file_type_js admin/index.js
import AuthCheck from '../../components/AuthCheck';

export default function AdminPostsPage(props) {
  return (


Questions? Let's chat

Open Discord