AndrewJBateman/angular-datastream-feed

:clipboard: Angular app that uses RxJS asynchronous code to show Reddit search results in HTML

⚡ Angular Datastream Feed

• Angular app that uses RxJS asynchronous code to show Reddit search results in HTML
• Note: to open web links in a new window use: ctrl+click on link

📄 Table of contents

• ⚡ Angular Datastream Feed
  • 📄 Table of contents
  • 📚 General info
  • 📷 Screenshots
  • 📶 Technologies
  • 💾 Setup
  • 💻 Code Examples
  • 🆒 Features
  • 📋 Status & To-Do List
  • 👏 Inspiration
  • 📁 License
  • ✉️ Contact

📚 General info

• Code from Angular Boot Camp tutorial (see Inspiration below) on correct use of RxJS

📷 Screenshots

📶 Technologies

• Angular framework v16
• RxJS v7 Reactive Extensions Library for JavaScript
• reddit API documentation

💾 Setup

• Install dependencies with npm install.
• Run app using ng serve then navigate to http://localhost:4200/.

💻 Code Examples

• reddit-search.component.ts function using RxJS switchmap to combine 2 observable data streams and return a new observable

    this.results = combineLatest([validSubReddit, validSearch]).pipe(
      // This logs the user's intended search
      tap(search => this.logger.log('Search for: ' + search)),
      // take an input observable, return a different observable
      switchMap(([subReddit, search]) =>
        ris.search(subReddit, search).pipe(
          retry(3),
          // Clear previous entries while waiting
          startWith([])
        )
      )
    );

🆒 Features

• RxJS methods reduce unnecessary HTTP data requests

📋 Status & To-Do List

• Status: Working but with strict mode turned off
• To-Do: Correct types and reactivate strict mode.

👏 Inspiration

• Oasis Digital: RxJS, the easy way to write correct Angular applications,

📁 License

• This project is licensed under the terms of the MIT license.

✉️ Contact

• Repo created by ABateman, email: gomezbateman@yahoo.com