BROUGHT TO YOU IN PARTNERSHIP WITH DZONE.COM/GUIDES DZONE’S GUIDE TO WEB DEVELOPMENT: APPLICATIONS AND FRAMEWORKS, VOLUME I DEAR READER, TABLE OF CONTENTS Welcome to the first edition of the DZone Web Developer Guide and our 12th DZone Research Guide of 2016. At the end of each 3 EXECUTIVE SUMMARY year I often reflect on the past months. The rate of change around BY MATT WERNER web development has been increasing. Hardly a day goes by where 4 KEY RESEARCH FINDINGS we don’t see a new framework, or a new technique. Methods that BY G. RYAN SPAIN seemed advanced when we overhauled DZone.com just 1.5 years 8 FUNCTIONAL REACTIVE UI PROGRAMMING ago, seem much more commonplace now. And who remembers BY MICHAEL HEINRICHS “Web 2.0?” That seems like ancient history today, when in truth it was just a few short years ago. 10 TOTALLY MODULAR, DUDE! BY BILL SOUROUR The world of Web Development is growing. JavaScript, and other 13 CHECKLIST: DEBUGGING JS WITH THESE 10 TIPS front-end technologies, are by far the most popular languages BY FREYJA SPAVEN & DANIEL WYLIE on Stack Overflow. The DZone Web Dev portal has been steadily growing, and is now our second most popular portal. Modern-day 14 INFOGRAPHIC: SURVIVAL INSTINCTS: MOST TRUSTED web development spans both the front-and the back-end. Today, TECH FOR THE WEB DEV JUNGLE the full-stack developer often reaches into their toolbox and pulls 16 ADDING AUTHENTICATION TO A WEB APPLICATION out JavaScript, as tools like Node.js allow the developer to leverage WITH AUTH0, REACT, AND JWT a single language across the entire stack—allowing for focus and BY JOSÉ AGUINAGA productivity. The number of developers familiar with JavaScript 19 DIVING DEEPER INTO WEB DEV ensures that your projects will have an easier time finding qualified people as well. 22 EXECUTIVE INSIGHTS ON WEB APPLICATION DEVELOPMENT BY TOM SMITH With a low barrier to entry, many new developers (and experienced ones as well) are building web applications. Looking back to our 24 EMBRACING SIMPLICITY WITH STATIC SITE GENERATORS recent Application Security Guide, XSS (Cross-Site Scripting) BY RAYMOND CAMDEN and other front-end attacks are the most prevalent. How will we 27 WEB DEV SOLUTIONS DIRECTORY enforce security in this fast-moving and fast-growing world where new frameworks appear nearly daily? As we begin to rely more and 31 GLOSSARY more on third-party APIs, how do we ensure that those services are following the best practices to secure our data? Are we up to the MARKETING EDITORIAL BUSINESS task of training this next generation of developers on the security KELLET ATKINSON CAITLIN CANDELMO RICK ROSS DIRECTOR OF MARKETING DIRECTOR OF CONTENT + CEO requirements of the modern web? COMMUNITY LAUREN CURATOLA MATT SCHMIDT MARKETING SPECIALIST MATT WERNER PRESIDENT & CTO This guide attempts to answer some of these questions and more, CONTENT + COMMUNITY MANAGER JESSE DAVIS starting by walking you through some of the research findings that KRISTEN PAGÀN EVP & COO MARKETING SPECIALIST MICHAEL THARRINGTON we discovered while talking to our audience and then diving into CONTENT + COMMUNITY MANAGER MATT O’BRIAN NATALIE IANNELLO DIRECTOR OF BUSINESS some great articles by industry experts. It is to-the-point and one MARKETING SPECIALIST NICOLE WOLFE DEVELOPMENT of the most technically deep guides that we have published. CONTENT COORDINATOR [email protected] MIKE GATES ALEX CRAFTS PRODUCTION DIRECTOR OF MAJOR ACCOUNTS The articles are filled with code snippets and examples on CONTENT COORDINATOR CHRIS SMITH JIM HOWARD topics from arranging your projects more effectively and tips DIRECTOR OF PRODUCTION SARAH DAVIS SR ACCOUNT EXECUTIVE for debugging your JavaScript, to being able to host sites or even CONTENT COORDINATOR ANDRE POWELL JIM DYER SR. PRODUCTION COORDINATOR handle user management and authentication all without running TOM SMITH ACCOUNT EXECUTIVE RESEARCH ANALYST a server. Some in the industry will say that this is the way of the G. RYAN SPAIN ANDREW BARKER PRODUCTION PUBLICATIONS EDITOR future—everything delegated to third-party services. Time will ACCOUNT EXECUTIVE CHRIS BRUMFIELD tell—and given the rate of change lately, I imagine that time will ASHLEY SLATE ACCOUNT MANAGER DESIGN DIRECTOR be soon! ANA JONES ACCOUNT MANAGER Thank you for reading the first edition of The DZone Guide to Web Development, and thank you to all our sponsors and contributors WANT YOUR SOLUTION TO BE FEATURED IN SPECIAL THANKS who helped make this year’s series be the best one yet. Happy COMING GUIDES? to our topic experts, Please contact [email protected] for submission Holidays to everyone and I hope you enjoy reading this guide as Zone Leaders, trusted information. DZone Most Valuable much as we enjoyed making it! Bloggers, and dedicated LIKE TO CONTRIBUTE CONTENT TO COMING GUIDES? Please contact [email protected] for consideration. users for all their BY MATT SCHMIDT help and feedback in PRESIDENT & CTO AT DZONE INTERESTED IN BECOMING A DZONE RESEARCH making this report a PARTNER? great success. [email protected] Please contact [email protected] for information. 2 DZONE’S GUIDE TO WEB DEVELOPMENT: APPLICATIONS AND FRAMEWORKS, VOLUME I DZONE.COM/GUIDES DZONE’S GUIDE TO WEB DEVELOPMENT: APPLICATIONS AND FRAMEWORKS, VOLUME I DOMINANT TECHNOLOGIES EMERGE DATA Across several questions, clear technological favorites Executive emerged. For instance, Chrome was the most popular browser to develop for vs. second-place Firefox (96% to 77%). For package management, npm is used more than bower (59% to 37%), for testing, Selenium is used more than Jasmine (64% to 31%), and Summary for real-time streaming apps, WebSocket API (77%) was used far more than the next most popular method: polling (32%). IMPLICATIONS While there may be debates over the quality of BY MATT WERNER CONTENT AND COMMUNITY MANAGER, DZONE one tool or framework versus another, tools like jQuery, used by 84% of respondents, and AngularJS can quickly become the dominant technology in a particular category. This can While the launch of smartphones has truly changed be due to the strength of the community, documentation, or the world, most of us interact with the online world familiarity with older tools, such as jQuery or MySQL. through web apps rather than mobile apps. JavaScript in particular has been one of the most important RECOMMENDATIONS Keeping up with what’s considered technologies in modern web development, allowing the most popular language or technology is essential for web developers in the market, as these are skills that will web apps to have similar capabilities as native be easily transferable between projects or jobs. However, mobile apps. In our first annual web dev survey, 97% as demonstrated by the statistically significant number of of respondents said they wrote JavaScript for the respondents who were unhappy with Angular 1, the most browser, compared to 39% for mobile-only or 26% for popular JavaScript framework, the most popular tool may not hybrid mobile apps. The prevalence of responsive be the best, so it would behoove developers to explore other design has also kept web apps relevant, as it’s now options either at work or in their spare time. standard practice to design responsive sites to adapt to any screen or device. To discover what developers MORE FOCUS ON THE BACKEND were using for their web development needs, DZone DATA 97% of developers said they work on the browser, 39% surveyed 598 developers and tech professionals across said they do server side. 56% said they worked on the full the world, most of whom had extensive experience stack, and only 8% work mostly on the front end. working at companies with over 100 people. IMPLICATIONS More web development is being done on the backend except in the cases of mobile web development, IS ANGULAR 1 DEAD? where more is done on the frontend. Since more and more DATA Angular was the most popular framework among developers have determined that capabilities like business respondents (69%). 19% of total respondents who have used logic and enterprise integration should be relegated to the Angular 1 would not use it again. Less than 1% of users have backend, more web developers need to have a knowledge of used either Angular 2 or React and would not use either again. full-stack development. IMPLICATIONS Angular 1 took the development world by RECOMMENDATIONS It’s clear from the data that most web storm, but its issues have been well-documented, and there developers need a knowledge of full-stack development. is a statistically significant difference between the number of Continued education into new technologies like Node. users unhappy with Angular 1 over the next two most popular js or Express.js will be essential to staying competitive client-side frameworks: React and Angular 2. in the job market and adding functionality to web apps. 53% of respondents already deliberately switch frontend RECOMMENDATIONS Angular 1 is clearly not without its and backend development roles to build full-stack skills. faults. The Angular team has attempted to address them in In addition, DZone research has found that full-stack Angular 2, which was released in mid-2016. If developers developers are more likely to expand their knowledge of web are finding that they have a lot of issues with their Angular development. For example, full-stack developers are more 1 applications, Google has extensive documentation on focused on responsive design than backend developers (95% how to use Angular 2’s migration tools. Based on audience vs. 89%), and are more likely to use newer JS features such as responses, the satisfaction with Angular 2 is high, and it may modules and classes than developers who only work on the be worth the time to migrate Angular 1 apps.