nnaku

import React, { useState } from 'react'

function Form() {
  const [firstName, setFirstName] = useState('Maija')
  const [lastName, setLastName] = useState('Mehiläinen')
  
  function handleFirstNameChange(e) {
    setFirstName(e.target.value)
  }
  

nnaku

https://docs.docker.com/install/linux/docker-ce/ubuntu/

https://docs.docker.com/compose/install/

https://traefik.io/

install docker and docker-compose

creare docker network

nnaku

# you can secure this dasd with basic auth
# uncommnet label traefik.frontend.auth.basic
# and create basic auth with eq. htpasswd -n username (htpasswd comes with apache2-utils)
# YOU MUST ESCAPE THOSE 3 $ by adding another $  to them ($ -> $$) admin:$$apr1$$/Q.zw5dp$$TXbLwhnaiXWYTVSuv8QON.  

version: "3"

services:
  proxy:
    image: traefik:v1.7.10-alpine

nnaku

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "~/*": ["src/*"]
    }
  }
}

nnaku

...
"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  }
...
  "jest": {
    "moduleNameMapper": {

nnaku

const { override, addBabelPlugins } = require('customize-cra');

module.exports = override(
  ...addBabelPlugins('@babel/plugin-proposal-class-properties', [
    'babel-plugin-root-import',
    {
      rootPathPrefix: '~',
      rootPathSuffix: 'src',
    },
  ])

nnaku

// Without this plugin...
import SomeExample from '../../../some/example.js';
const OtherExample = require('../../../other/example.js');

// With babel-plugin-root-import you can write...
import SomeExample from '~/some/example.js';
const OtherExample = require('~/other/example.js');