SlideShare ist ein Scribd-Unternehmen logo
1 von 42
LinkedIn and Adobe CQ

©2014 LinkedIn Corporation. All Rights Reserved.
LinkedIn
Disclosure
 Certain information is confidential
 We will err on the side of caution
 Any inquires can be directed to:
– Web: press.linkedin.com
– Email: press@linkedin.com

©2014 LinkedIn Corporation. All Rights Reserved.

2
LinkedIn
LinkedIn

©2014 LinkedIn Corporation. All Rights Reserved.

4
LinkedIn

Not Adobe CQ

©2014 LinkedIn Corporation. All Rights Reserved.

5
LinkedIn
Brief Overview

©2014 LinkedIn Corporation. All Rights Reserved.

6
LinkedIn
Brief Overview

©2014 LinkedIn Corporation. All Rights Reserved.

7
LinkedIn
Brief Overview

premium.linkedin.com
talent.linkedin.com

marketing.linkedin.com

©2014 LinkedIn Corporation. All Rights Reserved.

8
UED Brand & Marketing
UED Brand & Marketing
User Experience Design
 User Experience Design
– Focused on providing the best possible end-to-end experience for our users.
– Composed of web developers and designers and others.

 Brand & Marketing
– We support marketing, business and internal clients
– Using Adobe CQ5.5 (as well as WordPress and Drupal)

©2014 LinkedIn Corporation. All Rights Reserved.

10
LinkedIn UED/BAM Major Sites

©2014 LinkedIn Corporation. All Rights Reserved.
LinkedIn UED/BAM Major Sites





marketing.linkedin.com
sales.linkedin.com
talent.linkedin.com
premium.linkedin.com

©2014 LinkedIn Corporation. All Rights Reserved.
LinkedIn UED/BAM Campaign Sites

©2014 LinkedIn Corporation. All Rights Reserved.
LinkedIn UED/BAM Campaign Sites













brand.linkedin.com
business.linkedin.com
certification.linkedin.com
live.linkedin.com
nonprofit.linkedin.com
smallbusiness.linkedin.com
students.linkedin.com
talentconnect.linkedin.com
university.linkedin.com
veterans.linkedin.com
volunteer.linkedin.com
and many more…

©2014 LinkedIn Corporation. All Rights Reserved.
History of CQ at LinkedIn
History and CMS Selection Process

Why does LinkedIn use CQ?

©2014 LinkedIn Corporation. All Rights Reserved.

16
Pre-CQ: The “Wild West”
Struggles with a Multi-Platform Approach
 Sites were often developed by external agencies
 Sites were built on a number of CMS platforms

©2014 LinkedIn Corporation. All Rights Reserved.

17
Choosing CQ
There can be only one... CMS.
 Consultant Recommended
 Offered a number of things our authors wanted
 The demo was pretty snazzy

©2014 LinkedIn Corporation. All Rights Reserved.

18
Early CQ
Our first experiences developing a CQ app
 Hired the consultant to deliver our first app
 Began to notice issues as we scaled the app

©2014 LinkedIn Corporation. All Rights Reserved.

19
Re-Architecting the LinkedIn Microsites App

Project Greenfield

©2014 LinkedIn Corporation. All Rights Reserved.

20
Making Things Scalable
Identifying what direction we wanted to take the platform





Sought out experienced in-house app developers for guidance
Ultimately decided to support all sites using a single application
Concluded that “out of the box” wasn’t good enough
Needed to work in parallel with the app supporting the first site

©2014 LinkedIn Corporation. All Rights Reserved.

21
What it Looked Like
How we scaled the app





Decided to build new instead of extend the existing app
Cleaner directory structure under new app
Most pages are built using an open “Blank Page” styled template
Components are tied more closely to “Content Blocks” that you build with

©2014 LinkedIn Corporation. All Rights Reserved.

22
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

23
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

24
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

25
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

26
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

27
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

28
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

29
Content Block Style Components

