OCS TECH Limited

OCS TECH Limited Digital Marketing, Computer Training, Web Design, Graphic Design, Banners, Handbills, Business Brand

17/07/2026

Habit of a good developer.

A good developer should have in his head:
Concepts and mental models:

Why useEffect exists and when to use it
When to use Context vs local state
Server Component vs Client Component — which one and why
How authentication flow works
Why URL state beats useState for filters
What debouncing solves and how cleanup works

Patterns I've used repeatedly:

The handleChange pattern for forms
Spreading state when updating objects
The await params pattern in Next.js 15
How useReducer actions work

10/07/2026

Get a website for your business for free while you pay for making it accessible to your customers.

10/07/2026

A landing page built for J-WON COUTURE

07/07/2026

Authentication broke me for two days straight.

Not because it's complicated. Because the gap between "understanding how auth works" and "actually implementing it correctly" is wider than I expected.

Here's what I learned building a full auth system from scratch with Next.js and NextAuth.js 🧵

The part that took longest to understand wasn't the login form. It was knowing WHERE to put the session check.

I initially put everything in a Client Component:

'use client'
const { data: session } = useSession();
if (session) router.push('/dashboard');

It worked. But there was a brief moment where the login page would flash before the redirect. Not ideal.

The fix was splitting the page into two layers:

page.tsx (Server Component) checks the session first:
const session = await getServerSession(authOptions);
if (session) redirect('/dashboard');
return ;

LoginForm.tsx (Client Component) handles the form.

Now the redirect happens on the server before anything reaches the browser. No flash. No wasted JavaScript.

This is what people mean by "island architecture" — the server handles data and auth, the client handles only what needs the browser.

Other things that clicked:

— Middleware runs before every request. That's where route protection lives — not inside the page itself. By the time a page renders, the middleware has already decided whether to allow or redirect.

— `getServerSession` on the server vs `useSession` on the client — they solve the same problem in different environments. Mixing them up causes subtle bugs.

— NextAuth v5 vs v4 — v5 is cleaner syntax but still beta. It broke on Vercel in ways that took hours to debug. Switched to v4, deployed in minutes. Lesson: don't use beta in production.

— `NEXTAUTH_URL` is required in production on v4. Took me longer than I'd like to admit to figure out why redirects were breaking on Vercel but working locally.

What's working:
✅ Credential login with JWT sessions
✅ Protected routes via middleware
✅ Dynamic navbar based on auth state
✅ Server-side redirect before page load
✅ Register + login with full validation

Live: https://auth-system-9bo7.vercel.app
Credentials: [email protected] / password123

Next: connecting this to a real database so registration actually persists.

Happy New Month... Let's make this month count for you and your business.
01/07/2026

Happy New Month... Let's make this month count for you and your business.

Address

10, Emmanuel Anointed School, Camp Junction
Lagos
110121

Website

Alerts

Be the first to know and let us send you an email when OCS TECH Limited posts news and promotions. Your email address will not be used for any other purpose, and you can unsubscribe at any time.

Shortcuts

Share