Skip to content

Explore my movie app crafted with Angular, offering a user-friendly interface for effortless discovery and exploration of your favorite films.

Notifications You must be signed in to change notification settings

JacobCoch/myFLix-Angular-client

Repository files navigation

myFlix Angular App Readme

🎬 Welcome to the documentation for the myFlix Angular app! This application is designed to provide users with an engaging movie experience, allowing them to explore information about movies, directors, and genres. The app is built using Angular.

Deployed App

Table of Contents

Objective 🚀

The main goal of this project is to build the client-side interface for the myFlix application using Angular. This involves creating a single-page, responsive movie app that communicates with the existing server-side codebase from myFlix-API The app will feature various interface views that interact with the server's REST API endpoints to display movies, directors, and genres. Through this endeavor, I am excited to learn TypeScript and Angular, aiming to elevate my development skills to new heights.

Context 🌍

Explore the myFlix Angular app, a tangible showcase of my journey in modern web development. With Angular as my tool and myFlix-API as the foundation, I crafted a responsive, single-page movie app that seamlessly interfaces with server-side functionalities. This undertaking has been an intensive learning experience, enabling me to master TypeScript's intricacies and harness Angular's dynamic potential. By steering the client-side of myFlix, I've honed my development, documentation, and project planning skills—reflecting my commitment to growth in a rapidly evolving field. 🚀

Design Criteria 🎨

In developing the myFlix Angular app, I employed Angular Material to enhance its design and user experience. By utilizing Angular Material's pre-built components, I seamlessly integrated a modern visual style into the app, ensuring a polished and intuitive interface for users.

Key Features 🎥🔑

The myFlix Angular app offers an array of captivating features that enhance the user experience:

  • The app opens with an inviting view, presenting users with convenient login and registration options.
  • After successful authentication, users are treated to a comprehensive overview showcasing all available movies, providing a centralized hub for exploring an extensive array of cinematic content.
  • Each movie is accompanied by essential details such as its genre, director, and synopsis. Additionally, users can interact with a "like" button to add the movie to a list of favorites in the profile view.
  • Within the profile view, you have the flexibility to modify your user information, remove movies from your favorites list, and ultimately opt to delete your account. This comprehensive functionality empowers you with control over your user experience and preferences.

Technologies Used 🛠️

In the development of the myFlix Angular app, the following technologies and methodologies were embraced:

  • Angular (version 9+): Leveraged to build the app's dynamic and responsive user interface.
  • Node.js and npm: Utilized to ensure a modern development environment and package management.
  • Angular Material: Employed for designing and styling the app, creating a visually coherent experience.
  • TypeScript: Utilized to enhance codebase readability, maintainability, and to leverage advanced Angular features.
  • Typedoc and JSDoc: Implemented for comprehensive code and technical documentation, enhancing collaboration.
  • GitHub Pages: Chosen for hosting the project, ensuring widespread availability and accessibility.

Technologies and Methodologies Learned 📚

Through the development of the myFlix Angular app, I gained hands-on experience with various technologies and methodologies integral to modern web development:

  • Interpolation and Data-Binding: Leveraged to dynamically display movie details and enable user interactions in the app's interface.
  • Directives: Utilized to manipulate the DOM and control the behavior of app components.
  • Components and Templates: Employed to structure and create reusable UI elements, enhancing the app's modularity.
  • TypeScript and Types: Immersed in TypeScript's power, I learned about how to enforce variable types, enhancing code reliability and minimizing errors.

Thank you for embarking on this exciting journey of building the myFlix Angular app! If you have any questions or need assistance, don't hesitate to reach out. Happy coding! 🚀

About

Explore my movie app crafted with Angular, offering a user-friendly interface for effortless discovery and exploration of your favorite films.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published