©2014 LinkedIn Corporation. All Rights Reserved.

30
Priorities
Priorities
 Security
 Brand protection
 Code progression
– Reusability
– Performance
– etc...

 Company integration

©2014 LinkedIn Corporation. All Rights Reserved.

32
Security
 First Rule: Members First
 Code review
– Information Security reviews all code

 XSS all input from content authors
– XSS and encode everything
– No HTML, CSS, or JS entry
– Richtext Editors locked down
 Copy/paste only text, no styles or html

– Pathfields limited to internal paths only
 pathfield vs resourcepathfield vs imagepathfield

– Even video components won’t allow HTML inserted into page

©2014 LinkedIn Corporation. All Rights Reserved.

33
Building a Better Platform
 Custom JSTL tag library
– “LI Tags”
– All XSS through them
– Centralized and reusable
 example: image tag allowed easy Lazy Loading feature

 Java vs. JSP components
–
–
–
–
–

Eliminates spaghetti code
Separates business logic layer from presentation layer
Object Oriented Programming
Reusable code
Test Driven Development

©2014 LinkedIn Corporation. All Rights Reserved.

34
Company Integration
 Goal
– Any member of any team could be swapped anywhere

 Only team on Adobe CQ
– Not everything lends itself to the LinkedIn way







LESS vs SASS
Maven vs Gradle
i18n and l10n
UI and CSS
clientlibs vs inject/require & atomic
Build and deployment process

 Interface with “stack”
– Real User Metrics
– Tracking
– Custom LinkedIn code scripts
©2014 LinkedIn Corporation. All Rights Reserved.

35
Dev then && Dev now
Old Workflow
It was like…

 SVN + VLT
– Lack of resources && appropriate knowledge
– Inconsistencies between svn 1.6 and 1.7
– Complicated workflow just for ci/dev work.

 Problems
– Vague understanding of filevault
– Continuous overriding of people’s work
– Managing conflicts between vlt and svn was a pain

pub

dev
trunk

vlt

dev
©2014 LinkedIn Corporation. All Rights Reserved.

* Image from: http://www.txcscopereview.com/2012/veteran-math-teacher-tells-all/

auth

svn up
vlt up
svn up
- resolve
Vlt add
vlt ci
- pray
37
Evolution of Current Process
Something more flexible and more stupid proof
 GIT-SVN + VLT
– Git made versioning much easier
– SVN backing allowed for easy RB integration
– VLT was still a pain in the..

 Intro Ash: GIT-SVN + MVN
– MVN made deploying much easier
 1 line deploy ./build
 Scalable
 Introduction of JUNIT (still need to leverage)

©2014 LinkedIn Corporation. All Rights Reserved.

* image: http://www.chinadaily.com.cn/china/2012-01/11/content_14424377.htm

38
Primary Benefits
•
•

git

•

dev

dev

dev

Archetype (SASS) integration
Linting && Unit Testing
• Pre-deploy validation
Builds to a deployable artifact
• Integration with other systems
• Easier Automation

Secondary Benefits
auth
replication

•
•
•

Branching made dev work easier
Git had better conflict resolution
Pre-commit hooks easier to implement

pub
Evolution/Scaling cont.
©2014 LinkedIn Corporation. All Rights Reserved.

39
Future Considerations
So now what?
 Automated QA Testing
 Package verification after build/install (is the package active)
 Further breaking up of our code into multiple bundles
– As it grows will there be need for multiple OSGI bundles
 services, filters, configs, content, etc.

 Build monitoring
– Automated deploys w/ fallbacks
– Pre production cycle for integration/qa/etc

 One stop shop for web devs
– Scripts for self serve testing, deploying to production, creating reviews, tagging
commits, dependency systems, etc.

©2014 LinkedIn Corporation. All Rights Reserved.

40
Thank You
Developers

Engineers

QA

Management

Nate Yolles
Will D. White
Alec Sorensen
Gilbert Hernandez
Thomas Johnston
Stephanie Lie
Osama Ahmad
James Miller
Brodie Yazaki
Yuin Ee

