A few interesting and useful things for web developer # 37

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

    Buzz.js




    Recently, on the Internet more and more often there are projects where various interface elements are accompanied by certain sounds. I would even say that UX / UI on the web is moving to a new stage of evolution. And Buzz.js is one of the first to help you in voicing your interface. This is a library for working with the HTML5 Audio API with a number of suitable event handlers.

    var mySound = new buzz.sound( "/sounds/myfile", {
        formats: [ "ogg", "mp3", "aac" ]
    });
    mySound.play()
        .fadeIn()
        .loop()
        .bind( "timeupdate", function() {
           var timer = buzz.toTimer( this.getTime() );
           document.getElementById( "timer" ).innerHTML = timer;
        });
    



    Snabbt.js



    Snabbt.js is a tiny (only 4kb in gzip) and very fast (60FPS) library for processing CSS animations. Lets you interact with the translate, rotate, scale, skew, and resize properties. It works in all modern browsers.
    	snabbt(element, {
    	  position: [100, 0, 0],
    	  easing: 'ease'
    	}).then({
    	  fromRotation: [0, 0, -2*Math.PI],
    	  easing: 'spring',
    	  springConstant: 0.2,
    	  springDeaccelaration: 0.95,
    	});
    


    Cachet



    The system of status alerts, the first of such open and free projects. There are times when your site does not work due to third-party services. In order not to scare away the visitor, you need to properly inform him, namely, in real time, show him the error message. Cahet monitors the services (components) you are using and displays a status message in case of any malfunctions. Written in PHP with Laravel, has a RESTful API, modular and easy to customize.

    PageKit CMS




    Blessed contrib


    image
    A brain-breaking JavaScript library for dashboards in a terminal using ascii / ansi characters. At the core are Blessed and Drawille .

       var blessed = require('blessed')
         , contrib = require('blessed-contrib')
         , screen = blessed.screen()
         , line = contrib.line(
             { style: 
               { line: "yellow"
               , text: "green"
               , baseline: "black"}
             , xLabelPadding: 3
             , xPadding: 5
             , label: 'Title'})
         , data = {
             x: ['t1', 't2', 't3', 't4'],
             y: [5, 1, 7, 5]
          }
       screen.append(line) //must append before setting data
       line.setData(data.x, data.y)
       screen.key(['escape', 'q', 'C-c'], function(ch, key) {
         return process.exit(0);
       });
       screen.render()
    


    I also want to leave a link to the cli-dashboard for visualizing graylog logs.

    Minimap.js



    jQuery plugin that allows you to display a mini map of the current page next to the scrollbar. This solution is probably familiar to many thanks to Sublime Text. I can’t provide an explicit example where the use of this plugin is necessary, but the implementation clearly deserves a place in this collection for its originality.

    Slate


    A beautiful static documenter for your code, with support for over 60 programming languages ​​and responsive output templates.
    image

    Western thoughts or what it would be worth translating into Habré:




    They say and show domestic IT resources:




    Finally:


    • HTML / CSS
    • Javascript
      • Autopolyfiller - Use the latest ECMAScript features and don't worry about compatibility.
      • Riot.js 2.0 is the second version of a 2.5kb react-like MV * framework, which was already mentioned in my collections.
      • Gitlet - Git implementation in JavaScript.
      • Videogular is a video player for Angular.js.
      • Insignia - jQuery plugin for customization with tags / tags.
      • Lovefield is a cross-browser SQL-like engine from Google, based on IndexedDB.
      • GifW00t - pure javascript web recorder.
      • Vegas is a jQuery plugin for creating background sliders.
      • PSI - CL utility for PageSpeed ​​Insights from Google.
    • Php
      • Openbay - the source code of The Pirate Bay itself.
      • clearPHP is a guide to writing code.
      • iDict - iCloud Apple iD BruteForcer.
    • Python
      • Hamms - malformed servers to test your HTTP client.
      • Dataquest.io - study data science in a browser.
      • Notejam - The easy way to learn web frameworks.
    • Ruby
      • Pundit - authorization without magic, based on plain ruby ​​objects ("killer" cancan / cancancan).
      • Ginatra is a fast and easy to deploy web viewer of git repositories.
      • Formatador - colors, tables and progress bars for formatting text in the terminal.
      • Spyke - work with REST services in the style of ActiveRecord.
    • Go
      • SSH Tron is a server for playing Tron over SSH.
      • Fanout is a convenient library for easy task parallelization.
      • vim-go is a multifunctional and actively developing vim plugin for working with Go.
    • Miscellaneous
      • Joe is a quick and easy way to create .gitignore from the console.
        image
      • country-list - a list of all countries in accordance with the SO 3166-1 standard for all languages ​​and data formats.
      • Chartspree.io is a very convenient chart generation service like src for a picture
      • Elevatorsaga is an addictive elevator programming game.
      • For all startups, startups are infographics with big numbers from PornHub.


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

    Friends backenders! I think everyone knows that I make my selections entirely on altruism. I always searched a bunch of sites so that I was always comfortable working. And at one point I decided to share the material found. Over time, collections have gained some popularity and expanded significantly in terms of content. From now on, I will clearly structure the block “Last”, so that people do not have to look for what they need. In order for the sections to not 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'm more a theorist than a practitioner.

    Pshpshnik, rubist , pythonist, gooschikif you’re already monitoring GitHub Trending, Reddit, HackerNews or Twitter in search of interests and usefulness on your topic, if the found definitely has value, but does not deserve the attention of an entire post, if it’s not difficult for you once a week / two weeks depending on the material share a couple kilobytes of reference mass, then write to me in PM or any social. network from profile. Scribble in the main section at will. The name or contacts of the volunteers in each post will be indicated.

                                                             Previous compilation (Issue 36)

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

    Thank you all for your attention.

    Only registered users can participate in the survey. Please come in.

    Do you like the selection?

    • 93.3% Yes 548
    • 6.6% No 39

    Also popular now: