Some interesting and useful things for web developer # 40

Good day, dear habravchane. Recently, I saw some interesting and useful tools / libraries / events that I want to share with Habr.

NativeScript

An open framework for creating mobile applications for iOS, Android and Windows Phone based on NodeJS. And the whole tsimus is that this is not just another cross-platform wrapper over WebView (ala PhoneGap), NativeScript from the words of the developers provides the same features in JavaScript that native Native Objective-C, Java or .NET provide.
')
I also want to mention NW.js , which before IO.js appeared was called Node-Webkit. The project on the same principle allows you to write desktop applications under Windows, Mac and Linux using web technologies. Moreover, microcontrollers, smart houses, Internet of things, Oculus Rift, Nest release API on JS. Recalling all this news, I would like to say that JavaScript is more and more often presented as a unified tool for cross-platform development.

Doppler.js

Most likely, at the moment the project does not have any practical value, but it is certainly wildly interesting as an example of the implementation of the Doppler effect using the Web Audio API. The bottom line is that by analyzing the sound waves, you can control the interface. You can scroll on the demo page with a wave of your hand above the microphone.

Swiper.js

Excellent slider sharpened strictly for working with mobile sites or web applications. Swiper provides hardware acceleration of animation at the native level. The project in a few days gathered more than 3,000 stars on GitHub.

<!-- Slider main container --> <div class="swiper-container"> <!-- Additional required wrapper --> <div class="swiper-wrapper"> <!-- Slides --> <div class="swiper-slide">Slide 1</div> <div class="swiper-slide">Slide 2</div> <div class="swiper-slide">Slide 3</div> ... </div> <!-- If we need pagination --> <div class="swiper-pagination"></div> <!-- If we need navigation buttons --> <div class="swiper-button-prev"></div> <div class="swiper-button-next"></div> <!-- If we need scrollbar --> <div class="swiper-scrollbar"></div> </div> 

 var mySwiper = app.swiper('.swiper-container', { speed: 400, spaceBetween: 100 }); 

Slideout.js

The easiest way to make a drop-down sidebar for a mobile site. Slideout does not depend on third-party libraries, just to customize and weighs only 4kb.

 <nav id="menu"> <header> <h2>Menu</h2> </header> </nav> <main id="panel"> <header> <h2>Panel</h2> </header> </main> 

  var slideout = new Slideout({ 'panel': document.getElementById('panel'), 'menu': document.getElementById('menu'), 'padding': 256, 'tolerance': 70 }); 

SVGOMG - SVGO GUI

Western thoughts or what would translate to Habré:

• How to Create (Animated) Text Fills
• Things I've Learned About Email Sending, for Web Designers and Developers
• Introducing node-firefox
• Embracing Promises in JavaScript
• Improving your HTML5 App
• Designers: Start Coding With uilang
• TimelineMax: A Primer
• Terrible JavaScript Mistakes To Avoid With A Static Code Analyzer
• Progressive Javascript
• Making a Single Page App Without a Framework
• Using ServiceWorker in Chrome today
• Style Guide Generator Roundup
• 60fps on the mobile web
• Printing Medium stories
• Design Last

They say and show domestic IT resources:

• "Principles of writing homogeneous HTML"
  “Using requestAnimationFrame” from Forwebdev.
• “CSS Animation Performance: The Untold Story” by CSS Live.
• “Everything you need to know about the will-change CSS property” from Frontender.info.
• “If you decide to switch from PHP to Python, then what should you prepare for?” From gnomeby
• “Resize images in the browser. Everything is very bad " by homm
• "30 wonderful libraries for PHP programmers" from mnv
• “Making an online cinema for the blind (WCAG 2.0 AAA)” by gsuvorov
• "Communication scripts from different browser tabs" by SLY_G
• “Writing plugin for October CMS” by ivaaaan
• “Visualize this” by karmatsky
• Quantitative CSS selectors by alspaladin
• "The magic of a single div. Masterclass from the creator of a.singlediv.com " by Irina_Ua
• "Layout email newsletters from A to Z for dummies" by Varhal
• "Introduction to Apache Spark" by akrot
• "Restarting the daemon in PHP without losing connections to it" from youROCK
• “How it works: the architecture of the satellite backing of Satellite maps” by jonik

Finally:

• HTML / CSS
  • Flexbox in 5 minutes
  • CSSNext - converts tomorrow's CSS to today.
  • ai2html - a script for converting Adobe Illustrator files to HTML.
  • RIN is another Gulp-based template, SASS with Live Reload and more.
• Javascript
  • Cool javascript knowledge test from bakhirev habrauser .
  • Cheerio is a fast and flexible jQuery implementation for the server side.
  • underlineJS is a more elegant way to underline text.
  • Alasql.js is a client SQL-like database with support for localStorage, IndexedDB and Excel.
  • Yaspeller is a utility for checking typos in the text based on Yandex.Speller.
  • lz-string - LZ-based compression algorithm.
  • Msngr.js is a miniature library for developing messengers.
  • Stickshift is a simple and convenient interface for working with SQL.
• Php
  • PHP Must Watch - a collection of the best videos from lectures and PHP conference.
  • Mondrian is a static code analysis tool based on Graph Theory.
  • Regexpbuilderphp - human-readable regular expressions for PHP 5.3+.
• Python
  • Flashlight is a terrific project that transforms Spotlight on your Mac.
  • Mkcast is a great tool for creating Gif screencasts.
  • Vim Hackernews - read HN with Vim.
• Ruby
  • Merit - heme for reputation system in Rails (badges, points, achievements).
  • Ruby 2.2.1 Release
  • We implement the Enigma (encryption machine since the Second World War) on Ruby.
  • Why blocks inhibit methods by 439% .
  • We write CLI applications using GLI .
  • On the dangers of openuri .
• Go
  • Gore is a beautiful REPL for Go.
  • Gosms is your own local SMS gateway.
  • Termui is a library for creating CL dashboards.
  • OS is the easiest way to use Docker in production.
• miscellanea
  • oh-my-git - improve CL perception when working with Git.
  • Release Passenger 5.0.4 - can now be used in production.
  • GTA2-WebGL - a project whose goal is to port GTA2 to the web.

For help in preparing the material I express my deep gratitude to Alexander Maslov drakmail .

Friends backenders! I think everyone knows that I am doing my compilations entirely on altruism. I always went through a bunch of websites to make it always convenient to work. And at one point I decided to share the material found. Over time, collections have gained some popularity and significantly expanded in terms of content. From now on, I will clearly structure the “Finally” block so that people do not have to look for what they need. In order for the sections not to be bare and always filled with relevant information, I need your help. And the problem is not only in time, but also in competence. In terms of backend, I am rather a theorist than a practitioner.

Pkhshshnik, rubist , pythonist, goschik , if you already monitor GitHub Trending, Reddit, HackerNews or Twitter in search of interesting and useful things on your topic, if you find it definitely has value, but does not deserve the attention of the whole post, if it's not difficult for you once a week / in two weeks, depending on the material to share a pair of kilobytes of reference mass, then write me in a personal or any social. network from profile. Scribble in the main section as desired. The name or contacts of volunteers in each post will be indicated.

Previous selection (Issue 39)

I apologize for any typos. If you notice a problem - please write in a personal.

Thank you all for your attention.