Humans of Seoul / Formatted RSS Feed

Formatting Humans of Seoul RSS feed to be to practice reading in koreand and be able to read only the korean text and open translation when/if wanted.

Access app on the link:

https://esteves-esta.github.io/humans-of-seoul-feed-format/

---

Index

Table of Contents

• Humans of Seoul / Formatted RSS Feed
  • Index
• Table of Contents
  • Printscreen
  • 📖 Features
    • ✅ Done ✨✨
  • 🧰 Tech Stack
  • 🚀 How to run locally
• Learning sources

---

---

Printscreen

---

📖 Features

✅ Done ✨✨

• Consume RSS Fedd
  • Parse XML to DOM
  • DOM to JSON
• Show 1 post at a time
• Post features
  • Hide translation
  • Toggle translation by paragraph
  • Select word from the korean original
  • Show count of words in total
  • Popover with button opening papago page on word
  • Export X words selected
• Be able to go to previous or next post
• Settings for customization
  • Change font family
  • Change font weight
  • Change background and font color
  • Change word spacing
  • Change paragraph margin
• Show list of posts
• Style / Follow the prototype
• responsive - mobile

---

🧰 Tech Stack

• Vite
• React
• Typescript
• SWR
• Lucide React - icons
• Papaparse - json to csv
• Radix-UI - unstyled components

---

🚀 How to run locally

1. Install packages

   npm i 
   

   or

   yarn i
   

2. Run api proxy

   npm run proxy 
   

   or

   yarn proxy
   

3. Run dev server

   npm run dev 
   

   or

   yarn dev
   

Learning sources

• Parsing and serializing XML
• How to Fetch and Parse RSS Feeds in JavaScript
• Create an RSS Reader with React and JavaScript