https://github.com/candidj/blend-api
Blend API is an Angular Monorepo. It blends in real-time data for weather forecast, quotes and hacker news with a touch of inspiration.
https://github.com/candidj/blend-api
angular angular-calculator angular-hacker-news-app angular-quotes-app angular-signals angular-weather-app angular17 bulma-css hacker-news-clone javascript ng-weather-app typescript weather-open-api
Last synced: 6 months ago
JSON representation
Blend API is an Angular Monorepo. It blends in real-time data for weather forecast, quotes and hacker news with a touch of inspiration.
- Host: GitHub
- URL: https://github.com/candidj/blend-api
- Owner: candidJ
- Created: 2020-04-06T08:09:36.000Z (almost 6 years ago)
- Default Branch: main
- Last Pushed: 2024-05-07T22:23:01.000Z (over 1 year ago)
- Last Synced: 2025-06-06T06:04:35.497Z (8 months ago)
- Topics: angular, angular-calculator, angular-hacker-news-app, angular-quotes-app, angular-signals, angular-weather-app, angular17, bulma-css, hacker-news-clone, javascript, ng-weather-app, typescript, weather-open-api
- Language: TypeScript
- Homepage: https://blend-api.netlify.app/
- Size: 3.32 MB
- Stars: 4
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Blend API :v:
> I've created an Angular monorepo that seamlessly integrates the following web applications:
- Weather App
- Hacker News App
- Quotes App
- Calculator App
## Acknowledgments
The web application utilizes open-source APIs. I extend my _gratitude_ to the following contributors: :+1:
- [OpenWeather](https://api.openweathermap.org/data/2.5/forecast) for Weather Forecast :cloud:.
- [Unofficial HackerNews API](https://api.hackerwebapp.com/) for Hacker News :newspaper:.
- [Quote Garden](https://quote-garden.onrender.com/api/v3/quotes/) for Life Quotes :pencil:.
### Motivation
- I created this side project during the COVID-19 pandemic to showcase and improve my web development and programming skills. It began as an 'Angular' Single Page Application (SPA) and later evolved into a monorepo, as most of my prior work had been for private clients.
- Since embarking on my journey as a web developer, I hadn't pursued any hobby or side projects. This endeavor is my way of making up for lost time, where I aim to consolidate all the potential projects I could have undertaken into a single application.
My primary focus during development has always been on crafting code that is **modular**, **reusable**, and **robust**. I recognize that there is always room for improvement, and I welcome your feedback and code reviews.
### Technologies and Tools Utilized
- JS Framework:
- [Angular 17+](https://angular.io/docs):muscle:
- CSS libraries:
- [Bulma](https://bulma.io/)
- Icons:
- [FeatherIcons](https://feathericons.com/)
- [WeatherIcons](https://erikflowers.github.io/weather-icons/)
### [BlendApi Graph Overview](./apps/BlendApiApp/src/assets/images/project-graph.png)
## Project Milestones
- [x] Version 1.0
- Weather Forecast :white_check_mark:
- Quotes :white_check_mark:
- Hacker News Clone :white_check_mark:
- Custom Pagination :white_check_mark:
- Custom Notification :white_check_mark:
- [-] Version 2.0
- [x] Calculator :white_check_mark:
- High Level UML
## Local Setup with Nx
1. Install [Node](https://nodejs.org/en/) LTS version.
- Open a terminal and type `node -v` to check if Node is installed.
2. Install [Angular CLI](https://angular.io/guide/setup-local) using `npm install -g @angular/cli`.
3. Download or clone this monorepo.
4. Navigate to the project root directory.
5. Run `nx install` to install all project dependencies and generate the Nx workspace configuration.
6. To start the app, run `nx serve` from the project root directory. The app will open at `http://localhost:4200/`.