https://github.com/car2t/angular19-gifs-searcher-demo
Angular 19 application to search gifs
https://github.com/car2t/angular19-gifs-searcher-demo
angular19 signals tailwindcss typescript zoneless
Last synced: 5 months ago
JSON representation
Angular 19 application to search gifs
- Host: GitHub
- URL: https://github.com/car2t/angular19-gifs-searcher-demo
- Owner: car2t
- Created: 2025-03-23T20:37:10.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-03-23T20:53:38.000Z (7 months ago)
- Last Synced: 2025-03-23T21:31:55.965Z (7 months ago)
- Topics: angular19, signals, tailwindcss, typescript, zoneless
- Homepage: https://ct-ng19-gifs-searcher.netlify.app/
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Angular Gifs Searcher Demo App
Angular 19 application to search gifs.
Final project of section 8 of **Dev/Talles' course: Angular 2025**.
## Use Notes:
- **PLEASEEEEEE be careful with the scroll in the Trending Page because I am only allowed 100 requests / 1 h. ;D**
Just scroll a bit and you will see how infinite scroll works. The scroll is persistent.
- You can use search input to find gifs. Those queries will be storage in _LocalStorage_ and it will appear in the sidebar.
So you could take a look again those gifs just clicking those queries in the sidebar list.
- Other principal app's feature is click on _Trending_ button to check most popular gifs.
## Concepts covered:
- Angular CLI
- Component properties
- TailwindCSS
- Signals
- LazyLoad
- Separation of routes
- Daughter routes
- Angular environment variables
- Inputs
- Communication between components
- Nested RouterOutlets
- Dynamic route handling
- LocalStorage handling
- Observables to Signals
- Component reuse
- HTTP requests
- Cache handling
- Information mapping
- Preserve scroll state
- Make scroll infinite
- Masonry design with TailwindCSS
- Debugging techniques and tools