Skip to content

Refactor: NextJS app/ router patterns#2

Open
modojodo wants to merge 1 commit intofix/critical-html-and-react-issuesfrom
refactor/nextjs-app-router-patterns
Open

Refactor: NextJS app/ router patterns#2
modojodo wants to merge 1 commit intofix/critical-html-and-react-issuesfrom
refactor/nextjs-app-router-patterns

Conversation

@modojodo
Copy link
Copy Markdown
Owner

@modojodo modojodo commented Oct 23, 2025

Depends on #1

Key Improvements Made:

1. Server Component Architecture:

  • Removed "use client" from main page
  • Server-side data fetching with proper error handling
  • SEO benefits with server-side rendering

2. Component Separation:

  • Created AdvocateSearch.tsx client component for interactivity
  • Separated server data fetching from client-side search
  • Clean separation of concerns

3. Type Safety:

  • Created shared lib/types. ts with proper TypeScript interfaces
  • Consistent typing across components

4. Schema Fix:

  • Fixed database column name from "payload" to "specialties"
  • Now matches code references

5. Performance Benefits:

  • Reduced client-side JavaScript bundle
  • Server-side rendering for better initial page load
  • Proper caching strategies

The app now follows Next.js 14 App Router best practices.

- Convert main page to Server Component (remove 'use client')
- Extract search functionality to separate client component
- Fix schema column name from 'payload' to 'specialties'
- Create shared TypeScript types in lib/types.ts
- Implement server-side data fetching with error handling
- Separate concerns: server data fetching vs client interactivity
- Maintain SEO benefits with server-side rendering
- Reduce client-side JavaScript bundle size
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant