SlideShare a Scribd company logo
1 of 16
Download to read offline
How To Pass a Front-End
          Developer Interview
          Getting the Job




Friday, February 8, 13
About Me

                Grew Up
                School
                Work
                Experience
                                              San Antonio
                                           IT 2000+ #1 in IT
                                           2010,2011,2012
                             http://www.computerworld.com/s/article/9227900/The_No._1_Place_to_Work_in_IT_USAA

Friday, February 8, 13
What I'm not going to talk about
            http://www.nczonline.net/blog/2007/03/27/surviving-an-interview-with-me/
            http://www.nczonline.net/blog/2010/01/05/interviewing-the-front-end-engineer/




Friday, February 8, 13
Story About a Struggle




Friday, February 8, 13
Overview
                Code Skills i look for
                Back 2 Basics
                Be an Enterprise Coder




Friday, February 8, 13
Code Skills
          “The List”
                Everyone has them (Req’s sheet)
                Know it all but don't be expected to explain them all


JAVASCRIPT: DOM-Structure JSON SVG AJAX Closures
XMLhttpRequest Prototype Constructors Events Undefined
Type-Conversion Operators DOM-Manipulation Event-
Bubbling ECMASCRIPT MVC Design-Patterns Object Oriented
loosely typed CSS: Positioning Block-vs-Inline Cross-
Browser Selectors Inheritance CSS3 Box-Model DOM SVG
Selector Priority Mobile CSS2 Pseudo-Selector OOCSS
Prefixes Floating HTML: XML XHTML DOCTYPE accessibility
ADA DHTML Page Performance
Friday, February 8, 13
Get Back to Basics!
          Know the fundamentals well enough to teach.




Friday, February 8, 13
Back To Basics
          My Observations

                     Front-End Developer need to know JS CSS HTML
                     well
                     Understand page performance and your codes
                     impact http://developer.yahoo.com/yslow/
                              https://developers.google.com/speed/pagespeed

                     Don't be tied to any one framework or library
                         (css or js)



Friday, February 8, 13
Back 2 Basics
          CSS Priority
                                               #myID{color:red}
                                             .myClass{color:blue}
                                                p{color:green}

     <p id=”myID” class=”myClass”>text inside< p>


                          What Color should the Text in the
                               paragraph be & WHY?
MORE INFO @ http://coding.smashingmagazine.com/2007 /27
                                                     /07 /css-specificity-things-you-should-know/
            http://www.w3.org/TR/CSS21/cascade.html#specificity
            http://docs.webplatform.org/wiki/tutorials/inheritance_and_cascade
Friday, February 8, 13
Back to Basics
          CSS BOX MODEL
                     How Does it all work
                     together
                     How are the default
                     behaviors of <div> &
                     <span> different
                     & WHY




MORE INFO @ http://www.w3.org/TR/CSS2/box.html
            http://docs.webplatform.org/wiki/guides/the_css_layout_model

Friday, February 8, 13
Back to Basics
          Javascript Variable Scope
    <script type="text/javascript">
     function makeVariables() {
       variable1 = 1;
       var variable2 = 2;
     }
    </script>

                                         Which Variable has been
                                          made public & WHY?
   MORE INFO @ https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/var

Friday, February 8, 13
Back to Basics
          PURE Javascript
          JavaScript !== JQuery

                     Native JS Dom manipulation (document.*)
                     Understanding what $ Does
                     Don't anchor your skills to a framework




Friday, February 8, 13
i want you to...
          Be an Enterprise Coder


                Don't Build Selfish Software (DBSS)
                Write code that is :
                re-usable, configurable, testable
                Open Source some code on Git-Hub




Friday, February 8, 13
The BIG Picture

          1.Get Back to Basics
          2.Learn the WHY
          3.Be an Enterprise Coder


Friday, February 8, 13
Recommend




                           Reads
Friday, February 8, 13
‘s
 - Twitter @djscoutmaster
 - USAA is Hiring http://tinyurl.com/usaahtml5
Friday, February 8, 13

More Related Content

Similar to Passing a Front end Developer interview

Front-End Performance Starts On the Server
Front-End Performance Starts On the ServerFront-End Performance Starts On the Server
Front-End Performance Starts On the ServerJon Arne Sæterås
 
