MyFlixAngularClient

Description

This project contains the front-end part of the R3play back-end (here) for displaying the information about movies written with Angular. This project was generated with Angular CLI version 16.2.6.

Technologies Used

• Javascript/Angular
• Material Design
• Typescript
• HTML
• CSS

Project Dependencies

• Angular v16 as a frontend framework
• Material Design for design
• Typescript for static data typing
• TypeDoc for Documentation
• Github pages for deployment
• please see other project dependencies in the package.json file

Views & Features:

Welcome view

• Allows users to log in with a username and password
• Uses user-friendly modal windows to show information
• Allows new users to register (username, password, email, date of birth)

Main view

• Returns ALL movies
• Ability to click on buttons to see more information about the movie's director, description, release year, rating, actors
• Ability to log out
• Ability to navigate to the Profile view
• Ability to add a movie to favorites/delete a movie from favorites

Profile view

• Displays user registration details
• Allows users to update their info (username, password, email, date of birth)
• Allows existing users to deregister

Project Screenshot

Project In Use Preview

Please click on the video below to watch it

Live Version

The App is live here

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Clone and Preview. Development server

To clone the app use the following command: console git clone git@github.com:yevheniiairapetian/myFlixAngular-client.git Or download directly by clicking on <> Code button > Download ZIP.

• Navigate to the myFlix-Angular-client folder with the cd myFlix-Angular-client in the terminal. This project requires the latest nvm and node versions.
• Download the node .exe file from the official website and run it (you may need to first delete the old version and then install the new one).
• Use the npm install -g @angular/cli command to istall Angular globally.
• Use the nvm install latest command to install the latest version of nvm.
• Install the required dependencies using the npm install command.
• Run ng serve or ng serve --open for a dev server. Navigate to http://localhost:4200/. The application will automatically reload if you change any of the source files.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

Contact:

Feel free to contact me via LinkedIn or
email or via the contact information on the website