Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mofirojean/angular
This repository contains 10 projects built with angular so as to explore all the capabilities bad functionalities of the angular framework
https://github.com/mofirojean/angular
Last synced: 20 days ago
JSON representation
This repository contains 10 projects built with angular so as to explore all the capabilities bad functionalities of the angular framework
- Host: GitHub
- URL: https://github.com/mofirojean/angular
- Owner: mofirojean
- Created: 2024-07-27T09:40:20.000Z (4 months ago)
- Default Branch: master
- Last Pushed: 2024-09-16T19:55:09.000Z (2 months ago)
- Last Synced: 2024-09-17T01:13:08.073Z (2 months ago)
- Language: TypeScript
- Size: 2.05 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Angular Projects
1. ## Building an SPA Application with Scully and Angular Router
In this project, we will build a personal blog using the Angular framework and enhance it with Jamstack characteristics using the Scully site generator. Initially, we will scaffold a new Angular application and enable it for routing. We will then create the basic layout of our application by adding some barebones components. As soon as we have a working Angular application, we will add blog support to it using Scully. We will then create some blog posts using Markdown files and display them on the home page of our application.
2. ## Building an SPA Application with Scully and Angular Router
In this project, we will build an Angular application for managing and tracking issues using reactive forms and Clarity. Initially, we will display a list of issues in a table that we can sort and filter. We will then create a form for allowing users to report new issues. Finally, we will create a modal dialog for resolving an issue. We will also go the extra mile and turn on suggestions when reporting an issue to help users avoid duplicate entries.
3. ## Building a PWA Weather Application Using Angular Service Worker
We can access a web application using different types of devices, such as a desktop, mobile, or tablet, and over various types of network, such as broadband, Wi-Fi, and cellular. A web application should work seamlessly and provide the same user experience independently of the device and the network of the user.
Progressive Web Apps (PWAs) are applications built with a collection of techniques with the previous considerations in mind. One popular technique is the service worker, which improves the loading time of a web application. In this chapter, we will use the service worker implemen- tation of the Angular framework to build a PWA that displays the weather of a city using the OpenWeather API.
- Setting up the OpenWeather API
- Displaying weather data
- Enabling offline mode with the service worker
- Staying up to date with in-app notifications
- Deploying our app with Firebase Hosting4. ## Building a WYSIWYG Editor for the Desktop Using Electron
In this project, we will build a desktop WYSIWYG editor that keeps its content local to the filesystem. Initially, we will build it as an Angular application using ngx-wig, a popular WYSIWYGAngular library. We will then convert it to a desktop application using Electron and learn how to synchronize content between Angular and Electron. We will also see how to persist the content of the editor into the filesystem. Finally, we will package our application as a single executable file that can be run in a desktop environment.
5. ## Building a Mobile Photo Geotagging Application Using Capacitor and 3D Maps
In this project, we will build a mobile application that can take photos according to the current location and preview them on a map. Initially, we will learn how to create a mobile application using Angular and Ionic. We will then use Capacitor to take photos using the camera of the mobile device and tag them with the current location via GPS. We will upload those photos to Firebase along with their location data. Finally, we will use CesiumJS to load location data on a 3D globe along with a preview of the photo.