Build a content site

Build a modern blog called "The Daily Byte" using Next.js and TypeScript.
Include these pages: homepage with hero section and featured articles grid,
article listing page with category filters, individual article page with
rich text content and author bio, author profile page listing all their posts,
about page, and a contact page. Use a clean, modern design with a serif font
for headings and a sans-serif font for body text. Add a responsive navbar with
logo, navigation links, and a search icon. Include a footer with newsletter
signup and social media links.

Connect Strapi and create the following content types:

1. "Article" - title (text), slug (uid based on title), content (rich text),
   excerpt (text), featured_image (media), category (relation to Category),
   author (relation to Author), published_date (date), seo_title (text),
   seo_description (text), is_featured (boolean)
2. "Category" - name (text), slug (uid based on name), description (text),
   color (text for hex code)
3. "Author" - name (text), slug (uid based on name), bio (rich text),
   avatar (media), twitter_handle (text), website_url (text)

Fetch articles from Strapi on the homepage and article listing pages.
Use static generation (getStaticProps) for fast page loads with
incremental static regeneration so new articles appear without a full rebuild.

Build the article detail page at /articles/[slug]:

- Fetch the full article from Strapi by slug
- Render the rich text content with proper formatting for headings,
  paragraphs, lists, images, code blocks, and blockquotes
- Show the article title, published date, category badge, and reading
  time estimate at the top
- Display the featured image as a hero banner
- Add an author card at the bottom with avatar, name, bio snippet,
  and a link to their full profile page
- Add SEO metadata using Next.js Head: page title, meta description,
  Open Graph image, and Twitter card tags
- Add structured data (JSON-LD) for Article schema to help with
  search engine indexing

Add category and author pages:

- Create a category page at /categories/[slug] that lists all articles
  in that category with the category name, description, and a colored
  header matching the category's hex color
- Add category filter buttons on the main articles listing page that
  filter without a full page reload
- Create an author profile page at /authors/[slug] showing the author's
  avatar, full bio, website link, Twitter handle, and a grid of all
  their published articles sorted by date
- Add an "All Authors" page at /authors listing every author with their
  avatar, name, article count, and a link to their profile

Add a search feature to the blog:

- Add a search icon in the navbar that opens a search modal overlay
- The search modal should have an auto-focused text input with a
  clean, minimal design
- Search articles by title, excerpt, and content using the Strapi
  search API or a client-side search index
- Show results as a list with article title, excerpt preview, category
  badge, and published date
- Highlight the matching text in the results
- Support keyboard navigation: arrow keys to move between results,
  Enter to open an article, and Escape to close the modal
- Show "No results found" with suggested categories when the query
  does not match any articles

Connect Supabase and add newsletter functionality:

- Create a "subscribers" table in Supabase with: id (uuid), email (text,
  unique), name (text, optional), subscribed_at (timestamp), is_active
  (boolean, default true)
- Add a newsletter signup form in the site footer with an email input
  and a "Subscribe" button
- Add a larger newsletter signup section at the bottom of each article
  page with a heading like "Stay in the loop" and a brief description
- Show a success message after subscribing and handle duplicate emails
  gracefully with a friendly message
- Add row-level security so subscribers cannot read other subscribers' data
- Add a simple admin API route to export the subscriber list as CSV

Connect Google Analytics (GA4) and add tracking:

- Add the GA4 measurement script to the site
- Track page views automatically on every route change
- Add custom events for: article_view (with article title and category),
  newsletter_signup, search_performed (with search query), author_profile_view,
  and category_filter_used
- Set up content grouping by category so you can see which topics
  drive the most traffic
- Add UTM parameter tracking for measuring social media and email
  campaign performance

Deploy the blog to Netlify:

- Set up the build configuration for Next.js with the correct build
  command and output directory
- Add all required environment variables: Strapi API URL, Strapi API
  token, Supabase URL, Supabase anon key, and Google Analytics
  measurement ID
- Enable automatic deploys so the site redeploys when you push changes
- Set up a Strapi webhook that triggers a Netlify rebuild whenever
  an article is published or updated
- Configure a custom domain like dailybyte.netlify.app