Introduction
As movie streaming services become more popular and numerous, and new releases are only being delivered to certain ones, users are finding it difficult to choose which ones they want to subscribe to. Thus, the company is proposing a web app to help them monitor the availability of movies and shows on these services. The Angular framework, using TypeScript and the redux design pattern, are proposed as probable choices for the development of the application’s front-end. This report will provide an overview of these elements and evaluate their suitability for the project.
Angular as a Solution
Applications can be developed and tested for any issues quickly with Angular. It is a popular framework with a large and active community (Angular, 2021; Community, 2021). Therefore, developers can obtain ready-made components and templates, then adapt them to the application’s required specifications with relative ease, reducing the need for original development. The same popularity and active support from the framework’s maintainers guarantee reliable support for the application’s development and maintenance in the foreseeable future.
Angular was created with mobile interfaces in mind first, but it can be scaled to desktop web applications. Thus, an app created with Angular will natively have the look and feel mobile users will find familiar and easy to learn and use (Features, 2021). Furthermore, the framework allows code created for a web app to be reused in a mobile version, reducing the need for maintaining a separate code base for the two platforms.
Angular allows different parts of applications to be created as separate components, which can be reused and rearranged as necessary. Furthermore, each component can be encapsulated, which means other components cannot interfere with their function unless explicitly programmed to do so (What is Angular? 2021). This allows the application’s development tasks to be distributed among as many developers as necessary, each working on his or her components and easily collaborating where necessary.
TypeScript
TypeScript is a programming language that can be seen as an extension of JavaScript. Although JavaScript is a typed language, meaning that objects and variables in it always belong to a certain type, which determines how they can interact with one another. TypeScript extends this feature to include static typing and interfaces, which makes it a fully-fledged object-oriented programming language (TypeScript, 2021). However, the syntax for TypeScript is the same as for JavaScript, which means existing JavaScript code can be converted to TypeScript (TypeScript for JavaScript programmers, 2021).
Furthermore, the concepts introduced by TypeScript are generally familiar to programmers, and the result of TypeScript compilation is JavaScript code (Freeman, 2019, p. 35). Thus, experienced JavaScript developers can be familiar with the implementation of these features in JavaScript; TypeScript allows them to be used more conveniently and consistently that is less prone to bugs. Therefore, even though the developers do not have experience working with TypeScript specifically, they should be able to transition from JavaScript with relative ease.
The set of features TypeScript introduces over JavaScript makes it more suitable for the development of large-scale enterprise-level applications. JavaScript was originally intended for small applications, and it lacks the features that would facilitate the development of the proposed application. TypeScript amends this shortcoming; features such as strict typing and encapsulation make it a more reliable tool for collaboration between multiple programmers. Furthermore, as a compiled language, TypeScript offers better control and debugging features (Freeman, 2019, p. 128; Nowak, 2020).
As strict typing practices can be utilized with TypeScript, utilizing this language can help prevent difficult-to-fix unpredictable behaviors caused by unexpected interactions between different types, which become more common as more programmers become involved in development.
Application State Management & Redux
Application state refers to the variables necessary for the application’s functionality. Application state management is a means to preserve, access, and change an application’s characteristics and variables, including between sessions. For instance, a user’s preferences, such as which subscriptions he or she owns, or his or her choice of the application’s visual theme, are all parts of the application’s state. More globally, variables determining whether a user is logged in, the user’s location within the application, or the filters he or she has selected while browsing the movie library are also parts of the application state.
Well-designed application state management is a necessity for multi-step tasks, such as setting up a user’s streaming service subscriptions or watch lists (Application state management, 2021). Bugs caused by poor application state management can be challenging to identify and fix (Core concepts, 2021). Thus, managing the state is a critical part of any sufficiently large and advanced application as any one of the components mentioned above failing can lead to a worse user experience or, in extreme cases, security breaches.
Redux is a design pattern used for application state management, as well as a JavaScript module implementing this pattern. The principle behind the pattern is encapsulating all of the application write logic in a single function (Structuring reducers, 2021). This function is then given an object describing the desired change and returns an object representing the updated state without making any changes (Core concepts, 2021; Prerequisite reducer concepts, 2021).
Finally, the application state is held in a single store, which allows it to be accessed, updated, and handles listeners, which are other parts of the application that should respond to state changes (Redux fundamentals, part 4: Store). As different components of the application, often designed by different developers, can all rely on the application’s state or make changes to it, ensuring state change calls are standardized across components and do not interfere with one another or the state in an unexpected way is crucial. The approach offered by Redux enforces such a standard, making it less likely that bugs caused by poor collaboration between developers are introduced to the app.
Cross-Platform Options
As mentioned above, Angular is a cross-platform framework by design. It is well-suited to both the initial design’s web implementation and future mobile version of the application. Although unique interfaces will need to be developed for both versions, the majority of the app’s front-end code will be able to be reused between them. Angular supports easy code separation to ensure that shared code and code specific to the web, Android, and iOS versions do not interfere with one another (Witalec, 2018). If necessary, frameworks such as NativeScript are available to facilitate the creation of a shared codebase (Angular for NativeScript, 2021).
Therefore, a mobile version can be rolled out shortly after the initial web deployment. Moreover, the ability to reuse code between versions will facilitate maintaining them both, as only small portions will need to be unique to each. Furthermore, developing future updates will likely only necessitate significant additions to the shared portion of the code, with limited or no changes in version-specific ones.
Conclusion
Overall, Angular’s features align well with the application’s target specifications. This framework can be used to quickly deploy a prototype and maintain and develop future features of the application. Along with TypeScript and Redux, it facilitates development by a large group of programmers while allowing development responsibilities to be distributed between individual developers. In the future, this choice of technologies will allow additional mobile versions of the app to be produced quickly through the reuse of a common codebase.
Reference List
Angular (2021). Web.
Angular for NativeScript (2021). Web.
Application state management (2021). Web.
Community (2021). Web.
Core Concepts (2021). Web.
Features (2021). Web.
Freeman, A. (2019) Essential TypeScript: from beginner to pro. London: Apress.
Nowak, M. (2020) Exploring TypeScript from a business and software development perspective. Web.
Prerequisite reducer concepts (2021). Web.
Redux fundamentals, part 4: Store (2021). Web.
Structuring reducers (2021). Web.
TypeScript (2021). Web.
TypeScript for JavaScript programmers (2021). Web.
What is Angular (2021). Web.
Witalec, S. (2018) Apps that work natively on the web and mobile. Web.