kpdecker/jsdiff – реализация различий в тексте JavaScript

require('colors');
var Diff = require('diff');

var one = 'beep boop';
var other = 'beep boob blah';

var diff = Diff.diffChars(one, other);

diff.forEach(function(part){
  // green for additions, red for deletions
  // grey for common parts
  var color = part.added ? 'green' :
    part.removed ? 'red' : 'grey';
  process.stderr.write(part.value[color]);
});

console.log();

kpdecker/jsdiff - реализация различий в тексте JavaScript

https://github.com/kpdecker/jsdiff

30 дней Vue – обучалка разбитая на 30 дней научит вас Vue

30 дней Vue - обучалка разбитая на 30 дней научит вас Vue

В течение 30 дней авторы пройдутся по всему, что вам нужно знать для работы с Vue. С самого начала через такие темы, как экземпляр Vue, компоненты и даже тестирование.
https://github.com/fullstackio/30-days-of-vue Чиатать онлайн

Rallax.js – js плагин для создания паралакс эффекта

import rallax from 'rallax.js'

document.addEventListener('DOMContentLoaded', () => {
  window.onbeforeunload = () => {
    window.scrollTo(0, 0)
  }

  const dead = rallax('.dead', {speed: 0.55, mobilePx: 600})
  const simple = rallax('.simple', {speed: 0.7, mobilePx: 600})
  const parallax = rallax('.parallax', {speed: 0.6, mobilePx: 600})
  const scrolling = rallax('.scrolling', {speed: 0.75, mobilePx: 600})

  const objects = [dead, simple, parallax, scrolling]

  objects.forEach(obj => {
      obj.when(
        () => obj.scrollY() > 750,
        () => obj.stop()
      )
      obj.when(
        () => obj.scrollY() <= 750,
        () => obj.start()
      )
    })

  const image = document.querySelector('.parallax-image')
  const imageContainer = document.querySelector('.container')
  const imageContainerRect = imageContainer.getBoundingClientRect()
  const winHeight = window.innerHeight

  const imageTop = -(window.innerHeight * 0.3) * 2
  const imageHeight = imageContainerRect.height + (winHeight * 0.3)
  const imageWidth = imageContainerRect.width + 200
  const imageLeft = -100

  Object.assign(image.style, {
    position: 'relative',
    top: `${imageTop}px`,
    left: `${imageLeft}px`,
    height: `${imageHeight}px`,
    width: `${imageWidth}px`,
  })

  const imageParallax = rallax(image, {mobilePx: 600})
})

https://chriscavs.github.io/rallax-demo/

lovell/sharp – процессор картинок для node.js

Умеет работать с JPEG, PNG и WebP. В 4 раза быстрей чем GraphicsMagick

const roundedCorners = Buffer.from(
  '<svg><rect x="0" y="0" width="200" height="200" rx="50" ry="50"/></svg>'
);

const roundedCornerResizer =
  sharp()
    .resize(200, 200)
    .overlayWith(roundedCorners, { cutout: true })
    .png();

readableStream
  .pipe(roundedCornerResizer)
  .pipe(writableStream);

https://github.com/lovell/sharp

  1. 1
  2. ...
  3. 7
  4. 8
  5. 9
  6. 10
  7. 11
  8. 12
  9. 13
  10. ...
  11. 114
Scroll Up