Key takeaways
|
Tech trends are always changing, and with that, consumer expectations evolve as well. In the past year alone, the technology landscape has shifted immensely. As such, business leaders are faced with the challenge of either adapting to the new consumer expectations or falling behind. This is especially true in mobile. To meet both consumer demand and expectations, companies must develop for both mobile and web. Unfortunately for many, there are no easy ways to go about doing so. Developing for both platforms is complex, but with the right tools and framework, the process is a little easier.
The Need to Go Cross Platform
In today’s competitive climate, businesses are now more than ever focused on application development in an effort to propel their organizations into the digital age. According to survey data from Progress, half of the respondents plan to invest in building applications that support the customer engagement model in the next 12 months, and nearly half (47 percent) plan to invest in mobile methods to support operational improvement efforts, customer engagement initiatives and process improvements for agility with website, mobile and social platforms.
However, developing native applications in different languages across Android, Windows, iOS and web is expensive and very time consuming. Plus, the current hybrid approaches usually fail to deliver the same performance that native apps enable while consumers’ expectations around app performance continue to rise.
Companies also have a lot to lose if they choose not to go cross platform, as this practice is becoming a universal standard. Ultimately, it’s in the company’s best interest to go cross-platform because there is a clear increase in the ability to reach more users and if they do not pursue this methodology they will quickly fall behind competitors.
If there was a way to develop in a modern framework that not only excelled when it comes to creating websites, but also allowed for the same code and skills to be reused to create cross-platform apps, would you use it?
How to be More Efficient When Developing
Progress NativeScript is a cross-platform framework and allows for true native apps to be built from a single code base, while still enabling the productivity advantages familiar to hybrid approaches.
Therefore, the developers only need to know one language to get true native performance and functionality across platforms. However, the language can be JavaScript, TypeScript, and in this case, Angular.
Angular 2, the full-platform successor to Google’s Angular 1 web application framework, is based on newer JavaScript standards, bringing a better, faster, more powerful framework to developers across the globe. Angular 2 has been developed and optimized for productivity and performance. It tends to work best in non-trivial applications – apps that have 10 or more views, or deal with a significant amount of data. But when used properly the framework allows for the deployment of the fastest, smallest applications across web and mobile environments.
NativeScript does not require Angular, but it’s more effective when used in tandem. In doing so you can fully reuse skills and code from the web to build beautiful, high performance native mobile apps without web views. One of Angular 2’s biggest architectural changes was decoupling the Angular framework form the DOM. While Angular 1 was limited to browser-based environments, Angular 2 opened the door for a number of different rendering possibilities, including NativeScript.
Together, the collaboration between NativeScript and Angular was created to provide an answer to the question above. Here are some tips to get the most out of Angular 2 and NativeScript:
Standardize on Angular 2 to Simplify – It’s One Less Thing to Learn.
When tasked with supporting multiple languages, it’s easy to understand the complexities involved, both in development and recruitment. Standardizing on Angular 2 allows for a consistent technical architecture to let developers solve common issues in standard ways, enabling employees be more efficient. There are plenty of Angular developers in the world, so it’s also easy to find talent when needed.
NativeScript supports Angular 2 and allows for true native performance on mobile applications – without having to learn multiple native languages. By using native components, the framework offers a native look, which give users the experience they both expect and demand.
When it comes to developing, think of how much work you’d have to do to build simple Android and iOS apps using traditional native development approaches. In the case of a button, you’d have to take multiple steps across Android and iOS to accomplish what you need to. But with NativeScript and Angular 2, you can build that same button in a few lines of code; write the code in JavaScript/TypeScript; place the button in an Angular 2 component; style that button with CSS; install JavaScript modules to help you out from npm; and at the end of the day, there is only one code base to maintain.
Using Angular 2 in NativeScript also opens up another possibility: the ability to share code between web and native apps. NativeScript code is just JavaScript, so long as that code isn’t tied to the DOM, there’s no reason that code can’t run in NativeScript.
Keep Your Code Modular
If you keep your user interface code separate from your business logic, you have the ability to share large amounts of functionality across multiple platforms. For example, consider the common scenario of registering a new user in your application. This functionality usually involves sending data to a backend service through an HTTP call, and receiving a token in response. There is nothing about this code that is specific to an individual mobile platform, yet with traditional development approaches you’d have to write this code three times—once in Swift or Objective-C for iOS, once in Java for Android, and once in JavaScript or TypeScript for the web. With NativeScript and Angular 2 you have the ability to write a single Angular service that runs on all three platforms.
Not all code can be shared this way, and you will have to code the user interface twice—once for native iOS and Android, and once for the web. But if make an effort to keep your code modular, and keep code that doesn’t involve the interface in separate files, you have the potential to save a considerable amount of development time when writing apps that target multiple platforms.
Learn to Love TypeScript
Microsoft’s TypeScript is a superset of JavaScript that adds a number of new features, such as optional types. TypeScript offers benefits of particular interest to developers coming from Strongly Typed, or Object Oriented backgrounds. Some developers can find it to be intimidating, but NativeScript and Angular 2 are both written in TypeScript, and both teams recommend learning and using TypeScript in your own applications.
NativeScript is built with TypeScript, meaning there is a 100 percent integration with all NativeScript APIs and even all native APIs. NativeScript also means native apps, and native apps don’t handle code errors as well as a browser does. TypeScript provides developers with an extra level of confidence as they develop NativeScript apps by catching errors and possible type mismatches at build time that could otherwise result in app crashes down the road.
When combined with Visual Studio Code, TypeScript provides powerful refactoring capabilities. For example, you can change the method/property signature in seconds without the worry that the old name will stay somewhere in the project. Plus, TypeScript is also easily automatically configured. NativeScript CLI configures .tsconfig files and transpiles .ts files without any extra build configuration required. Simply build the project and Nativscript will handle the rest. Lastly, TypeScript has superb module support. Use the CommonJS modules or the ES6 module spec because it all works cohesively with TypeScript and NativeScript.
While familiarizing and learning the base, if you aren’t sure what a certain block of TypeScript code does, you can paste the code right in the box on the left hand side of the TypeScript Playground, and the corresponding JavaScript will be generated in the right hand box.
Embrace Each Platform
Your application does not have to look the same across iOS, Android and the web, and in fact, it shouldn’t. Each platform has its own unique paradigms that you can use to create the best possible experience for users. iOS users expect to be able to swipe and go back; Android users expect to be able to use the hardware back button, and web users expect to be able to use the URL bar and share links. NativeScript and Angular 2 allow you to cater to each of these scenarios by sharing code where it makes sense and customizing interfaces to your user’s needs when appropriate.
Open-Source That’s Easy to Trust
Angular 2 and NativeScript are both open-source frameworks, so the platforms are able to rapidly adapt and are supported by a wide community of over one million developers. Although some may feel that it is risky to embrace open-source because of stability issues, the collaboration between Angular 2 and NativeScript was designed to address this concern and put it to rest.
The Angular framework is also backed and promoted by Google, ensuring that there will be consistent support and a long life. In addition to the global developer community, there is also a more formal support team dedicated to long term innovation and success.
Moving Forward
The collaboration between Angular 2 and NativeScript is significant as it allows you to write once and deploy across multiple platforms. Developing across multiple platforms used to be avoided by developers, but by utilizing both Angular 2 and NativeScript, you can save both time and cost. As technology progresses and improves, the enterprise will always have to meet the needs and demands of the consumer, but when two frameworks are able to work seamlessly together for the foreseeable future, the lives of developers become significantly easier.
About the Author
TJ VanToll is a tech author, speaker, and a Principal Developer Advocate for Progress where he specializes in performance and mobile web. TJ has over a decade of web development experience, including a few years working on the jQuery team. Nowadays, TJ spends his time helping web developers build mobile apps through projects like NativeScript.