Jefferson Luan
Ash Mishra
Yogesh Upadhyay
Dave Le
Nicole Ng
Tiffany Saelinh

Robert Handley
Avanish Sharma
Juhi Puri

Daniel Apodaca
Khanh Nguyen
Emily Tran
Jennifer Williams
Vishu Shetty

UED BAM Design
LinkedIn Marketing Dept
Vinay Dixit
Gina Groom

Special Thanks To:
David Delo
Jacob Heuser
Eugene O’neill
LinkedIn VCIO

Steve Johnson
Bay Area CQ Meetup
LinkedIn Facilities Team
LinkedIn Press Team
Adobe CQ at LinkedIn Meetup February 2014

Weitere ähnliche Inhalte

Was ist angesagt?

Net, MVC 3+ years Experience
Net, MVC 3+ years ExperienceNet, MVC 3+ years Experience
Net, MVC 3+ years Experience
Madhava B
 

Was ist angesagt? (19)

ReactJS Vs React Native: Understanding Differences, Advantages, Disadvantages
ReactJS Vs React Native: Understanding Differences, Advantages, DisadvantagesReactJS Vs React Native: Understanding Differences, Advantages, Disadvantages
ReactJS Vs React Native: Understanding Differences, Advantages, Disadvantages
 
PixelCrayons: Hire India's Top PHP Developers
PixelCrayons: Hire India's Top PHP DevelopersPixelCrayons: Hire India's Top PHP Developers
PixelCrayons: Hire India's Top PHP Developers
 
2014 HTML5 총정리
2014 HTML5 총정리2014 HTML5 총정리
2014 HTML5 총정리
 
Top 10 Front End Development Technologies to Focus in 2018
Top 10 Front End Development Technologies to Focus in 2018Top 10 Front End Development Technologies to Focus in 2018
Top 10 Front End Development Technologies to Focus in 2018
 
Spring Cloud Gateway - Ryan Baxter
Spring Cloud Gateway - Ryan BaxterSpring Cloud Gateway - Ryan Baxter
Spring Cloud Gateway - Ryan Baxter
 
Java Development Company | Xicom
Java Development Company | XicomJava Development Company | Xicom
Java Development Company | Xicom
 
Cloud Foundry Services on PKS with No Extra Code, "We Bosh So You Don’t Have ...
Cloud Foundry Services on PKS with No Extra Code, "We Bosh So You Don’t Have ...Cloud Foundry Services on PKS with No Extra Code, "We Bosh So You Don’t Have ...
Cloud Foundry Services on PKS with No Extra Code, "We Bosh So You Don’t Have ...
 
Api Lifecycle Operation with Open Source Products
Api Lifecycle Operation with Open Source ProductsApi Lifecycle Operation with Open Source Products
Api Lifecycle Operation with Open Source Products
 
Agile toolkit present 2012
Agile toolkit present 2012Agile toolkit present 2012
Agile toolkit present 2012
 
Net, MVC 3+ years Experience
Net, MVC 3+ years ExperienceNet, MVC 3+ years Experience
Net, MVC 3+ years Experience
 
Android Jump Start
Android Jump StartAndroid Jump Start
Android Jump Start
 
Stack skills
Stack skillsStack skills
Stack skills
 
Agile toolkit present 2012
Agile toolkit present 2012Agile toolkit present 2012
Agile toolkit present 2012
 
How to increase the ui performance of apps designed using react
How to increase the ui performance of apps designed using react How to increase the ui performance of apps designed using react
How to increase the ui performance of apps designed using react
 
2013년 html5 총정리 (Summary of HTML5 Trend in 2013)
2013년 html5 총정리 (Summary of HTML5 Trend in 2013)2013년 html5 총정리 (Summary of HTML5 Trend in 2013)
2013년 html5 총정리 (Summary of HTML5 Trend in 2013)
 
