Svelte News - News website made using Svelte🔥

Overview

Svelte News is a cutting-edge news aggregation application built with Svelte and TypeScript, designed to provide users with the latest news across multiple categories.

Features

  • Multi-Category News: Fetch top news from categories like Sports, Tech, Science, Entertainment, and Business 📚
  • Responsive Design: Fully responsive layout that looks great on all devices 📱
  • Caching Mechanism: Intelligent local storage caching to reduce API calls 💻
  • Theme Support: Dark and light mode toggles 🌑
  • Progressive Loading: Smooth news loading with elegant retro styled UI 🚀

Tech Stack

  • Frontend: Svelte + TypeScript + Vite 🔥
  • Styling: Tailwind CSS + Shadcn UI 💄
  • News API: The News API 📰
  • Icons: Lucide Icons 🎨

Prerequisites

  • Node.js (v16+)
  • npm or yarn or bun or pnpm
  • The News API Key

Installation

  1. Clone the repository

    git clone https://github.com/xeven777/svelte-news.git
    cd svelte-news
    
  2. Install dependencies

    npm install
    
  3. Create a .env.local file in the root directory and add your News API key

    VITE_APIKEY=your_api_key_here
    

Running the Application

npm run dev

Customization

  • Modify categories in NewSection.svelte to add or remove news categories
  • Adjust caching duration in fetchNews function
  • Customize UI components in the ui directory

Contributing

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

Acknowledgements


Happy Reading! 📖✨

Top categories

svelte logo

Need a Svelte website built?

Hire a professional Svelte developer today.
Loading Svelte Themes