Decoupled Drupal with Angular
|
|
- Neal Montgomery
- 5 years ago
- Views:
Transcription
1 Decoupled Drupal with Angular
2 Agenda Introduction Short intro on Drupal What is decoupled and choosing the right architecture Introduction to Angular Setting up Angular development environment Demo Application Showcase Angular & Drupal application Advanced usage of Angular Q&A
3 Introduction Adrian Pintilie 37 years old From Bacău, România General Softescu Drupal Developer for 10 years
4 Introduction Ionuț Stan 33 years old From Bacău, România Director of Softescu Drupal Developer for 9 years Acquia Certified Drupal Developer
5 Softescu Software and Design Agency established in 2008 in Bacău, România. Drupal Community sponsor since Providing services for portals and enterprise business applications with Drupal, Magento, Angular and Xamarin.
6 Short intro on Drupal
7 Drupal What is Drupal? Drupal is the #1 platform for web content management among global enterprises, governments, higher education institutions, and NGOs. Drupal is an Open Source Content Management System written in PHP. Drupal started to be used for blogs and presentations sites but now is also used for Enterprise Business Applications. Appeared in early 2000 (Dries Buytaert) Large community of developers and enthusiasts Drupal Association ( Drupal 8 (the latest major release)
8 How to tell if Drupal is the right choice for me? Is it suitable for my needs? How can I use it and how difficult it is to use it? What skills do I need to be in full control of it? Can I extend/adapt it if it s needed?
9 Extending Drupal
10 Monolithic vs. Decoupled Monolithic Decoupled
11 Choosing the right architecture
12 Advantages of a decoupled architecture Modern UI interfaces Modern UI components Extremely fast web interfaces (eg. Facebook)
13
14 API First Web services by default Drupal based API First distributions: Contenta and Acquia Reservoir Others: Contently etc.
15 Coupled Layout and Display management without a developer s help Contextual links and in-place editing Content workflow and preview Unified administrative menu (toolbar) Contributed modules Accessible markup that can be interpreted by screen readers Caching and performance System notifications
16 Coupled Drupal Data layer Use Drupal with its template system(twig) and additional jquery and AJAX functionality. Presentation layer
17 Progressively Decoupled Drupal Data layer Use Drupal to render the initial state and rely on a JavaScript framework for further processing on the client side and from time to time on the server Presentation layer
18 Fully Decoupled Drupal Data layer Use Drupal only to expose DATA and a JavaScript framework for interface Presentation layer
19 How can we Decouple Drupal? Content Management & Data Repository is inside Drupal Frontend interface is done in any other system JavaScript (Angular, React, etc) Mobile Applications Desktop Applications Etc. Communication is done via RESTFUL services
20 How can we Decouple Drupal? RESTful Web Services Core module Builds on top of Drupal 8's Serialization module to provide a customizable, extensible RESTful API of data managed by Drupal Allows interactions with any content entity (nodes, users, comments) or config entity (vocabularies, user roles)
21 Angular, React, Ember, VUE.js UIs? All based on TypeScript Backed by different organisations, groups, communities Angular is supported by Google (financially, organisation, etc) React was the first javascript frontend
22 Getting started Read the REST documentation practical Expose data as a REST Resource Grant necessary permissions (if any) Configure REST Resource s formats (JSON, XML, HAL+JSON, CSV, etc.) Configure REST Resource s authentication protocols (cookie, Basic Authentication, Oauth, etc.) Decide what requests (HTTP Verbs) you want to implement: GET, HEAD, POST, DELETE, TRACE, OPTIONS, CONNECT and PATCH Some of these methods are safe and some are non safe.
23 HTTP Requests (HTTP verbs) Safe methods are considered the ones that can be used only for reading data: HEAD GET OPTIONS TRACE Non-safe methods are considered the ones that can be used to write data: POST DELETE CONNECT PATCH Drupal 8 requires a X-CSRF-Token request header to be sent when using a non-safe method. So, when performing non-read-only requests, we need to obtain a token from: /session/token
24 HTTP Requests (HTTP verbs) Formatting the request Each REST requests, must tell Drupal about the serialization format that is used Specify the?_format query argument e.g. When sending a request body containing data in that format, we need to specify the Content-Type request header. This is the case for POST and PATCH.
25 Introduction to Angular
26 Is it AngularJS or Angular? AngularJS Appeared in 2010 Code production was very fast comparing to other JavaScript Based APIs Two way data binding Directives Supported by Google People started to rewrite existing applications in AngularJS Angular Complete rewrite of the framework Components (independent and loosely coupled as possible) Views (refers to a template which is managed by at least a controller) The application is now a component which contains a set of components(routable)
27 Angular components Components are a way of organizing User Interface code into reusable bits with their own logic and view. AngularJS s directives are Angular s components without a view Components create a user interface. We define a component for every UI element Angular application = Tree of components
28 Setting up the Angular environment Introducing angular-cli
29 angular-cli Node npm JavaScript runtime built on Chrome s V8 JavaScript engine Runs JavaScript without a browser Used to build task runners, compilers, linters and module loaders Cross-platform Installing Node for the official installer for your operating system Package manager for Node Comes with Node Installs dependencies Used for runtime Next step: Install angular-cli and generate a project
30 Installing angular-cli and generating an Angular Project angular-cli can be installed using npm: Open the Terminal (Command Line) Enter npm install -g That s it! Generating an Angular Project Open the Terminal (Command Line) Enter the ng new [project_name] command angular-cli will create a directory and build the project inside it Navigate inside the project folder Enter ng serve command That s it!
31 Project successfully generated
32 TypeScript Language It is not a new language! Superset of ES6 (ECMAScript) -> JavaScript Used in various frameworks: React Angular Express ASP.NET Core React Native Vue.js etc.
33 TypeScript Architecture Types of data Classes Components Modules Increase complexity Based on Model - View - Controller architecture (like Ruby on Rails) PHP Architecture Types of data Classes Functions Libraries Increase complexity Based on Model - View - Controller architecture (like Zend, Symfony)
34 Types TypeScript supports standard types like JavaScript: string, boolean, number, array TypeScript also includes specific types like: enum, any and void TypeScript supports custom types which can be defined by creating a class, an interface or using special files that declare types for an existing library
35 Classes Define a class using the class keyword Classes in TypeScript might have constructors and methods Inheritance using the extends keyword
36 Classes in TypeScript Classes in PHP class Product { color; price; class Product { private color; protected price; constructor(color, price) { this.color = color; this.price = price; } getproductdetails() { return `${this.color}, ${this.price}`; } } class Tshirt extends Product { size; constructor(color, price, size) { super(color, price); this.size = size; } getproductdetails(){ return `${this.color}, ${this.price}, ${this.size}`; } } public function _construct(color, price) { $this->color = color; $this->price = price; } } class Tshirt extends Product { private size; public function construct(color, price, size){ parent::_construct(color, size); $this->size = size; } }
37 Examples for classes and types // strings let name: string = "Ionut"; // boolean let isoffline: boolean = true; // number let height: number = 24; let width: number = 12; // arrays let colors: string[] = ['red', 'green', 'blue']; let colors: Array<string> = ['red', 'green', 'blue']; // value can be any type, init with a number let value: any = 5; // different types can assigned value = false; value = "this value is a string"; // default behavior, value of color will be 2; enum Color {Red, Green, Blue} let color: Color = Color.Blue; interface Model { get(query:string): any[]; } // manual initialize, value of color will be 6; enum Color {Red = 2, Green = 4, Blue = 6} let color: Color = Color.Blue; class Account implements Model { get(query:string):any[] { return []; } } class Model {} class Account extends Model {} class Controller { model:model; constructor(model:model) { this.model = Model; } } new Controller(Account); class Controller { model:model; constructor(model:model) { this.model = Model; } }
38 Managing dependencies with modules export and import keywords are used to share code between modules Avoids javascript limitation in terms of scope for variables and functions between files [file.ts] export function getanumber() { return Math.random(); } export class Client { constructor(name) { this.name = name; } } export const id = 12345; // import only the function from the module import { getanumber } from './file'; // import both the function and the class from the module import { getanumber, Client } from './file; // import the function and bind it to a random variable import { getanumber as random } from './file'; // import everything from the module and // bind it to a usermodule variable import * as UserModule from './file';
39 Components A component is a class that exposes data to the view and implements the logic for user interaction Angular Component = Model + View + Controller Additional definitions in metadata
40 Components angular-cli generated our project earlier creating a component with our application name (that we supplied to the ng new command). That component resides under the src/app/app.component.ts file: [app.component.ts] import { Component } from selector: 'app-root', templateurl: './app.component.html', styleurls: ['./app.component.css'] }) export class AppComponent { title = 'app works!'; } View Model & Controller
41 Component selector [index.html] <html> <head> <!-- other code related to the page head --> </head> <body> <app-root>loading...</app-root> </body> </html>
42 Component template selector: 'app-root', templateurl: './app.component.html' }) selector: 'app-root', template: ` <h1> {{title}} </h1> ` }) [app.component.html] <h1> {{title}} </h1>
43 Embedding styles in component template selector: 'app-root', template: ` <h1> {{title}} </h1> `, styleurls: ['./app.component.css'] }) selector: 'app-root', template: ` <h1> {{title}} </h1> `, styles: [` h1 { color: darkblue } `] })
44 Data bindings in component template [app.component.ts] import { Component, ViewEncapsulation } from selector: 'app-root', encapsulation: ViewEncapsulation.None, template: ` <h1> {{title}} </h1> `, styles: [` h1 { color: darkblue } `] }) export class AppComponent { title = 'app works!'; }
45 Components in Browser HTML output
46 Application bootstrapping in Angular import { platformbrowserdynamic } from '@angular/platform-browser-dynamic'; import { enableprodmode } from '@angular/core'; import { environment } from './environments/environment'; import { AppModule } from './app/'; if (environment.production) { enableprodmode(); } platformbrowserdynamic().bootstrapmodule(appmodule);
47 With this Angular application we will show how to decouple Drupal by interacting with it (managing content) without using the Drupal interface.
48 Configuring Drupal for our demo application
49 Step by step Drupal configuration Create a content type called Person Define 4 text fields (Age, Experience, Image and Profession) Activate the necessary modules to be able to expose content (RESTful Web Services, REST UI, HTTP Basic Authentication, HAL, CORS) Enable the Content Resource in REST configuration to allow CRUD operations (configure Basic Authentication) Create a View called Persons with a REST export Display mode and configure it to display fields from the Person Content type Go ahead and create several Person nodes in the site
50 Configuring Angular for our demo application
51 Step by step Angular configuration Generate the application skeleton using angular-cli (as shown earlier). This process is also known as scaffolding your application In the main app.component.ts file import the necessary modules and declare the components that are going to be used inside the application Declare the base component along with its template and selector (app.component.ts) Create the HTML markup of the application in the base component template (app.component.html) Define a class to represent Persons(Employees - person.ts) Create 3 components to represent the homepage of the application, the listing page of the persons and the person page
52 Step by step Angular configuration Define a service using the rxjs library and import it in the listing component as well as in the people page component (people.service.ts) Define 2 custom validators for verifying the age of the employees when they are edited Define the routes using the Angular Route module and RouterModule module. Import these in the app.module.ts Install and start the application
53 Advanced usage of Angular Consuming data with http, using forms and routes.
54 Advanced Usage of Angular Routes Forms Elastic Search Integration with other libraries for AngularJS (HighCharts, etc)
55 Angular debugging Chrome Profiler Batarang Performance tips
56 Showcase Angular & Drupal application
57 Q&A
58 Thank you! ありがとうございました
One Framework. Angular
One Framework. Angular Web 2.0 Marc Dangschat Introduction AngularJS (1) released in 2009 Angular (2) released October Short: ng Framework TypeScript, JavaScript, Dart MIT license
More informationIN4MATX 133: User Interface Software
IN4MATX 133: User Interface Software Lecture 13: Components in Angular Professor Daniel A. Epstein TA Jamshir Goorabian TA Simion Padurean 1 Notes Important: please put your name/email/id in the readme.txt
More informationBy the end of this Angular 6 tutorial, you'll learn by building a real world example application:
Throughout this Angular 6 tutorial, we'll learn to build a full-stack example web application with Angular 6, the latest version of Angular The most popular framework/platform for building mobile and desktop
More informationHands on Angular Framework
FACULTY OF AUTOMATION AND COMPUTER SCIENCE COMPUTER SCIENCE DEPARTMENT Hands on Angular Framework Ioan Salomie Tudor Cioara Ionut Anghel Marcel Antal Teodor Petrican Claudia Daniela Pop Dorin Moldovan
More informationLab 1 - Introduction to Angular
Lab 1 - Introduction to Angular In this lab we will build a Hello World style Angular component. The key focus is to learn how to install all the required code and use them from the browser. We wont get
More informationAdvance Mobile& Web Application development using Angular and Native Script
Advance Mobile& Web Application development using Angular and Native Script Objective:- As the popularity of Node.js continues to grow each day, it is highly likely that you will use it when you are building
More informationSimple AngularJS thanks to Best Practices
Simple AngularJS thanks to Best Practices Learn AngularJS the easy way Level 100-300 What s this session about? 1. AngularJS can be easy when you understand basic concepts and best practices 2. But it
More informationAngularJS Fundamentals
AngularJS Fundamentals by Jeremy Zerr Blog: http://www.jeremyzerr.com LinkedIn: http://www.linkedin.com/in/jrzerr Twitter: http://www.twitter.com/jrzerr What is AngularJS Open Source Javascript MVC/MVVM
More informationAngular 2 Programming
Course Overview Angular 2 is the next iteration of the AngularJS framework. It promises better performance. It uses TypeScript programming language for type safe programming. Overall you should see better
More informationModern and Responsive Mobile-enabled Web Applications
Available online at www.sciencedirect.com ScienceDirect Procedia Computer Science 110 (2017) 410 415 The 12th International Conference on Future Networks and Communications (FNC-2017) Modern and Responsive
More informationANGULAR 2.X,4.X + TYPESRCIPT by Sindhu
ANGULAR 2.X,4.X + TYPESRCIPT by Sindhu GETTING STARTED WITH TYPESCRIPT Installing TypeScript Compiling the code Building a simple demo. UNDERSTANDING CLASSES Building a class Adding properties Demo of
More informationSample Copy. Not For Distribution.
Angular 2 Interview Questions and Answers With Typescript and Angular 4 i Publishing-in-support-of, EDUCREATION PUBLISHING RZ 94, Sector - 6, Dwarka, New Delhi - 110075 Shubham Vihar, Mangla, Bilaspur,
More informationArjen de Blok. Senior Technical Consultant bij ICT Groep ( sinds 1995 Programmeren sinds 1990 Technologiën. Links
Arjen de Blok Senior Technical Consultant bij ICT Groep (www.ict.eu) sinds 1995 Programmeren sinds 1990 Technologiën Links Visual C++ met Microsoft Foundation Classes.NET WinForms & WPF Silverlight ASP.NET
More informationIntegrating Angular with ASP.NET Core RESTful Services. Dan Wahlin
Integrating Angular with ASP.NET Core RESTful Services Dan Wahlin Dan Wahlin https://blog.codewithdan.com @DanWahlin Get the Content: http://codewithdan.me/angular-aspnet-core Agenda The Big Picture Creating
More informationDECOUPLING PATTERNS, SERVICES AND CREATING AN ENTERPRISE LEVEL EDITORIAL EXPERIENCE
DECOUPLING PATTERNS, SERVICES AND CREATING AN ENTERPRISE LEVEL EDITORIAL EXPERIENCE Who we are and Why we are here? Saurabh Chugh Started Drupal journey in 2010 with Drupal 6, long journey with Drupal
More informationCourse Outline. ProTech Professional Technical Services, Inc. Comprehensive Angular 7 Course Summary. Description
Course Summary Description Use Angular 7 to easily build web applications that interacts with the user by dynamically rewriting the current page rather than loading entire new pages from a server. Learn
More information"Charting the Course... Comprehensive Angular. Course Summary
Description Course Summary Angular is a powerful client-side JavaScript framework from Google that supports simple, maintainable, responsive, and modular applications. It uses modern web platform capabilities
More informationA Closer Look at XPages in IBM Lotus Domino Designer 8.5 Ray Chan Advisory I/T Specialist Lotus, IBM Software Group
A Closer Look at XPages in IBM Lotus Domino Designer 8.5 Ray Chan Advisory I/T Specialist Lotus, IBM Software Group 2008 IBM Corporation Agenda XPage overview From palette to properties: Controls, Ajax
More informationPHP WITH ANGULAR CURRICULUM. What you will Be Able to Achieve During This Course
PHP WITH ANGULAR CURRICULUM What you will Be Able to Achieve During This Course This course will enable you to build real-world, dynamic web sites. If you've built websites using plain HTML, you realize
More informationIntroduction to. Angular. Prof. Dr.-Ing. Thomas Wiedemann.
EwA - Web based systems Introduction to Angular Prof. Dr.-Ing. Thomas Wiedemann email: wiedem@informatik.htw-dresden.de HOCHSCHULE FÜR TECHNIK UND WIRTSCHAFT DRESDEN (FH) Fachbereich Informatik/Mathematik
More informationFull Stack Web Developer
Full Stack Web Developer Course Contents: Introduction to Web Development HTML5 and CSS3 Introduction to HTML5 Why HTML5 Benefits Of HTML5 over HTML HTML 5 for Making Dynamic Page HTML5 for making Graphics
More informationComprehensive AngularJS Programming (5 Days)
www.peaklearningllc.com S103 Comprehensive AngularJS Programming (5 Days) The AngularJS framework augments applications with the "model-view-controller" pattern which makes applications easier to develop
More informationBefore proceeding with this tutorial, you should have a basic understanding of HTML, CSS, JavaScript, TypeScript, and Document Object Model (DOM).
i About the Tutorial Angular 4 is a JavaScript framework for building web applications and apps in JavaScript, html, and TypeScript, which is a superset of JavaScript. Angular provides built-in features
More informationAngular 4 Training Course Content
CHAPTER 1: INTRODUCTION TO ANGULAR 4 Angular 4 Training Course Content What is Angular 4? Central Features of the Angular Framework Why Angular? Scope and Goal of Angular Angular 4 vs Angular 2 vs. AngularJS
More informationTen interesting features of Google s Angular Project
Ten interesting features of Google s Angular Project - 1 Ten interesting features of Google s Angular Project Copyright Clipcode Ltd 2018 All rights reserved Ten interesting features of Google s Angular
More informationFrontend UI Training. Whats App :
Frontend UI Training Whats App : + 916 667 2961 trainer.subbu@gmail.com What Includes? 1. HTML 5 2. CSS 3 3. SASS 4. JavaScript 5. ES 6/7 6. jquery 7. Bootstrap 8. AJAX / JSON 9. Angular JS 1x 10. Node
More informationStencil: The Time for Vanilla Web Components has Arrived
Stencil: The Time for Vanilla Web Components has Arrived Gil Fink sparxys CEO @gilfink / www.gilfink.net Typical Application Web Page Design From Design to Implementation Session List Day tabs Component
More informationFull Stack boot camp
Name Full Stack boot camp Duration (Hours) JavaScript Programming 56 Git 8 Front End Development Basics 24 Typescript 8 React Basics 40 E2E Testing 8 Build & Setup 8 Advanced JavaScript 48 NodeJS 24 Building
More informationThe course also includes an overview of some of the most popular frameworks that you will most likely encounter in your real work environments.
Web Development WEB101: Web Development Fundamentals using HTML, CSS and JavaScript $2,495.00 5 Days Replay Class Recordings included with this course Upcoming Dates Course Description This 5-day instructor-led
More informationMobile App Development
Mobile App Development NativeScript e Angular 2+ filippo Filippo Matteo Riggio CTO @ Sviluppatore Full-Stack e Mobile Scenario Scenario Nativo WebView-ed Soluzioni cross - from web to native Swift - Objective
More information10267A CS: Developing Web Applications Using Microsoft Visual Studio 2010
10267A CS: Developing Web Applications Using Microsoft Visual Studio 2010 Course Overview This instructor-led course provides knowledge and skills on developing Web applications by using Microsoft Visual
More informationAdvanced Angular & Angular 6 Preview. Bibhas Bhattacharya
Advanced Angular & Angular 6 Preview Bibhas Bhattacharya Agenda Lazy loading modules Using Bootstrap with Angular Publish/subscribe with the RxJS Subject API What's new in Angular 6 Lazy Loading Modules
More informationUI Course HTML: (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) Introduction. The World Wide Web (WWW) and history of HTML
UI Course (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) HTML: Introduction The World Wide Web (WWW) and history of HTML Hypertext and Hypertext Markup Language Why HTML Prerequisites Objective
More informationSHAREPOINT DEVELOPMENT FOR 2016/2013
SHAREPOINT DEVELOPMENT FOR 2016/2013 Course Code: AUDIENCE: FORMAT: LENGTH: SP16-310-GSA (CP GSA2016) Professional Developers Instructor-led training with hands-on labs 5 Days COURSE INCLUDES: 5-days of
More informationOpen Source Library Developer & IT Pro
Open Source Library Developer & IT Pro Databases LEV 5 00:00:00 NoSQL/MongoDB: Buildout to Going Live INT 5 02:15:11 NoSQL/MongoDB: Implementation of AngularJS INT 2 00:59:55 NoSQL: What is NoSQL INT 4
More informationFull Stack Web Developer
Full Stack Web Developer S.NO Technologies 1 HTML5 &CSS3 2 JavaScript, Object Oriented JavaScript& jquery 3 PHP&MYSQL Objective: Understand the importance of the web as a medium of communication. Understand
More information"Charting the Course... Comprehensive Angular 6 Course Summary
Course Summary Description Build applications with the user experience of a desktop application and the ease of deployment of a web application using Angular. Start from scratch by learning the JavaScript
More informationThis course is designed for web developers that want to learn HTML5, CSS3, JavaScript and jquery.
HTML5/CSS3/JavaScript Programming Course Summary Description This class is designed for students that have experience with basic HTML concepts that wish to learn about HTML Version 5, Cascading Style Sheets
More informationApplication Design and Development: October 30
M149: Database Systems Winter 2018 Lecturer: Panagiotis Liakos Application Design and Development: October 30 1 Applications Programs and User Interfaces very few people use a query language to interact
More informationTHE GREAT SHAREPOINT ADVENTURE 2016
Education and Support for SharePoint, Office 365 and Azure www.combined-knowledge.com COURSE OUTLINE THE GREAT SHAREPOINT ADVENTURE 2016 Course Code GSA2016 Length 5 Days About this course The Great SharePoint
More information"Charting the Course... Comprehensive Angular 5. Course Summary
Course Summary Description Comprehensive Angular teaches students the skills and best practices they need to design, build, test, and deploy applications that provide rich end-user experiences similar
More informationAngular 2 and TypeScript Web Application Development
Angular 2 and TypeScript Web Application Development Course code: IJ -19 Course domain: Software Engineering Number of modules: 1 Duration of the course: 40 study 1 hours Sofia, 2016 Copyright 2003-2016
More informationArchitecting C++ apps
Architecting C++ apps with a multi-device application platform John JT Thomas Director of Product Management jt@embarcadero.com @FireMonkeyPM blogs.embarcadero.com/jtembarcadero/ What is a multi-device
More informationThe Great SharePoint 2016/2013 Adventure for Developers
The Great SharePoint 2016/2013 Adventure for Developers Developing for SharePoint 2016/2013 On-premises Course Code Audience Format Length Course Description Student Prerequisites GSA2016 Professional
More informationThe Now Platform Reference Guide
The Now Platform Reference Guide A tour of key features and functionality START Introducing the Now Platform Digitize your business with intelligent apps The Now Platform is an application Platform-as-a-Service
More informationApex TG India Pvt. Ltd.
(Core C# Programming Constructs) Introduction of.net Framework 4.5 FEATURES OF DOTNET 4.5 CLR,CLS,CTS, MSIL COMPILER WITH TYPES ASSEMBLY WITH TYPES Basic Concepts DECISION CONSTRUCTS LOOPING SWITCH OPERATOR
More informationAll India Council For Research & Training
WEB DEVELOPMENT & DESIGNING Are you looking for a master program in web that covers everything related to web? Then yes! You have landed up on the right page. Web Master Course is an advanced web designing,
More informationGet in Touch Module 1 - Core PHP XHTML
PHP/MYSQL (Basic + Advanced) Web Technologies Module 1 - Core PHP XHTML What is HTML? Use of HTML. Difference between HTML, XHTML and DHTML. Basic HTML tags. Creating Forms with HTML. Understanding Web
More information55249: Developing with the SharePoint Framework Duration: 05 days
Let s Reach For Excellence! TAN DUC INFORMATION TECHNOLOGY SCHOOL JSC Address: 103 Pasteur, Dist.1, HCMC Tel: 08 38245819; 38239761 Email: traincert@tdt-tanduc.com Website: www.tdt-tanduc.com; www.tanducits.com
More informationDeveloping ASP.NET MVC Web Applications (486)
Developing ASP.NET MVC Web Applications (486) Design the application architecture Plan the application layers Plan data access; plan for separation of concerns, appropriate use of models, views, controllers,
More informationPHP + ANGULAR4 CURRICULUM 6 WEEKS
PHP + ANGULAR4 CURRICULUM 6 WEEKS Hands-On Training In this course, you develop PHP scripts to perform a variety to takes, culminating in the development of a full database-driven Web page. Exercises include:
More informationAngular 4 Syllabus. Module 1: Introduction. Module 2: AngularJS to Angular 4. Module 3: Introduction to Typescript
Angular 4 Syllabus Module 1: Introduction Course Objectives Course Outline What is Angular Why use Angular Module 2: AngularJS to Angular 4 What s Changed Semantic Versioning Module 3: Introduction to
More informationTYPESCRIPT. Presented by Clarke Bowers
TYPESCRIPT Presented by Clarke Bowers ABOUT THE PRESENTER Clarke D. Bowers http://www.cbsoftwareengineering.com/ mailto: clarke@cbsoftwareengineering.com 35 years of industry experience Has developed everything
More informationDreamFactory Security Guide
DreamFactory Security Guide This white paper is designed to provide security information about DreamFactory. The sections below discuss the inherently secure characteristics of the platform and the explicit
More informationWeb Development for Dinosaurs An Introduction to Modern Web Development
Web Development for Dinosaurs An Introduction to Modern Web Development 1 / 53 Who Am I? John Cleaver Development Team Lead at Factivity, Inc. An Introduction to Modern Web Development - PUG Challenge
More informationChapter 1 - Development Setup of Angular
Chapter 1 - Development Setup of Angular Objectives Key objectives of this chapter Angular Files and Dependencies Node.js Node package manager (npm) package.json Semantic version numbers Installing Angular
More informationStatic Webpage Development
Dear Student, Based upon your enquiry we are pleased to send you the course curriculum for PHP Given below is the brief description for the course you are looking for: - Static Webpage Development Introduction
More informationFull Stack Web Developer Nanodegree Syllabus
Full Stack Web Developer Nanodegree Syllabus Build Complex Web Applications Before You Start Thank you for your interest in the Full Stack Web Developer Nanodegree! In order to succeed in this program,
More informationIntroduction to Sencha Ext JS
Introduction to Sencha Ext JS Olga Petrova olga@sencha.com Sales Engineer EMEA Agenda Use Case How It Works Advantages Demo Use case Ext JS a Javascript framework for building enterprise data-intensive
More informationMicrosoft. Inside Microsoft. SharePoint Ted Pattison. Andrew Connell. Scot Hillier. David Mann
Microsoft Inside Microsoft SharePoint 2010 Ted Pattison Andrew Connell Scot Hillier David Mann ble of Contents Foreword Acknowledgments Introduction xv xvii xix 1 SharePoint 2010 Developer Roadmap 1 SharePoint
More informationNagaraju Bende
AngularJS Nagaraju Bende Blog Twitter @nbende FaceBook nbende http://angularjs.org Agenda Introduction to AngularJS Pre-Requisites Why AngularJS Only Getting Started MV* pattern of AngularJS Directives,
More informationMagento 2 Certified Professional Developer. Exam Study Guide
Magento 2 Certified Professional Developer Exam Study Guide U Contents Contents Introduction... 1 Topics and Objectives... 3 1 Magento Architecture and Customization Techniques... 3 1.1 Describe Magento
More informationBasics of Web Technologies
Dear Student, Based upon your enquiry we are pleased to send you the course curriculum for Web Designing Given below is the brief description for the course you are looking for: Introduction to Web Technologies
More informationSetting up an Angular 4 MEAN Stack (Tutorial)
Setting up an Angular 4 MEAN Stack (Tutorial) MEAN4 Stack, MongoDB, Express.js, Angular4, Node.js6.11.4 Installed https://coursetro.com/posts/code/84/setting-up-an-angular-4-mean-stack-(tutorial) Node.js
More information"Charting the Course... MOC A: Developing with the SharePoint Framework. Course Summary
Course Summary Description This five-day instructor-led course is intended for developers who want to be able to create client-side applications with SharePoint Framework. In this course, students will
More informationTools for Accessing REST APIs
APPENDIX A Tools for Accessing REST APIs When you have to work in an agile development environment, you need to be able to quickly test your API. In this appendix, you will learn about open source REST
More informationAugust, HPE Propel Microservices & Jumpstart
August, 2016 HPE Propel s & Jumpstart Jumpstart Value Quickly build modern web applications Single page application Modular microservices architecture app generator Modularity provides better upgradeability
More information55191: Advanced SharePoint Development
Let s Reach For Excellence! TAN DUC INFORMATION TECHNOLOGY SCHOOL JSC Address: 103 Pasteur, Dist.1, HCMC Tel: 08 38245819; 38239761 Email: traincert@tdt-tanduc.com Website: www.tdt-tanduc.com; www.tanducits.com
More informationTypeScript. TypeScript. RxJS
Web 2017.08 About Me TypeScript TypeScript RxJS 2014 X 4 0 Mac/Windows Native UI Web Angular React JavaScript IM User DING Contact RPC Native Nw.js C++ Cef 2014 10 Web 11 nw.js Web App IM DING DING ->
More informationAdvantages: simple, quick to get started, perfect for simple forms, don t need to know how form model objects work
1 Forms 1.1 Introduction You cannot enter data in an application without forms. AngularJS allowed the user to create forms quickly, using the NgModel directive to bind the input element to the data in
More informationwelcome to BOILERCAMP HOW TO WEB DEV
welcome to BOILERCAMP HOW TO WEB DEV Introduction / Project Overview The Plan Personal Website/Blog Schedule Introduction / Project Overview HTML / CSS Client-side JavaScript Lunch Node.js / Express.js
More informationCourse Outline. Developing Web Applications with ASP.Net MVC 5. Course Description: Pre-requisites: Course Content:
Developing Web Applications with ASP.Net MVC 5 Course Description: The Model View Controller Framework in ASP.NET provides a new way to develop Web applications for the Microsoft.NET platform. Differing
More informationEnterprise Web Development
Enterprise Web Development Yakov Fain, Victor Rasputnis, Anatole Tartakovsky, and Viktor Gamov Beijing Cambridge Farnham Koln Sebastopol Tokyo O'REILLY Table of Contents Preface Introduction xi xxiii Part
More informationModern SharePoint and Office 365 Development
Modern SharePoint and Office 365 Development Mastering Today s Best Practices in Web and Mobile Development Course Code Audience Format Length Course Description Student Prerequisites MSD365 Professional
More informationThe decoupled CMS in financial services. Preston So 8 Nov 2017 Open Source Strategy Forum 2017
The decoupled CMS in financial services Preston So 8 Nov 2017 Open Source Strategy Forum 2017 Welcome! Preston So has been a web developer and designer since 2001, a creative professional since 2004, and
More informationAdvanced React JS + Redux Development
Advanced React JS + Redux Development Course code: IJ - 27 Course domain: Software Engineering Number of modules: 1 Duration of the course: 40 astr. hours / 54 study 1 hours Sofia, 2016 Copyright 2003-2016
More informationOracle APEX 18.1 New Features
Oracle APEX 18.1 New Features May, 2018 Safe Harbor Statement The following is intended to outline our general product direction. It is intended for information purposes only, and may not be incorporated
More informationa Very Short Introduction to AngularJS
a Very Short Introduction to AngularJS Lecture 11 CGS 3066 Fall 2016 November 8, 2016 Frameworks Advanced JavaScript programming (especially the complex handling of browser differences), can often be very
More information2310C VB - Developing Web Applications Using Microsoft Visual Studio 2008 Course Number: 2310C Course Length: 5 Days
2310C VB - Developing Web Applications Using Microsoft Visual Studio 2008 Course Number: 2310C Course Length: 5 Days Certification Exam This course will help you prepare for the following Microsoft Certified
More informationDemystifying Angular 2. SPAs for the Web of Tomorrow
Demystifying Angular 2 SPAs for the Web of Tomorrow Philipp Tarasiewicz, JavaLand, 08.03.2016 Web Dev / Distributed Systems 15 yr. About Me Philipp Tarasiewicz Consultant / Trainer / Developer philipp.tarasiewicz@googlemail.com
More informationHelpline No WhatsApp No.:
TRAINING BASKET QUALIFY FOR TOMORROW Helpline No. 9015887887 WhatsApp No.: 9899080002 Regd. Off. Plot No. A-40, Unit 301/302, Tower A, 3rd Floor I-Thum Tower Near Corenthum Tower, Sector-62, Noida - 201309
More informationHomework 8: Ajax, JSON and Responsive Design Travel and Entertainment Search (Bootstrap/Angular/AJAX/JSON/jQuery /Cloud Exercise)
Homework 8: Ajax, JSON and Responsive Design Travel and Entertainment Search (Bootstrap/Angular/AJAX/JSON/jQuery /Cloud Exercise) 1. Objectives Get familiar with the AJAX and JSON technologies Use a combination
More informationAngular 2: What s new? Jonas Bandi, IvoryCode GmbH
Angular 2: What s new? Jonas Bandi, IvoryCode GmbH Once upon a time the world was peacefully creating applications with AngularJS but change was lurking in the maze of a mailing list https://groups.google.com/forum/#!search/misko$20hevery$20may$2022$202013/polymer-dev/4rsyakmbtek/uyny3900wpij
More informationD3 + Angular JS = Visual Awesomesauce
D3 + Angular JS = Visual Awesomesauce John Niedzwiecki Lead UI Developer - ThreatTrack @RHGeek on Twitter and GitHub In addition to turning caffeine into code... disney geek, runner, gamer, father of two
More informationIntroduction to decoupled Drupal. Preston So 26 Sep 2017 DrupalCon Vienna 2017
Introduction to decoupled Drupal Preston So 26 Sep 2017 DrupalCon Vienna 2017 Herzlich Willkommen! Preston So has been a web developer and designer since 2001, a creative professional since 2004, and a
More informationP a g e 1. Danish Technological Institute. Scripting and Web Languages Online Course k Scripting and Web Languages
P a g e 1 Online Course k72853 Scripting and Web Languages P a g e 2 Title Estimated Duration (hrs) JsRender Fundamentals 2 Advanced JsRender Features 3 JavaScript SPA: Getting Started with SPA in Visual
More informationOpenECOMP SDC Developer Guide
OpenECOMP SDC Developer Guide Copyright 2017 AT&T Intellectual Property. All rights reserved. Licensed under the Creative Commons License, Attribution 4.0 Intl. (the "License"); you may not use this documentation
More informationANGULAR2 OVERVIEW. The Big Picture. Getting Started. Modules and Components. Declarative Template Syntax. Forms
FORMS IN ANGULAR Hello Cluj. I m Alex Lakatos, a Mozilla volunteer which helps other people volunteer. I want to talk to you today about Angular forms. What s a form you ask? A form creates a cohesive,
More informationGuides SDL Server Documentation Document current as of 05/24/ :13 PM.
Guides SDL Server Documentation Document current as of 05/24/2018 04:13 PM. Overview This document provides the information for creating and integrating the SmartDeviceLink (SDL) server component with
More informationAn Introduction to JavaScript & Bootstrap Basic concept used in responsive website development Form Validation Creating templates
PHP Course Contents An Introduction to HTML & CSS Basic Html concept used in website development Creating templates An Introduction to JavaScript & Bootstrap Basic concept used in responsive website development
More informationReportPlus Embedded Web SDK Guide
ReportPlus Embedded Web SDK Guide ReportPlus Web Embedding Guide 1.4 Disclaimer THE INFORMATION CONTAINED IN THIS DOCUMENT IS PROVIDED AS IS WITHOUT ANY EXPRESS REPRESENTATIONS OF WARRANTIES. IN ADDITION,
More informationGetting started with Convertigo Mobilizer
Getting started with Convertigo Mobilizer First Sencha-based project tutorial CEMS 6.0.0 TABLE OF CONTENTS Convertigo Mobilizer overview...1 Introducing Convertigo Mobilizer... 1-1 Convertigo Mobilizer
More informationAngular from the Beginning
from the Beginning EMEA PUG Challenge, Prague Introduction Robert Prediger 25 years experience in PROGRESS 17 years experience in web development 8 years experience in Node.js robert.prediger@web4biz.de
More informationPractical Course: Web Development Angular JS Part I Winter Semester 2016/17. Juliane Franze
Practical Course: Web Development Angular JS Part I Winter Semester 2016/17 Juliane Franze Ludwig-Maximilians-Universität München Practical Course Web Development WS 16/17-01 - 1 Today s Agenda What is
More informationPOWER BI BOOTCAMP. COURSE INCLUDES: 4-days of instructor led discussion, Hands-on Office labs and ebook.
Course Code : AUDIENCE : FORMAT: LENGTH: POWER BI BOOTCAMP O365-412-PBID (CP PBD365) Professional Developers Instructor-led training with hands-on labs 4 Days COURSE INCLUDES: 4-days of instructor led
More informationReact(.js) the Domino Way High-Performance Client for Domino. Knut Herrmann
React(.js) the Domino Way High-Performance Client for Domino Knut Herrmann CollabSphere 2018 Sponsors Knut Herrmann Senior Software Architect Leonso GmbH Notes Domino developer since version 2 Web application
More informationAngular 2 and TypeScript Web Application Development
Angular 2 and TypeScript Web Application Development Course code: IJ -23 Course domain: Software Engineering Number of modules: 1 Duration of the course: 42 study 1 (32 astr.) hours Sofia, 2016 Copyright
More informationTSInfo Technologies (OPC) Pvt Ltd
ABSTRACT Courses for SharePoint online Office 365 and SharePoint 2016 training SharePoint Training Courses Prepared By Bijay Kumar Sahoo (Microsoft MVP) SharePoint Online Office 365 SharePoint 2016 SharePoint
More informationIntroduction to TypeScript
AngularJS and TypeScript SPA Development, http://www.iproduct.org/ Introduction to TypeScript e-mail: tiliev@iproduct.org web: http://www.iproduct.org Oracle, Java and JavaScript are trademarks or registered
More informationAngulAr 4 Pocket Primer
Angular 4 Pocket Primer LICENSE, DISCLAIMER OF LIABILITY, AND LIMITED WARRANTY By purchasing or using this book and disc (the Work ), you agree that this license grants permission to use the contents contained
More information