Drupal 8 in a nutshell at TechCaravan

Drupal 8
- Intro
- History
- Manny Pacquiao
- Site Building
- Mobile Responsive
- New Updates 8.2.x

Transcript

1. Drupal 8 in a nutshell Zamboanga Tech Caravan @ STI College Zamboanga
7. Who Am I ? Customer Success Engineer Pantheon Performance & Application Former Senior Developer X-Team Former IT Consultant World Bank Former Senior Developer New Amsterdam Ideas (NuCivic now) Weston Ruter Technology Director, XWP
8. Make something amazing, for anyone
9. What is Drupal? Drupal is open source content management software maintained and developed by a community of more than 35,000 developers around the world who have contributed to the project. It is distributed under the terms of the GNU General Public License (or "GPL"), which means anyone is free to download it and share it with others.
10. What is Open Source? The defining principle of open source is that anyone can sell services and products created with the software, but not the software itself.
11. Who uses Drupal? ...and more than a million other organizations
12. Drupal CMS is best for Mobile Responsive Sites
31. http://www.harvard.edu/
46. It’s mobile-first
47. Responsive themes, images, breakpoints
48. Mobile-friendly administration
49. Represent this with a video. Maybe from Dries’ Prague slides? :) AB: Submitted to the DA via their webform, since unfortunately it has to be on YouTube in order to reference from here. Bleh. http://www.youtube.com/watch?v=ipOc1km2uEc Improved accessibility
50. Mobile-first “overlay”
51. We can finally manage our sites on our iPhones or Android tablets without pulling our hair out
52. Breakpoint 1. Is a module that comes with core but is not enabled by default. 2. During the process of developing Drupal 8 and adding features. 3. Responsive Image module requires Breakpoint, as it uses the breakpoints that are coded into the theme along with image styles to re-size the images appropriately. 4. Much like Breakpoint though, just enabling it doesn’t cause magical things to happen with your images on the site. 5. There is still configuration that must be set up, but unlike Breakpoint there is a user interface to do your configuration.
53. Responsive Image 1. Ability to make our site change at different sizes. 2. This doesn't necessarily instantly make your site responsive. 3. Breakpoint simply gives you a nice built-in way to identify and use your breakpoints. 4. The real work that still needs to be done is in your theme itself, which requires time by a front end developer and a site builder to actually create a responsive theme.
54. Understanding the responsive regions
55. Flow and Stacked Regions There are two special kinds of regions in Open Framework that help us create complex layouts, "flow" regions and "stacked" regions. These types of regions are found within the Content section of the page template. Flow Regions Stacked Regions
56. Views = fully customizable... With the Drupal 8 views, you can customize: Admin listings Sidebar content Image galleries Slideshows REST output ...with 0 lines of code!
57. Restyled administration interface
58. Multilingual improvements in Drupal 8
59. Community translation downloads
60. Language data tracking expanded
61. Translation on (almost) everything
62. How will having a responsive website help your business ?
63. How will having a responsive website help your business ? Your website is the first thing a lot of your customers will see before even entering your physical store, assuming you have one. From a marketing perspective, a responsive website can enhance the effectiveness of your marketing campaign by allowing potential customers to instantly connect with you.
64. How will having a responsive website help your business ? More than 60% of all traffic on the internet is from mobile devices. There are also more mobile devices today, than people, on the earth. 4 in 5 individuals access their retail options on their mobile phones. Approximately 40% of the browsing public will return to their search page if the first option they clicked on was not mobile-friendly.
66. HTML5 Form Elements
67. New front-end libraries
68. Twig Example: node.html.twig <article{{ attributes }}> {{ title_prefix }} {% if not page %} <h2{{ title_attributes }}> <a href="{{ url }}" rel="bookmark">{{ label }}</a> </h2> {% endif %} {{ title_suffix }} {% if display_submitted %} <footer class="node__meta"> {{ author_picture }} <div class="node__submitted {{ author_attributes.class }}"{{ author_attributes|without('class') }}> {% trans %}Submitted by {{ author_name|passthrough }} on {{ date }}{% endtrans %} {{ metadata }} </div> </footer> {% endif %} <div class="node__content {{ content_attributes.class }}"{{ content_attributes|without('class') }}> {{ content|without('links') }} </div> {% if content.links %} <div class="node__links"> {{ content.links }} </div> {% endif %} </article> 1. HTML5 tags 2. {{ print a variable }} 3. {% logic(stuff) %}
69. Native Schema.org Output
70. Killed support for IE 6 & 7 (and most of 8)
71. Drupal 8 improvements for developers
72. Configuration management dev stage production
75. Let’s see it in action. https://github.com/webchickenator/drupal8-demo
76. Web services other systems or frameworks desktop Android applications other Drupal sites Flash components iPhone applications kiosk applications
77. Not invented here "Proudly Found Elsewhere" Much more modern, object-oriented code (classes, inheritance, interfaces, etc.) Embracing latest PHP standards (e.g. PSR-0, namespaces, traits) Using many “best of breed” external libraries: Composer, PHPUnit, Guzzle, Zend Feed Component...
78. More than 3,300 people contributed to Drupal 8!