Living on the Edge With Spring Cloud Gateway - Cora Iberkleid
Living on the Edge With Spring Cloud Gateway - Cora IberkleidLiving on the Edge With Spring Cloud Gateway - Cora Iberkleid
Living on the Edge With Spring Cloud Gateway - Cora Iberkleid
 
The Scala Programming Language
The Scala Programming LanguageThe Scala Programming Language
The Scala Programming Language
 
Swagger & OpenAPI Spec #openapi
Swagger & OpenAPI Spec #openapiSwagger & OpenAPI Spec #openapi
Swagger & OpenAPI Spec #openapi
 
Java training in Bhubaneswar
Java training in BhubaneswarJava training in Bhubaneswar
Java training in Bhubaneswar
 

Andere mochten auch

Http协议介绍
Http协议介绍Http协议介绍
Http协议介绍
Sanji Zhang
 
Unicef branding toolkit
Unicef branding toolkitUnicef branding toolkit
Unicef branding toolkit
Rich Tong
 

Andere mochten auch (9)

Introduction to User Experience for Internet Company
Introduction to User Experience for Internet CompanyIntroduction to User Experience for Internet Company
Introduction to User Experience for Internet Company
 
Yunax technologies
Yunax technologiesYunax technologies
Yunax technologies
 
Http协议介绍
Http协议介绍Http协议介绍
Http协议介绍
 
Introduction to LinkedIn media - From LinkedIn Amsterdam #Staffing event
Introduction to LinkedIn media - From LinkedIn Amsterdam #Staffing eventIntroduction to LinkedIn media - From LinkedIn Amsterdam #Staffing event
Introduction to LinkedIn media - From LinkedIn Amsterdam #Staffing event
 
123D Circuits
123D Circuits123D Circuits
123D Circuits
 
08 aimradial2016 fri S IJsselmuiden
08 aimradial2016 fri S IJsselmuiden08 aimradial2016 fri S IJsselmuiden
08 aimradial2016 fri S IJsselmuiden
 
20151230_SAP Commercial Project Management - Overview
20151230_SAP Commercial Project Management - Overview20151230_SAP Commercial Project Management - Overview
20151230_SAP Commercial Project Management - Overview
 
Unicef branding toolkit
Unicef branding toolkitUnicef branding toolkit
Unicef branding toolkit
 
Brandbook Nike
Brandbook NikeBrandbook Nike
Brandbook Nike
 

Ähnlich wie Adobe CQ at LinkedIn Meetup February 2014

Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...
Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...
Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...
GRUC
 
Tech foundations-slides
Tech foundations-slidesTech foundations-slides
Tech foundations-slides
tranquynh93
 
Rajendran M 2+ years of Exp in Dot net
Rajendran M 2+ years of Exp in Dot netRajendran M 2+ years of Exp in Dot net
Rajendran M 2+ years of Exp in Dot net
Rajendran m
 

Ähnlich wie Adobe CQ at LinkedIn Meetup February 2014 (20)

Grails & DevOps: continuous integration and delivery in the cloud
Grails & DevOps: continuous integration and delivery in the cloudGrails & DevOps: continuous integration and delivery in the cloud
Grails & DevOps: continuous integration and delivery in the cloud
 
UrbanCode Deploy course and product overview slides
UrbanCode Deploy course and product overview slidesUrbanCode Deploy course and product overview slides
UrbanCode Deploy course and product overview slides
 
Building a Modern Enterprise SOA at LinkedIn
Building a Modern Enterprise SOA at LinkedInBuilding a Modern Enterprise SOA at LinkedIn
Building a Modern Enterprise SOA at LinkedIn
 
Optimize your CI/CD with GitLab and AWS
Optimize your CI/CD with GitLab and AWSOptimize your CI/CD with GitLab and AWS
Optimize your CI/CD with GitLab and AWS
 
Overview
OverviewOverview
Overview
 
