sladg

<!-- 
// inside _app.tsx
import Script from 'next/script';

// inside custom App component.
<Script src="https://www.google.com/recaptcha/enterprise.js?render=explicit" />
-->

import { useEffect, useState } from 'react';

lukebussey

To embed the contents of an SVG file into your site using NextJS 12 with the new Rust-based compiler, perform the following steps:

1. Install @svg/webpack:

$ npm install --save-dev @svgr/webpack

2. Create a svgr.config.js config file with the following contents. This will remove the width and height from the SVG but keep the viewBox for correct scaling.

alukach

# .github/workflows/app.yaml
name: My Python Project
on: push

jobs:
  test:
    runs-on: ubuntu-latest
    timeout-minutes: 10

    services:

dphilipson

React/TypeScript setup steps

Setting up the environment

• Run

  yarn create react-app my-app --typescript
  cd my-app
  

bradtraversy

Docker Commands, Help & Tips

Show commands & management commands

$ docker

Docker version info

nex3

The PATH is an important concept when working on the command line. It's a list of directories that tell your operating system where to look for programs, so that you can just write script instead of /home/me/bin/script or C:\Users\Me\bin\script. But different operating systems have different ways to add a new directory to it:

Windows

1. The first step depends which version of Windows you're using:

• If you're using Windows 8 or 10, press the Windows key, then search for and

faisalmahmud

module.exports = {
  parser: "babel-eslint",
  plugins: ["react", "prettier"],
  rules: {
    "prettier/prettier": "error"
  },
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
      modules: true

remy

import { withRouter } from 'next/router';
import Link from 'next/link';
import React, { Children } from 'react';

const ActiveLink = ({ router, children, ...props }) => {
  const child = Children.only(children);

  let className = child.props.className || '';
  if (router.pathname === props.href && props.activeClassName) {
    className = `${className} ${props.activeClassName}`.trim();

granmoe

// this file is just here to change the name of the gist
import React from 'react'
import styled from 'styled-components'

const makeResponsiveComponent = (rulesets, tagName = 'div') =>
  styled(tagName)`${buildStyles(rulesets)}`

const buildStyles = rulesets =>
  rulesets.reduce(
    (cssString, { constraint, width, rules }) =>

moodysalem

import React, { Component, PropTypes } from 'react';

/**
 * Only ever render one of these per page
 *
 * TODO: improve with react-side-effect to better handle multiple instances of this being rendered at once so we can
 * nest the component in forms
 */
export default class PreventLeaveRoute extends Component {
  static contextTypes = {