Tek 2013 - Building Web Apps from a New Angle with AngularJS
Tek 2013 - Building Web Apps from a New Angle with AngularJSTek 2013 - Building Web Apps from a New Angle with AngularJS
Tek 2013 - Building Web Apps from a New Angle with AngularJSPablo Godel
 
JavaScript Dependencies, Modules & Browserify
JavaScript Dependencies, Modules & BrowserifyJavaScript Dependencies, Modules & Browserify
JavaScript Dependencies, Modules & BrowserifyJohan Nilsson
 
Moving from Web 1.0 to Web 2.0
Moving from Web 1.0 to Web 2.0Moving from Web 1.0 to Web 2.0
Moving from Web 1.0 to Web 2.0Estelle Weyl
 
Php My Sql Security 2007
Php My Sql Security 2007Php My Sql Security 2007
Php My Sql Security 2007Aung Khant
 
SQL Server Scheduling Basics
SQL Server Scheduling BasicsSQL Server Scheduling Basics
SQL Server Scheduling BasicsAmit Banerjee
 
JSDay 2013 - Practical Responsive Web Design
JSDay 2013 - Practical Responsive Web DesignJSDay 2013 - Practical Responsive Web Design
JSDay 2013 - Practical Responsive Web DesignJonathan Klein
 
HTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of Things
HTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of ThingsHTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of Things
HTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of ThingsJesse Cravens
 
Silicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NET
Silicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NETSilicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NET
Silicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NETMats Bryntse
 
Movable Type Seminar 2011
Movable Type Seminar 2011Movable Type Seminar 2011
Movable Type Seminar 2011Six Apart KK
 
The Server Side of Responsive Web Design
The Server Side of Responsive Web DesignThe Server Side of Responsive Web Design
The Server Side of Responsive Web DesignDave Olsen
 
RESUME NAMITA (1)
RESUME NAMITA (1)RESUME NAMITA (1)
RESUME NAMITA (1)Namita Paul
 
Intro to-html-backbone-angular
Intro to-html-backbone-angularIntro to-html-backbone-angular
Intro to-html-backbone-angularzonathen
 
Front end performance improvements
Front end performance improvementsFront end performance improvements
Front end performance improvementsMatthew Farina
 

Similar to Passing a Front end Developer interview (20)

Front-End Performance Starts On the Server
Front-End Performance Starts On the ServerFront-End Performance Starts On the Server
Front-End Performance Starts On the Server
 
Building Web Hack Interfaces
Building Web Hack InterfacesBuilding Web Hack Interfaces
Building Web Hack Interfaces
 
Tek 2013 - Building Web Apps from a New Angle with AngularJS
Tek 2013 - Building Web Apps from a New Angle with AngularJSTek 2013 - Building Web Apps from a New Angle with AngularJS
Tek 2013 - Building Web Apps from a New Angle with AngularJS
 
JavaScript Dependencies, Modules & Browserify
JavaScript Dependencies, Modules & BrowserifyJavaScript Dependencies, Modules & Browserify
JavaScript Dependencies, Modules & Browserify
 
Moving from Web 1.0 to Web 2.0
Moving from Web 1.0 to Web 2.0Moving from Web 1.0 to Web 2.0
Moving from Web 1.0 to Web 2.0
 
Php My Sql Security 2007
Php My Sql Security 2007Php My Sql Security 2007
Php My Sql Security 2007
 
SQL Server Scheduling Basics
SQL Server Scheduling BasicsSQL Server Scheduling Basics
SQL Server Scheduling Basics
 
Coding the UI
Coding the UICoding the UI
Coding the UI
 
Coding Ui
Coding UiCoding Ui
Coding Ui
 
JSDay 2013 - Practical Responsive Web Design
JSDay 2013 - Practical Responsive Web DesignJSDay 2013 - Practical Responsive Web Design
JSDay 2013 - Practical Responsive Web Design
 
4-identifying-problems.pdf
4-identifying-problems.pdf4-identifying-problems.pdf
4-identifying-problems.pdf
 
Untangling7
Untangling7Untangling7
Untangling7
 
HTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of Things
HTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of ThingsHTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of Things
HTML5.tx 2013: Embedded JavaScript, HTML5 and the Internet of Things
 
Silicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NET
Silicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NETSilicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NET
Silicon Valley CodeCamp 2008: High performance Ajax with ExtJS and ASP.NET
 
Movable Type Seminar 2011
Movable Type Seminar 2011Movable Type Seminar 2011
Movable Type Seminar 2011
 