Resume
ResumeResume
Resume
 
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
CampDevOps keynote - DevOps: Using 'Lean' to eliminate BottlenecksCampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
CampDevOps keynote - DevOps: Using 'Lean' to eliminate Bottlenecks
 
Webinar for July 2020 - Insights to Solutions Spotlight: Re-imagining Digital...
Webinar for July 2020 - Insights to Solutions Spotlight: Re-imagining Digital...Webinar for July 2020 - Insights to Solutions Spotlight: Re-imagining Digital...
Webinar for July 2020 - Insights to Solutions Spotlight: Re-imagining Digital...
 
BP 308 - The Journey to Becoming a Social Application Developer
BP 308 - The Journey to Becoming a Social Application DeveloperBP 308 - The Journey to Becoming a Social Application Developer
BP 308 - The Journey to Becoming a Social Application Developer
 
(Letsee) Company Introduction ver 2019_06_17
(Letsee) Company Introduction ver 2019_06_17(Letsee) Company Introduction ver 2019_06_17
(Letsee) Company Introduction ver 2019_06_17
 
Linking Upstream and Downstream Agile
Linking Upstream and Downstream AgileLinking Upstream and Downstream Agile
Linking Upstream and Downstream Agile
 
How NBCUniversal Adopted DevOps
How NBCUniversal Adopted DevOpsHow NBCUniversal Adopted DevOps
How NBCUniversal Adopted DevOps
 
BUDDY White Paper
BUDDY White PaperBUDDY White Paper
BUDDY White Paper
 
