Drupal, React, web development and geek stuff #2

01.04.2018

5 min.

In the second post in our ongoing blog series 'Drupal, React, web development' we have collected some of the best links from our internal developer communication organised by topics. There are lots of good reading suggestions about design and frontend development, decoupled development, Drupal development and lots off geek stuff.

Linux’izing your Windows PC into a dev machine

On 30th of March 2016 hell officially froze. Microsoft, the eternal rival of the open source movement, has officially announced that form now on you can run Linux apps on Windows! Just like that.

Those of you who are in IT for years may recall a famous sentence Steve Ballmer, former CEO of Microsoft, said in 2001. He called Linux a “cancer that attaches itself in an intellectual property sense to everything it touches”. Well, times have changed, and so have the large companies.

https://cepa.io/2018/02/10/linuxizing-your-windows-pc-part1/

Building your own CDN for Fun and Profit

Are you amazed by CDN technologies, or did you always have the feeling, that this can't be that complicated?

Fresh from the hold-my-beer department, why don't we build our own little CDN? Here is how https://pasztor.at/blog/building-your-own-cdn

Visualizing Git commits with gource.io

This is a fun tool, simply install gource.io and let it analyze your Git repository and get something like this: Visualization of development of deGov in 2017.

Cool things you can do with Git

Git can be customized in many ways. Didn't you always want to praise people instead of blame people for their work. This and more can be found in https://csswizardry.com/2017/05/little-things-i-like-to-do-with-git/.

Frontend Development

Animated unsubscribe

Here is a nice technical solution for building an animated unsubscribe page with CSS and JS. The anmation gets more sad as you unsubscribe. It is fun to use, try it out out on https://codepen.io/agathaco.

Eliminate content repaints with the new Layers panel in Chrome

Alright, so what exactly is the difference between reflows and repaints? Are they bad, and how can they be optimized?

Well Google Chrome provides tools for this, this interesting blogpost is described how.

Chrome extension Lighthouse

Since we are already talking about chrome: Lighthouse is another great extension.

Lighthouse is an open-source, automated tool for improving the performance, quality, and correctness of your web apps.

When auditing a page, Lighthouse runs a barrage of tests against the page, and then generates a report on how well the page did. From here you can use the failing tests as indicators on what you can do to improve your app.

Improve Drupal's first impression: Out of the box initiative

Installing Drupal currently gives you a mostly empty box. There is no demo content nor much preconfigured functionality. This makes for a weak first impression and makes it hard for the evaluator to connect the dots and find out what Drupal can do for them.

The Out of the Box Experience initiative (OOTB) aims to improve this situation.

Here is a nice blogpost about the awesome umamy installation profile: https://jmolivas.com/try-drupal-85-and-umami-profile-using-one-command

Smooth Scrolling

Here is a nice write up on smooth scrolling to anchors both with jQuery and native.

Cheating at Design

This is one of my favourite reads in the lasts months. Here are some tips for non-designers to optimize design in a blog post called 7 Practical Tips for Cheating at Design

React, Javascript, and decoupled Drupal

There is a lot of momentum with Drupal and React at the moment.

In case you missed it, here is Dries' blog post about it: Drupal looking to adopt React

And there is also this very nice overview of blog posts and activities regarding Dupal and react on https://reactfordrupal.com/.

Building Secure JavaScript Applications

Since Drupal is being used as a decoupled backend, we need to think about securing our decoupled applications.

Here is a good read about mitigating risks like XSS and CSFR in javascript applications: https://nemethgergely.com/blog/building-secure-javascript-applications

Modern Javascript and Asynchronous Programming: Generators/Yield vs. Async/Await

In case you ever wondered about Generators/Yield vs. Async/Await, here is a blog post about it: https://nemethgergely.com/blog/building-secure-javascript-applications

Should I Re-use Existing Drupal Fields?

We always face the problem, if existing Drupal fields should be re-used. I have participated in many esoteric discussions about optimized database schemas vs. creating new fields for every single entities.

In a nutshell: It is often better to create more fields than less. Heres why: https://www.ostraining.com/blog/drupal/re-using-drupal-fields/

Implementing #autocomplete in Drupal 8 with Custom Callbacks

This on is a nice cookbook howto create your own autocomplete text-fields, comes handy when you need it: https://www.qed42.com/insights

How to generate PDF of HTML code in Drupal 8

Most likely you have done it many times already. But never with mpdf/mpdf, right? mPDF is a smart library that considers the CSS attached to the HTML.

This blogpost shows hot to integrate mPDF with Drupal.