status: busy

XYZ News, Full Stack app

News Api listing with Angular and Express.js

Overview

XYZ News is a full-stack web application that integrates the open-source Hacker News API, providing users with a clean interface to view news articles. The application is built using Angular for the frontend, paired with an Express.js server backend to handle requests efficiently. It features pagination for news categories and external metadata fetching for each listing.

Features

  • Full-stack architecture with Angular (frontend) and Express.js (backend)
  • Pagination for three distinct news categories
  • Optimized requests using a custom Rest/API architecture
  • Lazy loading and modular separation of components for better performance
  • Mobile-friendly design based on the best practices of Hacker News
  • State management with RX.js and caching of HTTP requests
  • Theming with Bootstrap and Material design components
  • Extensive linting and documentation
  • Production-ready code with tests and coverage support

Tech Summary

  • Frontend: Angular 11, TypeScript, Bootstrap, Angular Material, RX.js, SCSS, State Management, Rest/API, x-utils-es
  • Backend: Express.js, RESTful APIs, JavaScript, Linting, Hacker News API Integration, HTML Scraping, Unit Tests

Outcome

The XYZ News app is optimized for scalability and performance. It provides users with a seamless experience for viewing the latest top news articles, categorized and ready for mobile use. The project leverages modern technologies such as Angular, RX.js, and Express.js to deliver a robust full-stack solution with a focus on clean, maintainable code.

Technologies:

angular
express.js
typescript
node.js
x-utils-es
mvc
bootstrap
angular material
eslint
unit/tests
html/scrape
javascript
rx.js
rest/api
hackernews/api

Categories:

FeaturedMVCAngularJavaScript/TypeScriptFront-End

View Demo
View Repo