New Capabilities and Product Strategy for .NET on PCF
New Capabilities and Product Strategy for .NET on PCF New Capabilities and Product Strategy for .NET on PCF
New Capabilities and Product Strategy for .NET on PCF
 
Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...
Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...
Webcast Presentation: Be lean. Be agile. Work together with DevOps Services (...
 
Tech foundations-slides
Tech foundations-slidesTech foundations-slides
Tech foundations-slides
 
Analyzing Optimal Practises for Web Frameworks
Analyzing Optimal Practises for Web FrameworksAnalyzing Optimal Practises for Web Frameworks
Analyzing Optimal Practises for Web Frameworks
 
Rajendran M 2+ years of Exp in Dot net
Rajendran M 2+ years of Exp in Dot netRajendran M 2+ years of Exp in Dot net
Rajendran M 2+ years of Exp in Dot net
 
Some Features make CodeIgniter Powerfull PHP framework.pdf
Some Features make CodeIgniter Powerfull PHP framework.pdfSome Features make CodeIgniter Powerfull PHP framework.pdf
Some Features make CodeIgniter Powerfull PHP framework.pdf
 
Applying lean, dev ops, and cloud for better business outcomes
Applying lean, dev ops, and cloud for better business outcomesApplying lean, dev ops, and cloud for better business outcomes
Applying lean, dev ops, and cloud for better business outcomes
 

Kürzlich hochgeladen

Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
Joaquim Jorge
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Earley Information Science
 

Kürzlich hochgeladen (20)

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Evaluating the top large language models.pdf
Evaluating the top large language models.pdfEvaluating the top large language models.pdf
Evaluating the top large language models.pdf
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 

Adobe CQ at LinkedIn Meetup February 2014

  • 1. LinkedIn and Adobe CQ ©2014 LinkedIn Corporation. All Rights Reserved.
  • 2. LinkedIn Disclosure  Certain information is confidential  We will err on the side of caution  Any inquires can be directed to: – Web: press.linkedin.com – Email: press@linkedin.com ©2014 LinkedIn Corporation. All Rights Reserved. 2
  • 4. LinkedIn ©2014 LinkedIn Corporation. All Rights Reserved. 4
  • 5. LinkedIn Not Adobe CQ ©2014 LinkedIn Corporation. All Rights Reserved. 5
  • 6. LinkedIn Brief Overview ©2014 LinkedIn Corporation. All Rights Reserved. 6
  • 7. LinkedIn Brief Overview ©2014 LinkedIn Corporation. All Rights Reserved. 7
  • 9. UED Brand & Marketing
  • 10. UED Brand & Marketing User Experience Design  User Experience Design – Focused on providing the best possible end-to-end experience for our users. – Composed of web developers and designers and others.  Brand & Marketing – We support marketing, business and internal clients – Using Adobe CQ5.5 (as well as WordPress and Drupal) ©2014 LinkedIn Corporation. All Rights Reserved. 10
  • 11. LinkedIn UED/BAM Major Sites ©2014 LinkedIn Corporation. All Rights Reserved.
  • 12. LinkedIn UED/BAM Major Sites     marketing.linkedin.com sales.linkedin.com talent.linkedin.com premium.linkedin.com ©2014 LinkedIn Corporation. All Rights Reserved.
  • 13. LinkedIn UED/BAM Campaign Sites ©2014 LinkedIn Corporation. All Rights Reserved.
  • 14. LinkedIn UED/BAM Campaign Sites             brand.linkedin.com business.linkedin.com certification.linkedin.com live.linkedin.com nonprofit.linkedin.com smallbusiness.linkedin.com students.linkedin.com talentconnect.linkedin.com university.linkedin.com veterans.linkedin.com volunteer.linkedin.com and many more… ©2014 LinkedIn Corporation. All Rights Reserved.
  • 15. History of CQ at LinkedIn
  • 16. History and CMS Selection Process Why does LinkedIn use CQ? ©2014 LinkedIn Corporation. All Rights Reserved. 16
  • 17. Pre-CQ: The “Wild West” Struggles with a Multi-Platform Approach  Sites were often developed by external agencies  Sites were built on a number of CMS platforms ©2014 LinkedIn Corporation. All Rights Reserved. 17
  • 18. Choosing CQ There can be only one... CMS.  Consultant Recommended  Offered a number of things our authors wanted  The demo was pretty snazzy ©2014 LinkedIn Corporation. All Rights Reserved. 18
  • 19. Early CQ Our first experiences developing a CQ app  Hired the consultant to deliver our first app  Began to notice issues as we scaled the app ©2014 LinkedIn Corporation. All Rights Reserved. 19
  • 20. Re-Architecting the LinkedIn Microsites App Project Greenfield ©2014 LinkedIn Corporation. All Rights Reserved. 20
  • 21. Making Things Scalable Identifying what direction we wanted to take the platform     Sought out experienced in-house app developers for guidance Ultimately decided to support all sites using a single application Concluded that “out of the box” wasn’t good enough Needed to work in parallel with the app supporting the first site ©2014 LinkedIn Corporation. All Rights Reserved. 21
  • 22. What it Looked Like How we scaled the app     Decided to build new instead of extend the existing app Cleaner directory structure under new app Most pages are built using an open “Blank Page” styled template Components are tied more closely to “Content Blocks” that you build with ©2014 LinkedIn Corporation. All Rights Reserved. 22
  • 23. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 23
  • 24. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 24
  • 25. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 25
  • 26. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 26
  • 27. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 27
  • 28. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 28
  • 29. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 29
  • 30. Content Block Style Components ©2014 LinkedIn Corporation. All Rights Reserved. 30
  • 32. Priorities  Security  Brand protection  Code progression – Reusability – Performance – etc...  Company integration ©2014 LinkedIn Corporation. All Rights Reserved. 32
  • 33. Security  First Rule: Members First  Code review – Information Security reviews all code  XSS all input from content authors – XSS and encode everything – No HTML, CSS, or JS entry – Richtext Editors locked down  Copy/paste only text, no styles or html – Pathfields limited to internal paths only  pathfield vs resourcepathfield vs imagepathfield – Even video components won’t allow HTML inserted into page ©2014 LinkedIn Corporation. All Rights Reserved. 33
  • 34. Building a Better Platform  Custom JSTL tag library – “LI Tags” – All XSS through them – Centralized and reusable  example: image tag allowed easy Lazy Loading feature  Java vs. JSP components – – – – – Eliminates spaghetti code Separates business logic layer from presentation layer Object Oriented Programming Reusable code Test Driven Development ©2014 LinkedIn Corporation. All Rights Reserved. 34
  • 35. Company Integration  Goal – Any member of any team could be swapped anywhere  Only team on Adobe CQ – Not everything lends itself to the LinkedIn way       LESS vs SASS Maven vs Gradle i18n and l10n UI and CSS clientlibs vs inject/require & atomic Build and deployment process  Interface with “stack” – Real User Metrics – Tracking – Custom LinkedIn code scripts ©2014 LinkedIn Corporation. All Rights Reserved. 35
  • 36. Dev then && Dev now
  • 37. Old Workflow It was like…  SVN + VLT – Lack of resources && appropriate knowledge – Inconsistencies between svn 1.6 and 1.7 – Complicated workflow just for ci/dev work.  Problems – Vague understanding of filevault – Continuous overriding of people’s work – Managing conflicts between vlt and svn was a pain pub dev trunk vlt dev ©2014 LinkedIn Corporation. All Rights Reserved. * Image from: http://www.txcscopereview.com/2012/veteran-math-teacher-tells-all/ auth svn up vlt up svn up - resolve Vlt add vlt ci - pray 37
  • 38. Evolution of Current Process Something more flexible and more stupid proof  GIT-SVN + VLT – Git made versioning much easier – SVN backing allowed for easy RB integration – VLT was still a pain in the..  Intro Ash: GIT-SVN + MVN – MVN made deploying much easier  1 line deploy ./build  Scalable  Introduction of JUNIT (still need to leverage) ©2014 LinkedIn Corporation. All Rights Reserved. * image: http://www.chinadaily.com.cn/china/2012-01/11/content_14424377.htm 38
  • 39. Primary Benefits • • git • dev dev dev Archetype (SASS) integration Linting && Unit Testing • Pre-deploy validation Builds to a deployable artifact • Integration with other systems • Easier Automation Secondary Benefits auth replication • • • Branching made dev work easier Git had better conflict resolution Pre-commit hooks easier to implement pub Evolution/Scaling cont. ©2014 LinkedIn Corporation. All Rights Reserved. 39
  • 40. Future Considerations So now what?  Automated QA Testing  Package verification after build/install (is the package active)  Further breaking up of our code into multiple bundles – As it grows will there be need for multiple OSGI bundles  services, filters, configs, content, etc.  Build monitoring – Automated deploys w/ fallbacks – Pre production cycle for integration/qa/etc  One stop shop for web devs – Scripts for self serve testing, deploying to production, creating reviews, tagging commits, dependency systems, etc. ©2014 LinkedIn Corporation. All Rights Reserved. 40
  • 41. Thank You Developers Engineers QA Management Nate Yolles Will D. White Alec Sorensen Gilbert Hernandez Thomas Johnston Stephanie Lie Osama Ahmad James Miller Brodie Yazaki Yuin Ee Jefferson Luan Ash Mishra Yogesh Upadhyay Dave Le Nicole Ng Tiffany Saelinh Robert Handley Avanish Sharma Juhi Puri Daniel Apodaca Khanh Nguyen Emily Tran Jennifer Williams Vishu Shetty UED BAM Design LinkedIn Marketing Dept Vinay Dixit Gina Groom Special Thanks To: David Delo Jacob Heuser Eugene O’neill LinkedIn VCIO Steve Johnson Bay Area CQ Meetup LinkedIn Facilities Team LinkedIn Press Team

Hinweis der Redaktion

  1. WelcomeIntroductionThankAmitThank user group
  2. All info taken from press.linkedin.com
  3. You’re all familiar with the LinkedIn website.
  4. It’s not built on CQ. It’s 10+ years of custom code and magic.
  5. As we discuss LinkedIn and it’s mission with Adobe CQ, it’s important to keep two main facts in mind:LinkedIn has 277+ million members>2 new members per second sign up200 countries and territories around the world21 languages and counting3 million companies have pages1st main point: Linked in has a lot of membersMotto: members first
  6. 2nd main point:LinkedIn, like any company, is here to generate revenue. LinkedIn has employees to pay, rent to cover, and shareholders (like you and I) to answer to.A little foreshadowing on how LI uses CQ:Our 3 main revenue streams: Premium, Marketing, and Talent…
  7. And not-so-coincidently, three of our biggest CQ sites are: premium.linkedin.com, marketing.linkedin.com, and talent.linkedin.com
  8. A quick background on the team
  9. UEDUnder UED is BAMMade up of web developers with a wide background of skills focusing on front end skills such as HTML, CSS, and JavaScript.
  10. Our major sites:
  11. And more
  12. We have sites for certain major events and campaigns.We have sites and pages setup daily by our marketing team for any reason they can think of to drive traffic.
  13. Sites were often developed by external agenciesDecided to bring all sites in-house with BAM’s supportSites were built on a number of CMS platformsMostly PHPEvery site required its own codebase, hard to make global updatesConstantly patchingDifferent release processes per CMS
  14. Consultant Recommended:Consultant worked with Marketing Stakeholders and EngineeringIdentified a number of potential enterprise CMS platforms, recommended CQOffered a number of things our authors wanted:Lots of “out of the box” functionalityInline WYSIWYG style authoring interfaceEasy asset management (with the DAM)Instant PublishingThe demo was pretty snazzy
  15. Hired the consultant to deliver our first appUsed their app to launch our first siteFamiliarized ourselves with Java while supporting the appBegan to notice issues as we scaled the appMostly just customized out of the box componentsRequired one application for each siteNot up to LinkedIn coding standardsPotential security vulnerabilities
  16. Contributor Led Effort, in addition to existing workSought out experienced in-house app developers for guidanceUltimately decided to support all sites using a single applicationA global library of componentsUseable in any site contextAble to support non-English sites as wellConcluded that “out of the box” wasn’t good enoughNo more inline JS, CSS, and Java in our JSPs allowedSane authoring experience instead of deep nesting componentsNeeded to work in parallel with the app supporting the first site
  17. Decided to built new instead of extend the existing app Avoid regressions No reliance on backwards compatibilityCleaner directory structure under our appIgnored the “Geomettrix” style directory structureMost pages were built using open “Blank Page” styled templatesTwo open parsys areas – “Hero” and “Content” area“Content Block” style components were easy to drop inComponents are tied more closely to “Content Blocks”Business logic for components was moved to _init.jsp files – moving to actual java classes per componentPresentational logic was removed or converted to c:tagsBegan splitting JSP files into reusable partials
  18. Just show for 10~ seconds or so.
  19. Just show for 10~ seconds or so.
  20. Just show for 10~ seconds or so.
  21. Just show for 10~ seconds or so.
  22. Just show for 10~ seconds or so.
  23. Just show for 10~ seconds or so.
  24. Just show for 10~ seconds or so.
  25. Just show for 10~ seconds or so.
  26. Members firstSecurityHackers may see subdomains as a backdoorContent authors author content. Not the look or feel.
  27. Content authors author content. Not the look or feel.
  28. SVN + FILEVAULTAlready on SVN so stayed with it. Filevault was suggested by the vendor.It was a complicated processNo real understanding of filevault (no vlt revert #SHA abilities)Overriding and erasing of work due to complicated interactions between vault/svn/cqSvn up + vlt add/ci doesn’t work (vlt want’s you do to vlt up first) vlt up would change all the things that you brought down from svn
  29. Moved to GIT-SVN + VLTUsed git-svnvsgit because our rb system was already integrated with svn and much easier to get aligned w/ other teams
  30. Primarybenefits came from the mvn build process - ready benefits (easier integration/configuration of new processes)Secondary benefits came from branch dev - branchin