Extending Blue Ocean Keith Zantow
|
|
- Cody Woods
- 6 years ago
- Views:
Transcription
1 Extending Blue Ocean Keith Zantow
2 About Keith Senior Software Engineer at CloudBees, Inc. Jenkins & Blue Ocean core contributor 15+ years full-stack development Github: kzantow
3 Intended Audience Development experience Java JavaScript HTML & CSS Node Existing Jenkins plugin development experience or desire to implement a plugin for Blue Ocean
4 Example Code github.com/kzantow/blueocean-executor-info-plugin
5 Introduction
6 Recap: what is Blue Ocean? Re-thinking of the Jenkins user experience Focused on Pipeline Visualisation Creation Editing Extensible, like Jenkins
7 Blue Ocean
8 Pipeline Creation
9 Pipeline Editor
10 Pipeline Visualization: Execution
11 Pipeline Visualization: Post-Execution
12 Pipeline Visualization: Post-Execution
13 Pipeline Activity
14 How is it built?
15 Technologies Used Java (java.sun.com) Maven (maven.apache.org) Stapler (stapler.kohsuke.org) React (facebook.github.io/react) MobX (mobx.js.org) Node * (nodejs.org) Babel * (babeljs.io) LESS * (lesscss.org) too many more to list here * build-time only
16 React? Node? Wut? React: a modern, well maintained component framework JSX: familiar syntax that aids React development Node ecosystem has tools to expedite front-end development Babel: transpile JSX, ES7 -> ES5
17 MobX? Makes state management across the React tree easier to understand Automatically updates components when data is updated
18 js-modules, js-builder & js-extensions Creates bundles containing CommonJS modules js-modules built to load things from Jenkins js-builder is a gulp buld & plugin for Browserify to build js-modules compatible bundles with easy js-extensions is a plugin for js-builder that processes the jenkins-js-extensions.yaml
19 Building a plugin The basics
20 Quick starts Yeoman plugin generator-blueocean-usain Maven Archetype almost Copy/pasta Blue Ocean Executor Info Plugin
21 Project Structure Based on Maven: / / / /.mvn_exec_node - tells Maven to use maven-frontend-plugin package.json - node build info pom.xml - maven build src/main/js / jenkins-js-extension.yaml - defines extensions / src/main/less / extensions.less - defines css rules
22 pom.xml <project...> <parent> <groupid>org.jenkins-ci.plugins</groupid> <artifactid>plugin</artifactid> <version>2.30</version> </parent> <name>blue Ocean Executor Info</name> <artifactid>blueocean-executor-info-plugin</artifactid> <packaging>hpi</packaging>
23 pom.xml <properties> <blueocean.version>1.2.0</blueocean.version> </properties> <dependencies> <dependency> <groupid>io.jenkins.blueocean</groupid> <artifactid>blueocean</artifactid> <version>${blueocean.version}</version> </dependency>...
24 package.json { "name": "blueocean-pipeline-agent-info", "version": "0.0.0", "scripts": { "bundle:watch": "jjsbuilder --tasks bundle:watch", "mvnbuild": "jjsbuilder --tasks bundle", "mvntest": "jjsbuilder --tasks test" },...
25 package.json "devdependencies": { "@jenkins-cd/blueocean-core-js": " ", "@jenkins-cd/design-language": " ", "@jenkins-cd/js-builder": "0.0.59", "@jenkins-cd/js-extensions": "0.0.36",... }, "dependencies": { "@jenkins-cd/js-modules": "0.0.8", }
26 mvn hpi:run & npm run bundle:watch mvn install hpi:run - builds and runs the plugin npm run bundle:watch - recompile js & less while editing * Gotcha: extension changes won t update without restart
27 Debugging the UI Chrome developer tools are your friend! Sources transpiled - find unique strings console.log(<object>) js-logging
28 Plugin Overview
29 What do we want to do? Write a REST endpoint to provide some data Add a top-level link to a new page Add a simple page that provides access to the data Add something within an existing page Make the extension point live update Use modern ES6/7
30 Sample plugin: show executor info Provide API that returns executor status & metadata Add a link & page to display all computers & executors Add active executors to a pipeline list (branches grumble)
31 Constructing the plugin Back-end REST service
32 REST endpoint import hudson.extension; import io.jenkins.blueocean.rest.organizationroute; import io.jenkins.blueocean.rest.model.resource; import org.kohsuke.stapler.export.exported; public class Computers extends Resource implements OrganizationRoute {
33 REST public String geturlname() { return "computers"; public Link getlink() { return getorganization().getlink().rel(geturlname()); }
34 REST public ComputerInfo[] getcomputers() throws Exception { // some code here public String getdisplayname() { return computer.getdisplayname(); }
35 Provide configuration to the BO UI import public class ExecutorinfoPreloader extends PageStatePreloader { static boolean showexecutorinfo = // get sys property public String getstatepropertypath() { return "executor"; } public String getstatejson() { return "{showinfo:" + showexecutorinfo + "}"; } }
36 Provide configuration to the BO UI // In JenkinsScript: import { blueocean } from '@jenkins-cd/blueocean-core-js/dist/js/scopes'; blueocean.executor.showinfo
37 Constructing the plugin Front-end extensions
38 Modern Javascript: Babel Add.babelrc { "presets": ["es2015", "stage-0", "react"], "plugins": [ "transform-decorators-legacy" ] }
39 Find Extension Points Well maintained extension list: git clone cd blueocean-plugin grep -r "extensionpoint=" $(find. -maxdepth 2 -name src)
40 jenkins-js-extension.yaml # Extensions in this plugin extensions: - component: Routes extensionpoint: jenkins.main.routes - component: TopLink extensionpoint: jenkins.blueocean.top.links...
41 Routes.jsx import { Route } from 'react-router'; import { ExecutorInfoPage } from './ExecutorInfoPage'; export default ( <Route path="/organizations/:organization/executor-info" component={executorinfopage} /> );
42 TopLink.jsx import React from 'react'; // Need in all JSX files import { Link } from 'react-router'; // Links to a Route import { AppConfig } from '@jenkins-cd/blueocean-core-js'; export default () => <Link to={`/organizations/${appconfig.getorganizationname()}/executor-i nfo`} title="executor Information">Executors</Link>;
43 ExecutorInfoService.js import { observable, action } from 'mobx'; import { Fetch, UrlConfig, AppConfig, sseconnection } from '@jenkins-cd/blueocean-core-js'; export class ExecutorInfoService // makes this property managed by MobX setcomputers(computers) { this.computers = computers;
44 ExecutorInfoService.js import { Fetch, UrlConfig, AppConfig, sseconnection } from '@jenkins-cd/blueocean-core-js'; constructor() { this.fetchexecutorinfo(); sseconnection.subscribe('pipeline', event => { switch (event.jenkins_event) { case 'pipeline_block_start': case 'pipeline_block_end': { this.fetchexecutorinfo(); }
45 ExecutorInfoService.js import { Fetch, UrlConfig, AppConfig, sseconnection } from '@jenkins-cd/blueocean-core-js'; fetchexecutorinfo() { Fetch.fetchJSON(`${UrlConfig.getRestBaseURL()}/organizations/${Ap pconfig.getorganizationname()}/computers/`).then(response => { this.setcomputers(response.computers); }); }
46 ExecutorInfoService.js // Export an instance to be shared so sseconnection.subscribe // not called multiple times export default new ExecutorInfoService();
47 ExecutorInfoPage.jsx import { observer } from // MobX magic automatically re-render for observable export class ExecutorInfoPage extends React.Component { render() { return ( <JTable columns={columns} classname="executor-info-table"> <TableHeaderRow />...
48 ExecutorInfoPage.jsx import executorinfoservice from './ExecutorInfoService';... render() {... {executorinfoservice.computers && // important pattern or errors executorinfoservice.computers.map(computer => [ <TableRow>...
49 Defining Extension Points
50 Defining Extension Points Extensions object from js-extensions Extensions.Renderer renders all React component extensions extensionpoint property optional filter attribute for various things like ordinals all other properties passed through to the extensions
51 Defining Extension Points import Extensions from render() {... <Extensions.Renderer extensionpoint="jenkins.pipeline.run.list.display" filter={sortbyordinal} run={branch} // passed to the extensions
52 Demo
53 Future Improvements * In the pipeline * subject to change
54 Improvements Finding ExtensionPoints Allow developers to run in a developmentmode UI hints/info where UI extension points are Generate documentation from source
55 Improvements Defining Extensions Remove jenkins-js-extensions.yaml Provide decorators Allow more strongly typed extension points & inheritence Investigating providing TypeScript interface files
56 Improved Code Sharing Allow plugins to export arbitrary javascript objects Allow plugins to import from other plugins without npm
57 Questions?
58 Resources github.com/jenkinsci/blueocean-plugin github.com/kzantow/blueocean-executor-info-plugin
59
Full Stack Developer with Java
Full Stack Developer with Java Full Stack Developer (Java) MVC, Databases and ORMs, API Backend Frontend Fundamentals - HTML, CSS, JS Unit Testing Advanced Full Stack Developer (Java) UML, Distributed
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 informationJenkins 2 UX Improvements. Keith Zantow Software Engineer, CloudBees, Inc.
Jenkins 2 UX Improvements Keith Zantow Software Engineer, CloudBees, Inc. User Experience Jenkins 1 UX Useful plugins Example: CVS Configuration experience Aging technologies A few pages to configure the
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 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 informationGetting Started with ReactJS
Getting Started with ReactJS By Juned Laliwala About this ReactJS e-book. Basic Understanding of ReactJS Concept of JSX Use of Refs and Keys Practical Demonstrations Animation in ReactJS @2016 Attune World
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 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 informationTemplates and Databinding. SWE 432, Fall 2017 Design and Implementation of Software for the Web
Templates and Databinding SWE 432, Fall 2017 Design and Implementation of Software for the Web Today What are templates? What are frontend components? How can I use these with React? 2 What s wrong with
More informationvrealize Code Stream Plug-In SDK Development Guide
vrealize Code Stream Plug-In SDK Development Guide vrealize Code Stream 2.2 This document supports the version of each product listed and supports all subsequent versions until the document is replaced
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 informationAEM React. History. 1 Introduction. AEM components written in React. Why React and AEM? Features. Projects. date author message changed chapters
AEM React AEM components written in React History date author message changed chapters 21.3.17 stefan meyer fixed typescript source code in documentation /Getting Started/First component /Development Guide/ResourceComponent
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 informationTools. SWE 432, Fall Design and Implementation of Software for the Web
Tools SWE 432, Fall 2016 Design and Implementation of Software for the Web Today Before we can really make anything, there s a bunch of technical stuff to get out of the way Tools make our lives so much
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 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 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 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 informationWebpack. What is Webpack? APPENDIX A. n n n
APPENDIX A n n n Webpack Although Webpack is used throughout the book, the primary focus of the book is on React, so Webpack didn t get a comprehensive treatment. In this Appendix, you will have the chance
More informationSelenium Testing Course Content
Selenium Testing Course Content Introduction What is automation testing? What is the use of automation testing? What we need to Automate? What is Selenium? Advantages of Selenium What is the difference
More informationA JavaScript Framework for Presentations and Animations on Computer Science
A JavaScript Framework for Presentations and Animations on Computer Science Laszlo Korte Bachelor Thesis Technical Aspects of Multimodal Systems Department of Informatics University of Hamburg 1 / 76 Outline
More informationAn Introduction to Eclipse Che Lets build a custom cloud IDE. October 2015 Tyler Jewell, Eclipse Che Project
An Introduction to Eclipse Che Lets build a custom cloud IDE October 2015 Tyler Jewell, Eclipse Che Project Lead @TylerJewell Goal Let anyone contribute to any project anywhere at any time. no pre-installation
More informationDrew Skwiers-Koballa. Azure Data Studio Extension Development
Drew Skwiers-Koballa Azure Data Studio Extension Development Hi Drew Skwiers-Koballa @sysadmindrew www.github.com/dzsquared Developer in the Microsoft ecosystem for 8 years, including SQL Server Introverted
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 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 informationWebStorm, intelligent IDE for JavaScript development
, intelligent IDE for JavaScript development JetBrains is a powerful Integrated development environment (IDE) built specifically for JavaScript developers. How does match up against competing tools? Product
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 informationReactJS and Webpack for Rails
Modern Web Conf 2015 ReactJS and Webpack for Rails Tse-Ching Ho 2015-05-16 @tsechingho 何澤清 紅寶 石商 人 Rubiest 鐵道 工 人 Rails worker 黃碼科技創辦 人 Goldenio founder 生物資訊 Bioinformatics 資料視覺化 Infographics Javascript
More informationIntroduction to the SharePoint Framework Bob German Principal Architect - BlueMetal. An Insight company
Introduction to the SharePoint Framework Bob German Principal Architect - BlueMetal An Insight company Bob German Bob is a Principal Architect at BlueMetal, where he leads Office 365 and SharePoint development
More informationWelcome. Quick Introductions
AEK Introduction Welcome Quick Introductions "The AEK"? Application Extension Kit Technique for delivering cross-platform application screens via a webview A development framework that provides a responsive
More informationReact & Redux in Hulu. (Morgan Cheng)
React & Redux in Hulu (Morgan Cheng) About Me @morgancheng About Hulu Challenges System Complexity Legacy code in jquery & Backbone UI non-predictable Lack of component isolation Performance Bottleneck
More informationVue.js Developer friendly, Fast and Versatile
.consulting.solutions.partnership Vue.js Developer friendly, Fast and Versatile Alexander Schwartz, Principal IT Consultant Javaland 2018 Brühl (DE) March 2018 Vue.js developer friendly, fast and versatile
More informationLearn Web Development CodersTrust Polska course outline. Hello CodersTrust! Unit 1. HTML Structuring the Web Prerequisites Learning pathway.
Learn Web Development CodersTrust Polska course outline Hello CodersTrust! Syllabus Communication Publishing your work Course timeframe Kick off Unit 1 Getting started with the Web Installing basic software
More informationDrupalCon Barcelona Preston So September 22, 2015
DrupalCon Barcelona 2015 Preston So September 22, 2015 Preston So (@prestonso) has designed websites since 2001 and built them in Drupal since 2007. He is Development Manager of Acquia Labs at Acquia and
More informationFront End Nanodegree Syllabus
Front End Nanodegree Syllabus Build Stunning User Experiences Before You Start You've taken the first step toward becoming a web developer by choosing the Front End Nanodegree program. In order to succeed,
More informationAn Automatic Internationalization and Localization Mechanism for Web Applications
An Automatic Internationalization and Localization Mechanism for Web Applications Che-Jen Chang, (Wei-Chen Liao, Kai-Wei Kuo, Hsiao-Lin Peng, Chia-Chen Chu) Telecom Laboratory Chunghwa Telecom Co. Ltd.
More informationBuilding a (resumable and extensible) DSL with Apache Groovy Jesse Glick CloudBees, Inc.
Building a (resumable and extensible) DSL with Apache Groovy Jesse Glick CloudBees, Inc. Introduction About Me Longtime Jenkins core contributor Primary developer on Jenkins Pipeline Meet Jenkins Pipeline
More informationdjango-baton Documentation
django-baton Documentation Release 1.0.7 abidibo Nov 13, 2017 Contents 1 Features 3 2 Getting started 5 2.1 Installation................................................ 5 2.2 Configuration...............................................
More informationContinuous Integration INRIA
Vincent Rouvreau - https://sed.saclay.inria.fr February 28, 2017 Contents 1 Preamble To go through this exercise, you will need to install : 1. Git (sudo apt-get install git sudo yum install git) 2. A
More information20480C: Programming in HTML5 with JavaScript and CSS3. Course Code: 20480C; Duration: 5 days; Instructor-led. JavaScript code.
20480C: Programming in HTML5 with JavaScript and CSS3 Course Code: 20480C; Duration: 5 days; Instructor-led WHAT YOU WILL LEARN This course provides an introduction to HTML5, CSS3, and JavaScript. This
More informationGetting started with Tabris.js Tutorial Ebook
Getting started with Tabris.js 2.3.0 Tutorial Ebook Table of contents Introduction...3 1 Get started...4 2 Tabris.js in action...5 2.1 Try the examples...5 2.2 Play with the examples...7 2.3 Write your
More informationPresented by. Dheepa Iyer Managing Consultant. Commissioned for. Reston SharePoint User Group. SharePoint Framework. May 2017
Presented by Dheepa Iyer Managing Consultant Commissioned for Reston SharePoint User Group SharePoint Framework May 2017 About Me Dheepa Iyer Managing Consultant, Washington DC Metro, XGILITY Personal
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 information6 JAVASCRIPT PROJECTS
6 JAVASCRIPT PROJECTS COMPLETE PROJECT TUTORIALS ii 6 JavaScript Projects 6 JavaScript Projects Copyright 2018 SitePoint Pty. Ltd. Product Manager: Simon Mackie English Editor: Ralph Mason Project Editor:
More informationExtensible Components with Sling Models and HTL
APACHE SLING & FRIENDS TECH MEETUP BERLIN, 25-27 SEPTEMBER 2017 Extensible Components with Sling Models and HTL Vlad Băilescu & Burkhard Pauli, Adobe About us: ref-squad 2 Agenda WCM Components in AEM
More informationCatbook Workshop: Intro to NodeJS. Monde Duinkharjav
Catbook Workshop: Intro to NodeJS Monde Duinkharjav What is NodeJS? NodeJS is... A Javascript RUNTIME ENGINE NOT a framework NOT Javascript nor a JS package It is a method for running your code in Javascript.
More informationReact + React Native. Based on material by Danilo Filgueira
React + React Native Based on material by Danilo Filgueira Prerequisites JS and ES6 HTML and CSS NPM/YARN and NODE React A Javascript library for creating reactive and composable UI components Whenever
More informationFront End. Presentation Layer. UI (User Interface) User <==> Data access layer
Angular 2 S1ngS1ng Front End UI (User Interface) User Data access layer Presentation Layer Architecture Conventional VS SPA Angular 1 Framework! Framework! Framework! MVVM (MV*) Modulization Two-way
More informationModern frontend workflows in Liferay Portal and Liferay DXP. Iván Zaera Avellon, Liferay Chema Balsas, Liferay Pier Paolo Ramon, SMC
Modern frontend workflows in Liferay Portal and Liferay DXP Iván Zaera Avellon, Liferay Chema Balsas, Liferay Pier Paolo Ramon, SMC https://www.youtube.com/watch?v=zcdwd4scz6i https://www.youtube.com/watch?v=8zfvppif-sm
More informationnpm install [<name> [<name>...]] [--save --save-dev --save-optional]
Node Package Manager by Jesse Warden http://www.jessewarden.com v1 npm ls Everything you have installed in the current directory. npm search [search terms] Search the registry for packages matching the
More informationCodeHub. Curran Kelleher 8/18/2012
CodeHub Curran Kelleher 8/18/2012 Programming is Overly Complex Development environment setup Revision control management Dependency management Deployment = time and effort learning tools, not writing
More informationRequireJS Javascript Modules for the Browser. By Ben Keith Quoin, Inc.
RequireJS Javascript Modules for the Browser By Ben Keith Quoin, Inc. Traditional Browser JS One global namespace Often inline JS code embedded directly in HTML Many tags with hidden ordering
More informationIndex. Elad Elrom 2016 E. Elrom, Pro MEAN Stack Development, DOI /
Index A Accessible Rich Internet Applications (ARIA), 101 Amazon AWS, 44 Amazon EC2, 28 Amazon s Relational Database Service (RDS), 28 Amazon Web Services (AWS) cloud, 28 Android SDK Manager, 272 Android
More informationJavaScript Rd2. -Kyle Simpson, You Don t Know JS
JavaScript Rd2 [JavaScript] is simultaneously a simple, easy-to-use language that has broad appeal, and a complex and nuanced collection of language mechanics which without careful study will elude the
More informationBrunch Documentation. Release Brunch team
Brunch Documentation Release 1.2.2 Brunch team June 22, 2012 CONTENTS i ii Contents: CONTENTS 1 2 CONTENTS CHAPTER ONE FAQ 1.1 I want to start new project with Brunch. What s the workflow? Create new
More informationMOdern Java(Script) Server Stack
MOdern Java(Script) Server Stack Pratik Patel Pratik Patel CTO Triplingo JAVA CHAMPION PRESIDENT ATLANTA JUG POLYGLOT apple mac vintage 5" screen TURTLE MY FIRST PROGRAM TURING MY FIRST REAL PROGRAM JAVASCRIPT
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 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 informationRed Hat Developer Studio 12.0
Red Hat Developer Studio 12.0 Getting Started with Developer Studio Tools Introduction to Using Red Hat Developer Studio Tools Last Updated: 2018-07-16 Red Hat Developer Studio 12.0 Getting Started with
More informationWeb Performance in
Web Performance in 2017 with @bighappyface Big thanks to DrupalCon Team Big thanks to you (it s almost a wrap) Please note This session assumes familiarity. I am speaking as if folks are already into this
More informationThe Actual Real World at EclipseCon/ALM
Tycho The Actual Real World at EclipseCon/ALM Raise your Hand if you are Sure Addressing the Issues Real World: Tycho Issues World Wide Distributed Teams India, China, Europe, Argentina, United States
More informationPackaging, automation, Continuous Integration
LP IDSE - GL Packaging, automation, Continuous Integration Based on Simon Urli and Sébastien Mosser courses 18/10/2016 Cécile Camillieri/Clément Duffau 1 Previously. 2 Development process Develop features
More informationOverview of BC Learning Network SMS2 Introduction
Overview of BC Learning Network SMS2 Introduction This guide is designed to be a cumulative overview of the SMS2 web application. SMS2 is a student management system which integrates with Moodle, a learning
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 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 informationdjango-baton Documentation
django-baton Documentation Release 1.3.1 abidibo Nov 05, 2018 Contents 1 Features 3 2 Getting started 5 2.1 Installation................................................ 5 2.2 Configuration...............................................
More informationCatbook Workshop 1: Client Side JS. Danny Tang
Catbook Workshop 1: Client Side JS Danny Tang Previously... Some frontend - Profile page - Nav bar - Stories feed page Techniques - DOM manipulation with JS In this workshop... More frontend - Stories
More informationIntroduction: Manual Testing :
: What is Automation Testing? Use of Automation. Where do we use. Tools that Do Automation. Web Applications vs Standalone Applications. What is selenium? How selenium works. Manual Testing : HTML: Detailed
More information6 th October 2018 Milan
6 th October 2018 Milan Mastering Office 365 development with SharePoint Framework Elio Struyf, Valo Intranet Paolo Pialorsi, PiaSys.com Elio Struyf Developer & Architect @eliostruyf www.eliostruyf.com
More informationINF Introduction. Knut Staring gmail}
INF5750 - Introduction Knut Staring knutst@{ifi, gmail} Lecture 1 - overview Background to the course Content and expectations Assignments and group work Maven build system Revision control system Object-Relational
More informationCisco Spark Widgets Technical drill down
DEVNET-1891 Cisco Spark Widgets Technical drill down Adam Weeks, Engineer @CiscoSparkDev Stève Sfartz, API Evangelist @CiscoDevNet Cisco Spark How Questions? Use Cisco Spark to communicate with the speaker
More informationHacking with React. Get started with React, React Router, Jest, Webpack, ES6 and more with this hands-on guide. Paul Hudson.
Hacking with React Get started with React, React Router, Jest, Webpack, ES6 and more with this hands-on guide. Paul Hudson 2016 Paul Hudson This book is dedicated to my wife, who has been endlessly patient
More informationIN4MATX 133: User Interface Software
IN4MATX 133: User Interface Software Lecture 7: Package Management & TypeScript Professor Daniel A. Epstein TA Jamshir Goorabian TA Simion Padurean 1 A1 Make sure you Push as well as Committing! Need to
More informationCordova - Guide - Custom Plugins
Cordova - Guide - Custom Plugins Dr Nick Hayward A brief overview of custom plugin development for Cordova. Contents intro structure and design architecture - Android architecture - cross-platform Plugman
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 informationTHE PRAGMATIC INTRO TO REACT. Clayton Anderson thebhwgroup.com WEB AND MOBILE APP DEVELOPMENT AUSTIN, TX
THE PRAGMATIC INTRO TO REACT Clayton Anderson thebhwgroup.com WEB AND MOBILE APP DEVELOPMENT AUSTIN, TX REACT "A JavaScript library for building user interfaces" But first... HOW WE GOT HERE OR: A BRIEF
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 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 informationRed Hat JBoss Developer Studio 11.3
Red Hat JBoss Developer Studio 11.3 Getting Started with JBoss Developer Studio Tools Introduction to Using Red Hat JBoss Developer Studio Tools Last Updated: 2018-06-08 Red Hat JBoss Developer Studio
More informationWriting your first Web Data Connector
Welcome # T C 1 8 Writing your first Web Data Connector Brett Taylor Staff Software Engineer Tableau Ashwin Sekar Software Engineer Tableau Enabling Integrations for Developers Embedded Analytics Integrations
More informationJavaScript Frameworks
JavaScript Frameworks A Comparison Of Titans Philip Esmailzade philipesmailzade@gmail.com Faculty of Computing Blekinge Institute of Technology SE-371 79 Karlskrona Sweden ABSTRACT There are several JavaScript
More informationJavaScript and MVC Frameworks FRONT-END ENGINEERING
FRONT-END ENGINEERING Introduction & History Introduction JavaScript is an incredible language to learn for anyone interested in getting into programming. It is the only programing language that can run
More informationWhat is Maven? Apache Maven is a software project management and comprehension tool (build, test, packaging, reporting, site, deploy).
Plan What is Maven? Links : mvn command line tool POM : 1 pom.xml = 1 artifact POM POM Inheritance Standard Directory Layout Demo on JMMC projects Plugins Conclusion What is Maven? Apache Maven is a software
More information30 th September 2017 Milan
30 th September 2017 Milan SharePoint Framework tips & tricks Giuseppe Marchi, Dev4Side S.r.l. www.peppedotnet.it www.office365italia.com Hi, my name is Peppe! Co-founder of Dev4Side S.r.l. 8 years Microsoft
More informationMaven Introduction to Concepts: POM, Dependencies, Plugins, Phases
arnaud.nauwynck@gmail.com Maven Introduction to Concepts: POM, Dependencies, Plugins, Phases This document: http://arnaud-nauwynck.github.io/docs/maven-intro-concepts.pdf 31 M!! What is Maven? https://maven.apache.org/
More information5th April Installation Manual. Department of Computing and Networking Software Development Degree
5th April 2017 Installation Manual Department of Computing and Networking Software Development Degree Project name: Student: Student Number: Supervisor: MaaP (Message as a Platform) Chihabeddine Ahmed
More informationMoving From Studio to Atelier. Wouter Dupré Sales Engineer
Moving From Studio to Atelier Wouter Dupré Sales Engineer Before we start the journey Introduction Atelier: What is it? Atelier is a modern IDE for applications developers Implemented as a plug-in to Eclipse
More informationFront End Nanodegree Syllabus
Front End Nanodegree Syllabus Build Stunning User Experiences Before You Start You've taken the first step toward becoming a web developer by choosing the Front End Nanodegree program. In order to succeed,
More informationJavaScript Fundamentals_
JavaScript Fundamentals_ HackerYou Course Syllabus CLASS 1 Intro to JavaScript Welcome to JavaScript Fundamentals! Today we ll go over what programming languages are, JavaScript syntax, variables, and
More informationAPACHE SLING & FRIENDS TECH MEETUP SEPTEMBER Integrating a Modern Frontend Setup with AEM Natalia Venditto, Netcentric
APACHE SLING & FRIENDS TECH MEETUP 10-12 SEPTEMBER 2018 Integrating a Modern Frontend Setup with AEM Natalia Venditto, Netcentric A modern frontend setup 2 How do we understand a modern setup? A modern
More informationReact Loadable: Code Splitting with Server Side Rendering
React Loadable: Code Splitting with Server Side Rendering About me Former Senior Frontend Developer at Oppex Tech Lead at Toughbyte Ltd React github.com/northerneyes medium.com/@northerneyes twitter.com/nordfinn
More informationUNIT -II. Language-History and Versions Introduction JavaScript in Perspective-
UNIT -II Style Sheets: CSS-Introduction to Cascading Style Sheets-Features- Core Syntax-Style Sheets and HTML Style Rle Cascading and Inheritance-Text Properties-Box Model Normal Flow Box Layout- Beyond
More informationwidgetjs Documentation
widgetjs Documentation Release 1.2.3 Nicolas Vanhoren Dec 22, 2017 Contents 1 Tutorial 3 1.1 Presentation of widgetjs......................................... 3 1.2 Quickstart................................................
More informationLeanJS Documentation. Release Romain Dorgueil
LeanJS Documentation Release 1.0.0 Romain Dorgueil December 26, 2016 Contents 1 Goals 3 2 Quick start 5 3 Documentation 7 3.1 LeanJS.................................................. 7 3.2 Getting started..............................................
More informationEnterSpace Data Sheet
EnterSpace 7.0.4.3 Data Sheet ENTERSPACE BUNDLE COMPONENTS Policy Engine The policy engine is the heart of EnterSpace. It evaluates digital access control policies and makes dynamic, real-time decisions
More informationQuick Desktop Application Development Using Electron
Quick Desktop Application Development Using Electron Copyright Blurb All rights reserved. No part of this book may be reproduced in any form or by any electronic or mechanical means including information
More informationGuides SDL Server Documentation Document current as of 04/06/ :35 PM.
Guides SDL Server Documentation Document current as of 04/06/2018 02:35 PM. Overview This document provides the information for creating and integrating the SmartDeviceLink (SDL) server component with
More informationNick Senger & Jesse van den Kieboom
Using TypeScript with the ArcGIS API for JavaScript Nick Senger & Jesse van den Kieboom Live version of this presentation is available on: https://jkieboom.github.io/devsummit-palm-springs-2018/presentations/typescript-arcgis-js-api
More informationWebpack 2 The last bundler you would need in Vijay Dharap, Principal Architect, Infosys
Webpack 2 The last bundler you would need in 2017 Vijay Dharap, Principal Architect, Infosys Speaker Bio 14+ Years of experience Principal Architect in Infosys Passionate about delightful UX Open Source
More informationMARIA KERN NETZ98 GMBH MAGENTO 2 UI COMPONENTS THE JS PART
MARIA KERN NETZ98 GMBH MAGENTO 2 UI COMPONENTS THE JS PART Magento 2 UI Components The JS part Maria Kern Senior Frontend Architect at netz98 GmbH www.netz98.de @maja_kern CommerceHero: maria-kern AGENDA
More information