Japp
TuRock, a site for Rock lovers

TuRock, a site for Rock lovers

TuRock is a site that shows a list of Rock bands.

TuRock is an SPA project built with the Angular framework and generated with Angular CLI version 12.0.2. This project is used for learning and to showcase skills. Feel free to clone it.

TuRock screenshot

Options and components:

The app shows eight rock bands exported from grupos.service.ts, which holds an array of band objects with the properties: name, bio, img, appearance, video, wiki and idx.

  • Navbar: the app's main header, navigation menu and user data.
  • Footer: copyright notice and a button to add a new band.
  • Group card: presentation card for each band.
  • Header: generic header used across pages.
  • Share: buttons to share content.
  • Slider: image carousel for the band.

Pages:

Pages tie together the reusable components and the app’s logic.

  • Group: shows a single band.
  • Groups: shows all bands.
  • Home: the app's main landing page.
  • Search: shows search results.
  • Form: form to register a new band.

Custom pipe:

TuRock includes a custom pipe to validate URLs.

Other details:

  • Uses a reactive form with validation logic already built in.
  • The CRUD part isn't fully implemented.
  • To add a new band, use the + button in the bottom-right corner.
  • On a band's page, the article footer has options to delete and edit it.
  • Built to adapt to mobile and tablet devices.
Visitar repositorio
Cargando…

Leave without saving?

You have unsaved changes in this form. If you leave now, they'll be lost.

esen