| =========Docker Basics=========== | |
| docker login - to login into docker hub | |
| docker run - to run container | |
| docker rm - to remove container from sys | |
| docker rmi - to remove container from disk | |
| docker kill- to close | |
| docker ps - list running containers | |
| docker ps -a shows stopped containers | |
| docker ps -l shows last runned container | |
| docker logs - show log of container |
Hmm... I don't see any docs for 4.0 on https://webpack.js.org. I guess I'll just wing it.
All I need to do is npm i -D webpack@next, right?
+ webpack@4.0.0-beta.2
Brought to you by Headjack
FFmpeg is one of the most powerful tools for video transcoding and manipulation, but it's fairly complex and confusing to use. That's why I decided to create this cheat sheet which shows some of the most often used commands.
Let's start with some basics:
ffmpeg calls the FFmpeg application in the command line window, could also be the full path to the FFmpeg binary or .exe file
| Method | Side effects1 | State updates2 | Example uses |
|---|---|---|---|
| Mounting | |||
componentWillMount |
✓ | Constructor equivalent for createClass |
|
render |
Create and return element(s) | ||
componentDidMount |
✓ | ✓ | DOM manipulations, network requests, etc. |
| Updating | |||
componentWillReceiveProps |
✓ | Update state based on changed props |
| // getComponent is a function that returns a promise for a component | |
| // It will not be called until the first mount | |
| function asyncComponent(getComponent) { | |
| return class AsyncComponent extends React.Component { | |
| static Component = null; | |
| state = { Component: AsyncComponent.Component }; | |
| componentWillMount() { | |
| if (!this.state.Component) { | |
| getComponent().then(Component => { |
| /* | |
| ##Device = Desktops | |
| ##Screen = 1281px to higher resolution desktops | |
| */ | |
| @media (min-width: 1281px) { | |
| /* CSS */ | |
| import { Component } from "React"; | |
| export var Enhance = ComposedComponent => class extends Component { | |
| constructor() { | |
| this.state = { data: null }; | |
| } | |
| componentDidMount() { | |
| this.setState({ data: 'Hello' }); | |
| } | |
| render() { |
| var mediaJSON = { "categories" : [ { "name" : "Movies", | |
| "videos" : [ | |
| { "description" : "Big Buck Bunny tells the story of a giant rabbit with a heart bigger than himself. When one sunny day three rodents rudely harass him, something snaps... and the rabbit ain't no bunny anymore! In the typical cartoon tradition he prepares the nasty rodents a comical revenge.\n\nLicensed under the Creative Commons Attribution license\nhttp://www.bigbuckbunny.org", | |
| "sources" : [ "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" ], | |
| "subtitle" : "By Blender Foundation", | |
| "thumb" : "images/BigBuckBunny.jpg", | |
| "title" : "Big Buck Bunny" | |
| }, | |
| { "description" : "The first Blender Open Movie from 2006", | |
| "sources" : [ "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4" ], |
| See my DASH-IF presentation from October, 2014: | |
| https://s3.amazonaws.com/misc.meltymedia/dash-if-reveal/index.html#/ | |
| 1. encode multiple bitrates with keyframe alignment: | |
| ffmpeg -i ~/Movies/5D2_Portrait.MOV -s 1280x720 -c:v libx264 -b:v 1450k -bf 2 \ | |
| -g 90 -sc_threshold 0 -c:a aac -strict experimental -b:a 96k -ar 32000 out.mp4 | |
| My input was 30 fps = 3000 ms. If it were 29.97, then a GOP size of 90 frames will yield a base segment | |
| size of 3003 milliseconds. You can make the segment size some multiple of this, e.g.: 6006, 9009, 12012. |
