Podcaster

This project is a podcast player application built with React, TypeScript, Vite, Tailwind CSS. It follows a feature-based architecture and utilizes GitHub Actions for deployment.

You can enjoy the podcast website here: https://dawalberto.github.io/podcaster

Description

The Podcaster app allows users to discover and listen their favorite podcasts. With a sleek and intuitive interface, users can browse through a wide selection of podcasts.

Technologies & Features

Technologies Used:

• React: A JavaScript library for building user interfaces.
• TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
• Vite: A next-generation front-end tooling ecosystem for modern web development.
• Tailwind CSS: A utility-first CSS framework for building custom designs quickly.
• Zustand: A simple and fast state management solution for React applications.
• GitHub Actions: Automate workflows and deploy your application with CI/CD directly from your GitHub repository.

Key Features:

• Feature-based Architecture: Organize code into feature modules for better maintainability and scalability.
• Filter podcast: Filter podcast by searching by author or title.
• Loading indicator: Indicates at all times whether the user is browsing or loading data.
• Responsive Design: Ensure optimal viewing experience across a range of devices and screen sizes.

Testing

Unit and Integration Tests

This project includes unit and integration tests written with Jest. To run the tests, use the following command:

npm run test

End-to-End (E2E) Tests

End-to-end tests are implemented with Cypress. To execute the E2E tests, use the following command:

npm run cy:open

or

npx cypress run

Getting Started

To get started with the Podcaster app, follow these steps:

1. git clone https://github.com/dawalberto/podcaster.git
2. cd podcaster
3. npm install
4. npm run dev

Notes about CORS in production

The iTunes RSS/lookup endpoints don't reliably include CORS headers for browser requests. For that reason the app fetches data through api.allorigins.win (public CORS proxy) so it works both locally and when deployed (e.g. GitHub Pages).