Fernando Rojo nandorojo

If you use server rendering, keep in mind that neither useLayoutEffect nor useEffect can run until the JavaScript is downloaded.

You might see a warning if you try to useLayoutEffect on the server. Here's two common ways to fix it.

Option 1: Convert to useEffect

If this effect isn't important for first render (i.e. if the UI still looks valid before it runs), then useEffect instead.

function MyComponent() {

Converting mkv to mp4 with `ffmpeg`

Essentially just copy the existing video and audio stream as is into a new container, no funny business!

The easiest way to "convert" MKV to MP4, is to copy the existing video and audio streams and place them into a new container. This avoids any encoding task and hence no quality will be lost, it is also a fairly quick process and requires very little CPU power. The main factor is disk read/write speed.

With ffmpeg this can be achieved with -c copy. Older examples may use -vcodec copy -acodec copy which does the same thing.

These examples assume ffmpeg is in your PATH. If not just substitute with the full path to your ffmpeg binary.

Single file conversion example

Updating a feature branch

First we'll update your local master branch. Go to your local project and check out the branch you want to merge into (your local master branch)

$ git checkout master

Fetch the remote, bringing the branches and their commits from the remote repository. You can use the -p, --prune option to delete any remote-tracking references that no longer exist in the remote. Commits to master will be stored in a local branch, remotes/origin/master.

	import classNameProp from 'class-name-prop';
	import { useRouter } from 'next/router';
	import React from 'react';
	import styles from './RouteIndicator.module.css';

	const DONE_DURATION = 250;

	export default function RouteIndicator() {
	const router = useRouter();

	const input = require('./spec3.json')

	function titleCase(snake) {
	return snake.replace(/(^\|_)([a-z])/g, (s) => s.replace('_', '').toUpperCase())
	}

	function isPrimitive(schema) {
	switch (schema.type) {
	case 'boolean':
	case 'number':

	import createHoverMonitor from './createHoverMonitor';
	import { element, func, oneOfType } from 'prop-types';
	import React, { Component } from 'react';

	const hover = createHoverMonitor();

	/**
	* Use:
	* <Hoverable>
	* {(hover) => <View style={hover && styles.hovered} />}

	import NextHead from 'next/head'
	import React from 'react'
	import ReactGA from 'react-ga'
	import Router from 'next/router'





	/*****************************************************************************\

	import React, { Component } from 'react';

	export default function withPropsChecker(WrappedComponent) {
	return class PropsChecker extends Component {
	componentWillReceiveProps(nextProps) {
	Object.keys(nextProps)
	.filter(key => {
	return nextProps[key] !== this.props[key];
	})
	.map(key => {

	:root {
	--ease-in-quad: cubic-bezier(.55, .085, .68, .53);
	--ease-in-cubic: cubic-bezier(.550, .055, .675, .19);
	--ease-in-quart: cubic-bezier(.895, .03, .685, .22);
	--ease-in-quint: cubic-bezier(.755, .05, .855, .06);
	--ease-in-expo: cubic-bezier(.95, .05, .795, .035);
	--ease-in-circ: cubic-bezier(.6, .04, .98, .335);

	--ease-out-quad: cubic-bezier(.25, .46, .45, .94);
	--ease-out-cubic: cubic-bezier(.215, .61, .355, 1);