HTML5 Intro
HTML5 IntroHTML5 Intro
HTML5 Intro
 
The Server Side of Responsive Web Design
The Server Side of Responsive Web DesignThe Server Side of Responsive Web Design
The Server Side of Responsive Web Design
 
RESUME NAMITA (1)
RESUME NAMITA (1)RESUME NAMITA (1)
RESUME NAMITA (1)
 
Intro to-html-backbone-angular
Intro to-html-backbone-angularIntro to-html-backbone-angular
Intro to-html-backbone-angular
 
Front end performance improvements
Front end performance improvementsFront end performance improvements
Front end performance improvements
 

Passing a Front end Developer interview

  • 1. How To Pass a Front-End Developer Interview Getting the Job Friday, February 8, 13
  • 2. About Me Grew Up School Work Experience San Antonio IT 2000+ #1 in IT 2010,2011,2012 http://www.computerworld.com/s/article/9227900/The_No._1_Place_to_Work_in_IT_USAA Friday, February 8, 13
  • 3. What I'm not going to talk about http://www.nczonline.net/blog/2007/03/27/surviving-an-interview-with-me/ http://www.nczonline.net/blog/2010/01/05/interviewing-the-front-end-engineer/ Friday, February 8, 13
  • 4. Story About a Struggle Friday, February 8, 13
  • 5. Overview Code Skills i look for Back 2 Basics Be an Enterprise Coder Friday, February 8, 13
  • 6. Code Skills “The List” Everyone has them (Req’s sheet) Know it all but don't be expected to explain them all JAVASCRIPT: DOM-Structure JSON SVG AJAX Closures XMLhttpRequest Prototype Constructors Events Undefined Type-Conversion Operators DOM-Manipulation Event- Bubbling ECMASCRIPT MVC Design-Patterns Object Oriented loosely typed CSS: Positioning Block-vs-Inline Cross- Browser Selectors Inheritance CSS3 Box-Model DOM SVG Selector Priority Mobile CSS2 Pseudo-Selector OOCSS Prefixes Floating HTML: XML XHTML DOCTYPE accessibility ADA DHTML Page Performance Friday, February 8, 13
  • 7. Get Back to Basics! Know the fundamentals well enough to teach. Friday, February 8, 13
  • 8. Back To Basics My Observations Front-End Developer need to know JS CSS HTML well Understand page performance and your codes impact http://developer.yahoo.com/yslow/ https://developers.google.com/speed/pagespeed Don't be tied to any one framework or library (css or js) Friday, February 8, 13
  • 9. Back 2 Basics CSS Priority #myID{color:red} .myClass{color:blue} p{color:green} <p id=”myID” class=”myClass”>text inside< p> What Color should the Text in the paragraph be & WHY? MORE INFO @ http://coding.smashingmagazine.com/2007 /27 /07 /css-specificity-things-you-should-know/ http://www.w3.org/TR/CSS21/cascade.html#specificity http://docs.webplatform.org/wiki/tutorials/inheritance_and_cascade Friday, February 8, 13
  • 10. Back to Basics CSS BOX MODEL How Does it all work together How are the default behaviors of <div> & <span> different & WHY MORE INFO @ http://www.w3.org/TR/CSS2/box.html http://docs.webplatform.org/wiki/guides/the_css_layout_model Friday, February 8, 13
  • 11. Back to Basics Javascript Variable Scope <script type="text/javascript"> function makeVariables() { variable1 = 1; var variable2 = 2; } </script> Which Variable has been made public & WHY? MORE INFO @ https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/var Friday, February 8, 13
  • 12. Back to Basics PURE Javascript JavaScript !== JQuery Native JS Dom manipulation (document.*) Understanding what $ Does Don't anchor your skills to a framework Friday, February 8, 13
  • 13. i want you to... Be an Enterprise Coder Don't Build Selfish Software (DBSS) Write code that is : re-usable, configurable, testable Open Source some code on Git-Hub Friday, February 8, 13
  • 14. The BIG Picture 1.Get Back to Basics 2.Learn the WHY 3.Be an Enterprise Coder Friday, February 8, 13
  • 15. Recommend Reads Friday, February 8, 13
  • 16. ‘s - Twitter @djscoutmaster - USAA is Hiring http://tinyurl.com/usaahtml5 Friday, February 8, 13