Javascript & Angular .js for the enterprise, lessons learned, typescript scalable code quality
0 likes2,782 views
javascript angular.js angular using typescript scalable code enterprise quality directives services demo project lessons learned advanced manageable code
1 of 40
Downloaded 28 times
![Single Point of Dependency Wireing
/app
applicationContext.js
Registration
angular.module(‘de.dab.pfm.app’, [‘dashboard’]);
angular.module(‘de.dab.pfm.dashboard’, [‘de.dab.pfm.dashboard.header’]);
angular.module(‘de.dab.pfm.dashboard..header’, [‘de.dab.pfm.dashboard.intro’,
‘pieChart]);
angular.module(‘de.dab.pfm.dashboard.intro’, [‘...’]);
angular.module(‘de.dab.shared.pieChart’, [‘...’]);](https://image.slidesharecdn.com/javascriptangularfortheenterpriselessonslearned-140905083949-phpapp02/85/Javascript-Angular-js-for-the-enterprise-lessons-learned-typescript-scalable-code-quality-37-320.jpg)
Ad
Recommended
Lab 10 gride view
Lab 10 gride viewPhonepaseuth Phonhdala ສອນໂດຍ ອຈ ພອນປະເສີດ ຜົນດາລາ
Phonepaseuth PHONHDALA
Android KOTLIN
ວິທະຍາໄລສອນພິທັກລາວ
gride view
Gwt widget frameworks_presentation
Gwt widget frameworks_presentationDavid Amend This document provides an overview and comparison of different GWT frameworks, including plain GWT, SmartGWT, Ext-GWT/GXT, and Vaadin. It discusses the features and limitations of each framework, including architecture, components, licensing, and support. The presentation compares the frameworks on factors like learning curve, performance, customization capabilities, and integration with other technologies and aims to help attendees decide which framework may be best for their needs and projects.
Reasons to migrate to modern web development with JavaScript
Reasons to migrate to modern web development with JavaScriptDavid Amend The document discusses the transition from traditional server-side Java frameworks to modern JavaScript web development, emphasizing the importance of leveraging innovative web technologies for efficiency and user experience. It highlights challenges associated with server-side frameworks and advocates for a shift toward a modular, client-driven architecture that prioritizes frontend development. The document also outlines practical steps for organizations to adopt these modern technologies, including hiring skilled web developers and simplifying UI choices.
Geecon 2014 - Five Ways to Not Suck at Being a Java Freelancer
Geecon 2014 - Five Ways to Not Suck at Being a Java FreelancerRoberto Cortez The document outlines five key strategies for succeeding as a Java freelancer, emphasizing the importance of experience, reputation building, and financial management. It advises freelancers to diversify their skills and be proactive in marketing themselves. Additionally, it highlights the necessity of managing client relationships and maintaining a balance in workload.
Multi modularized project setup with gulp, typescript and angular.js
Multi modularized project setup with gulp, typescript and angular.jsDavid Amend The document discusses setting up a multi-module build process for an Angular and TypeScript application with Gulp at DAB Bank. It describes challenges with their initial Grunt-based approach and outlines their new Gulp-based solution using a common setup module to define shared build tasks and provide a base configuration. It also covers managing dependencies between files and modules through Angular's module system and TypeScript's module syntax.
Angularjs practical project experiences with javascript development in a bank
Angularjs practical project experiences with javascript development in a bankDavid Amend This document summarizes a presentation about DAB Bank's experience switching to Angular.js for web development. It discusses how Angular.js helped solve problems with AJAX, customization, and legacy code. It provides an overview of how DAB Bank used Angular.js to build a personal finance manager application. Additional slides cover topics like SEO, security, Angular 2.0, TypeScript, and modern tech stacks.
Maven - Taming the Beast
Maven - Taming the BeastRoberto Cortez Roberto Cortez's presentation on Maven addresses its challenges such as slowness, complexity, and common pitfalls faced by developers. Highlighting its history and purpose of standardizing project management, he emphasizes the importance of understanding dependencies and build processes. The session also offers practical tips for improving build speed and resolving common issues encountered when using Maven.
Migration tales from java ee 5 to 7
Migration tales from java ee 5 to 7Roberto Cortez The presentation by Roberto Cortez discusses the migration from Java EE 5 to 7, highlighting major technological developments and challenges faced during the process. It emphasizes that migration is not straightforward and requires careful planning and discipline, particularly in dealing with legacy code and dependencies. The speaker shares insights about the Segurnet platform and the various strategies adopted to ensure a successful transition while mitigating risks associated with outdated technologies.
Angular 2 : learn TypeScript already with Angular 1
Angular 2 : learn TypeScript already with Angular 1David Amend TypeScript can be used to add types to JavaScript for better integration with IDEs and refactoring support. It allows defining interfaces to support modular projects and combining client and server models. Key things to know about TypeScript include interfaces, decorators, module support, and ES6 features. There are many benefits to using TypeScript like refactoring support, code exploration, and self-documentation.
KYSUC - Keep Your Schema Under Control
KYSUC - Keep Your Schema Under ControlCoimbra JUG The document presents a comprehensive approach to database schema management, focusing on maintaining updated ER models, version-controlled scripts, and efficient deployment strategies. It emphasizes the importance of documentation and continuous integration within database management processes, using tools like Jenkins and Flyway for deployment. Best practices are outlined throughout the presentation for successful database development and maintenance.
Just enough app server
Just enough app serverAntonio Goncalves Antonio Goncalves discusses the need for streamlined Java EE application servers that avoid the pitfalls of traditional monolithic architectures. He emphasizes the advantages of customizing app server packaging to fit different application requirements, highlighting solutions like WildFly Swarm and microservices approaches. The presentation also touches on Docker usage and the evolution of Java EE to meet modern development needs.
Componentization css angular
Componentization css angularDavid Amend The document discusses CSS componentization strategies in Angular applications. It covers:
- Angular's emulated view encapsulation and how it adds prefixes like _nghost and _ngcontent to isolate CSS
- Using :host, :host-context and ::ng-deep to style components and apply themes
- Different CSS architectures like OOCSS, BEM and SMACSS that can be used to structure CSS components
- The benefits of separating CSS into standalone, reusable style components vs embedding styles directly in components
- Best practices like defining styles using standalone CSS files and applying view encapsulation: None for performance
Performance monitoring measurement angualrjs single page apps with phantomas
Performance monitoring measurement angualrjs single page apps with phantomasDavid Amend Phantomas is a tool for monitoring web performance and Angular.js applications. It passively monitors performance through a JavaScript virtual machine and Node.js. It generates reports on metrics like requests, assets, DOM complexity, and events in JSON, CSV, TAP, and other formats. It has an easy setup through Grunt and focuses only on frontend performance without network latency.
Story about module management with angular.js
Story about module management with angular.jsDavid Amend The document discusses techniques for managing dependencies in AngularJS applications during a Munich meetup. It compares methods such as script tags and AMD (Asynchronous Module Definition) for handling cross-file dependencies, async loading, and module registration, while also addressing issues like polluting the global namespace and differentiating development from production builds. It concludes with considerations for future Angular versions, including AngularJS 2.0, and the integration of ES6 features.
Thin Server Architecture SPA, 5 years old presentation
Thin Server Architecture SPA, 5 years old presentationDavid Amend The document discusses the future of web technologies with thin-server architectures. It outlines the history of web development from early desktop applications to modern rich internet applications. The thin-server architecture moves more functionality to the client side, making applications more scalable, cacheable, and stateless. Major companies are investing in client-side technologies like Google Web Toolkit, and emerging standards like HTML5 support more intelligent clients.
Grunt Advanced Vol 2, Plugins Text I/O with fun
Grunt Advanced Vol 2, Plugins Text I/O with funDavid Amend Grunt.js is a build tool like Rake, Ant, Maven, and Groovy that uses npm and JSON syntax. It is easy to extend and supports various environments. The document discusses several Grunt plugins for text input/output including grunt-figlet, grunt-cat, grunt-attention, grunt-prompt, and grunt-notify. It also briefly describes the Grunt API and configuration utilities.
Client Vs. Server Rendering
Client Vs. Server RenderingDavid Amend The document discusses the architectural decision between client-side and server-side rendering, noting the advantages and disadvantages of each approach. It covers factors such as performance, user experience, and development flexibility, while emphasizing the importance of understanding the project type when choosing a rendering strategy. Hybrid-rendering solutions are highlighted as a way to balance benefits from both methods, while also considering future trends in technology.
Client vs Server Templating: Speed up initial load for SPA with Angular as an...
Client vs Server Templating: Speed up initial load for SPA with Angular as an...David Amend The document discusses various web-rendering techniques and architectures, comparing client-side and server-side rendering approaches, emphasizing current trends and future technologies. It covers performance optimization strategies, such as lazy loading, asynchronous content loading, and template rendering, while also exploring tools like Angular.js and various JS frameworks. The aim is to enhance user experience while managing complexity in web application development.
Grunt js for the Enterprise Vol.1: Frontend Performance with Phantomas
Grunt js for the Enterprise Vol.1: Frontend Performance with PhantomasDavid Amend The document discusses the use of grunt.js and Phantomas for performance monitoring in enterprise environments. It details the tool's capabilities, including metrics for analyzing frontend performance, custom assertions, and integration with continuous integration systems. Additionally, it notes the tool's strengths, limitations, and setup simplicity.
Grunt.js and Yeoman, Continous Integration
Grunt.js and Yeoman, Continous IntegrationDavid Amend This document provides an overview of Grunt.js, a build tool designed to automate repetitive tasks in web development, improving software quality and delivery time through continuous integration practices. It details Grunt's capabilities, including tasks like file concatenation, linting, minification, and unit testing, alongside its integration with Yeoman for enhanced development workflows. Additionally, the document addresses the evolving skills required for front-end development and the tools that can unify development processes.
More Related Content
Viewers also liked (7)
Multi modularized project setup with gulp, typescript and angular.js
Multi modularized project setup with gulp, typescript and angular.jsDavid Amend The document discusses setting up a multi-module build process for an Angular and TypeScript application with Gulp at DAB Bank. It describes challenges with their initial Grunt-based approach and outlines their new Gulp-based solution using a common setup module to define shared build tasks and provide a base configuration. It also covers managing dependencies between files and modules through Angular's module system and TypeScript's module syntax.
Angularjs practical project experiences with javascript development in a bank
Angularjs practical project experiences with javascript development in a bankDavid Amend This document summarizes a presentation about DAB Bank's experience switching to Angular.js for web development. It discusses how Angular.js helped solve problems with AJAX, customization, and legacy code. It provides an overview of how DAB Bank used Angular.js to build a personal finance manager application. Additional slides cover topics like SEO, security, Angular 2.0, TypeScript, and modern tech stacks.
Maven - Taming the Beast
Maven - Taming the BeastRoberto Cortez Roberto Cortez's presentation on Maven addresses its challenges such as slowness, complexity, and common pitfalls faced by developers. Highlighting its history and purpose of standardizing project management, he emphasizes the importance of understanding dependencies and build processes. The session also offers practical tips for improving build speed and resolving common issues encountered when using Maven.
Migration tales from java ee 5 to 7
Migration tales from java ee 5 to 7Roberto Cortez The presentation by Roberto Cortez discusses the migration from Java EE 5 to 7, highlighting major technological developments and challenges faced during the process. It emphasizes that migration is not straightforward and requires careful planning and discipline, particularly in dealing with legacy code and dependencies. The speaker shares insights about the Segurnet platform and the various strategies adopted to ensure a successful transition while mitigating risks associated with outdated technologies.
Angular 2 : learn TypeScript already with Angular 1
Angular 2 : learn TypeScript already with Angular 1David Amend TypeScript can be used to add types to JavaScript for better integration with IDEs and refactoring support. It allows defining interfaces to support modular projects and combining client and server models. Key things to know about TypeScript include interfaces, decorators, module support, and ES6 features. There are many benefits to using TypeScript like refactoring support, code exploration, and self-documentation.
KYSUC - Keep Your Schema Under Control
KYSUC - Keep Your Schema Under ControlCoimbra JUG The document presents a comprehensive approach to database schema management, focusing on maintaining updated ER models, version-controlled scripts, and efficient deployment strategies. It emphasizes the importance of documentation and continuous integration within database management processes, using tools like Jenkins and Flyway for deployment. Best practices are outlined throughout the presentation for successful database development and maintenance.
Just enough app server
Just enough app serverAntonio Goncalves Antonio Goncalves discusses the need for streamlined Java EE application servers that avoid the pitfalls of traditional monolithic architectures. He emphasizes the advantages of customizing app server packaging to fit different application requirements, highlighting solutions like WildFly Swarm and microservices approaches. The presentation also touches on Docker usage and the evolution of Java EE to meet modern development needs.
More from David Amend (9)
Componentization css angular
Componentization css angularDavid Amend The document discusses CSS componentization strategies in Angular applications. It covers:
- Angular's emulated view encapsulation and how it adds prefixes like _nghost and _ngcontent to isolate CSS
- Using :host, :host-context and ::ng-deep to style components and apply themes
- Different CSS architectures like OOCSS, BEM and SMACSS that can be used to structure CSS components
- The benefits of separating CSS into standalone, reusable style components vs embedding styles directly in components
- Best practices like defining styles using standalone CSS files and applying view encapsulation: None for performance
Performance monitoring measurement angualrjs single page apps with phantomas
Performance monitoring measurement angualrjs single page apps with phantomasDavid Amend Phantomas is a tool for monitoring web performance and Angular.js applications. It passively monitors performance through a JavaScript virtual machine and Node.js. It generates reports on metrics like requests, assets, DOM complexity, and events in JSON, CSV, TAP, and other formats. It has an easy setup through Grunt and focuses only on frontend performance without network latency.
Story about module management with angular.js
Story about module management with angular.jsDavid Amend The document discusses techniques for managing dependencies in AngularJS applications during a Munich meetup. It compares methods such as script tags and AMD (Asynchronous Module Definition) for handling cross-file dependencies, async loading, and module registration, while also addressing issues like polluting the global namespace and differentiating development from production builds. It concludes with considerations for future Angular versions, including AngularJS 2.0, and the integration of ES6 features.
Thin Server Architecture SPA, 5 years old presentation
Thin Server Architecture SPA, 5 years old presentationDavid Amend The document discusses the future of web technologies with thin-server architectures. It outlines the history of web development from early desktop applications to modern rich internet applications. The thin-server architecture moves more functionality to the client side, making applications more scalable, cacheable, and stateless. Major companies are investing in client-side technologies like Google Web Toolkit, and emerging standards like HTML5 support more intelligent clients.
Grunt Advanced Vol 2, Plugins Text I/O with fun
Grunt Advanced Vol 2, Plugins Text I/O with funDavid Amend Grunt.js is a build tool like Rake, Ant, Maven, and Groovy that uses npm and JSON syntax. It is easy to extend and supports various environments. The document discusses several Grunt plugins for text input/output including grunt-figlet, grunt-cat, grunt-attention, grunt-prompt, and grunt-notify. It also briefly describes the Grunt API and configuration utilities.
Client Vs. Server Rendering
Client Vs. Server RenderingDavid Amend The document discusses the architectural decision between client-side and server-side rendering, noting the advantages and disadvantages of each approach. It covers factors such as performance, user experience, and development flexibility, while emphasizing the importance of understanding the project type when choosing a rendering strategy. Hybrid-rendering solutions are highlighted as a way to balance benefits from both methods, while also considering future trends in technology.
Client vs Server Templating: Speed up initial load for SPA with Angular as an...
Client vs Server Templating: Speed up initial load for SPA with Angular as an...David Amend The document discusses various web-rendering techniques and architectures, comparing client-side and server-side rendering approaches, emphasizing current trends and future technologies. It covers performance optimization strategies, such as lazy loading, asynchronous content loading, and template rendering, while also exploring tools like Angular.js and various JS frameworks. The aim is to enhance user experience while managing complexity in web application development.
Grunt js for the Enterprise Vol.1: Frontend Performance with Phantomas
Grunt js for the Enterprise Vol.1: Frontend Performance with PhantomasDavid Amend The document discusses the use of grunt.js and Phantomas for performance monitoring in enterprise environments. It details the tool's capabilities, including metrics for analyzing frontend performance, custom assertions, and integration with continuous integration systems. Additionally, it notes the tool's strengths, limitations, and setup simplicity.
Grunt.js and Yeoman, Continous Integration
Grunt.js and Yeoman, Continous IntegrationDavid Amend This document provides an overview of Grunt.js, a build tool designed to automate repetitive tasks in web development, improving software quality and delivery time through continuous integration practices. It details Grunt's capabilities, including tasks like file concatenation, linting, minification, and unit testing, alongside its integration with Yeoman for enhanced development workflows. Additionally, the document addresses the evolving skills required for front-end development and the tools that can unify development processes.
Ad
Javascript & Angular .js for the enterprise, lessons learned, typescript scalable code quality
- 1. Angular.js: Lessons Learned At DAB-Bank
- 36. /app /applicationContext.js /modules /submodule Module Creation & Referencing Module Retrieval & Chargement Inspired By 1. 2. /submodule-service.js /submodule-directive.js /submodule-controller.js Miško Hevery
- 37. Single Point of Dependency Wireing /app applicationContext.js Registration angular.module(‘de.dab.pfm.app’, [‘dashboard’]); angular.module(‘de.dab.pfm.dashboard’, [‘de.dab.pfm.dashboard.header’]); angular.module(‘de.dab.pfm.dashboard..header’, [‘de.dab.pfm.dashboard.intro’, ‘pieChart]); angular.module(‘de.dab.pfm.dashboard.intro’, [‘...’]); angular.module(‘de.dab.shared.pieChart’, [‘...’]);
- 38. By Module, loose coupled pieChart pie-chart-directive.js angular.module(‘de.dab.shared.pieChart’) .directive(‘de.dab.shared.pieChartService’, ...); pie-chart-service.js angular.module(‘de.dab.shared.pieChart’) .service(‘de.dab.shared.pieChartService’, ...) pie-chart- model.js pie-chart.tpl.html Getter full qualifier?
- 39. Compiling & TypeScript Why TypeScript? ● Compilation Imposed by Google ● Sweet Home Java/.Net-Developer ● Refactoring Made Easy ● Models Management ● Future-Proof Syntax, Angular 2.0, ... Choice of TypeScriptifying
- 40. Personal Finance Management ● https://www.dab-bank.de/Special/Videos/Video-Finanzmanager.xhtml ● https://www.dab-bank.de/Konto-Kredit/DAB-Finanzmanager-Demo/ ● (Team Setup: Scrum) ● Circumstances ● Competitors “ Rund zwei Drittel der Teilnehmer zeigen Interesse an Personal Finance Management und können sich dabei auch eine langfristige Nutzung vorstellen” http://www.ibi.de/1317-aktuelle-studie-personal-finance-management. html