Welcome to the Angular user client for my MORE MOVIE METADATA API. This fully responsive single page application will provide you graphically appealing with access to information about different movies, directors, and genres stored on a MongoDB database. The design is following the Material Design Guidelines from Google. It's possible to sign up to create a unique list of favorite movies.
- TypeScript, HTML, SCSS
- Angular
- light and dark mode using Angular's color palettes
- template and reactive forms with comprehensive validation
- RxJS
- Allows new users to register (username, password, email, birthday)
- Log in with a username and password
- Returns a list of all movies (each listed item with an image, title, genres, directors, actors and description)
- Sorting and filtering
- Ability to select a movie for more details
- Returns data (description, genres, directors, actors, image) about a single movie
- Add or remove movie to list of favorites
- Returns data about a genre or director, with a name and description/bio
- Displays example movies
- Update user info (username, password, email, date of birth)
- User deregistration
- Display and alter list of favorite movies
- Allow users to see which actors star in which movies
I'm using npm throughout this tutorial, you can of course use another package manager.
-
Node.js
npm install node@lts
Run ng serve
or npm start
for a dev server. Navigate to http://localhost:8080/
. The app will automatically reload if you change any of the source files.
Run npm run build
to build the project. The build artifacts will be stored in the dist/
directory. The base-href is set to https://hannesdonel.github.io/MMM-client-Angular/.
A detailed documentation of the codebase is located in /docs directory.