4

letter-display

This repository contains a project designed to automatically fetch newsletter emails and display their content on a website. The project uses Next.js, TypeScript, Supabase, and Tailwind CSS, with design inspiration drawn from Medium.

GitHub

Note: The newslatter fetcher is in letter-display-database repository.

Frontend

The frontend application, implemented in Next.js, dynamically displays all articles stored in the Supabase database using dynamic routes to generate post pages.

Screenshot 2024-05-03 at 17 11 15 Screenshot 2024-05-03 at 17 11 43

Dynamic Routes

The frontend utilizes dynamic routes to generate individual post pages based on the content stored in the Supabase database.

Screenshot 2024-05-03 at 17 12 54

Screenshot 2024-05-03 at 17 13 21

Roadmap

  • Improve `app/post/[id]/page.txs to display correctly the newslatter content.
  • Ranked article feed.
  • Views counter for the Ranked article feed.
  • Multi newslatter fetcher.
  • Create a newsletter hub where everyone can create an account and choose which newsletters they want to fetch and display on their feed. This project serves as the foundation for this newsletter hub.

Installation

  1. Clone the repository:

    git clone https://github.com/AurelDeveloper/letter-display

  2. Install dependencies:

    cd letter-display
npm install

Configuration

Set environment variables in a .env.example file:

SUPABASE_URL=your_supabase_url
SUPABASE_KEY=your_supabase_key