inPhoenix

Having the ^ character in front of the version number indicates that any version that is compatible with the specified version can be used. So, if you have "example-package": "^1.0.1" in your package.json file and you run npm install, npm will install the latest version of "example-package" that is compatible with version 1.0.1. This includes patch versions (e.g. 1.0.2, 1.0.3) and any new minor versions that starts with 1.0 (e.g. 1.0.x) but not new major versions (e.g. 2.0.0).

The package-lock.json file will not prevent having patched versions installed when the value of "example-package" is with the ^ on package.json.

----------------------------------------------------------------------------------------------------

When you run npm install command, npm will look at the version specified in the package.json file and install the latest version of the package that is compatible with the version specified in the package.json, disregarding the version specified in the package-lock.json.

If you have "example

inPhoenix

Commit type	Emoji
Initial commit	🌃 :night_with_stars:
Version tag	🌄 unrise_over_mountains
New feature	🌇 :city_sunrise:
Bugfix	🚊 :tram:
Documentation	🚉 :station:
Performance	🚟 :suspension_railway:
Cosmetic	👾 :space_invader:
Tests	🌉 :bridge_at_night:

inPhoenix

PhpStorm - Import - Relative Thread: https://intellij-support.jetbrains.com/hc/en-us/community/posts/207656825-Custom-import-paths-with-es6 Steps: Configuration based on create-react-app:

.env file
NODE_PATH=src/

PhpStorm/Webstorm:

inPhoenix

import React, { Component } from 'react'

import { Spring } from 'react-spring'

class ShowHide extends Component {
  state = {
    opacity: 0
  }
  onHover = () => {
    this.setState(prevState => ({

inPhoenix

// https://daveceddia.com/intro-to-hooks/
import React, { useState } from 'react';
import { render } from 'react-dom';

function OneTimeButton(props) {
  const [clicked, setClicked] = useState(true) // setClicked update the clicked state.

  function clickedTest() {
    props.onClick()
    setClicked(!clicked)

inPhoenix

const nodes = [
  { id:"abc", content:"Lorem ipsum"},
  { id:"def", content:"Dolor sit" },
  // ...
];

const keyedNodes = {}

const getNode = id => {
  if (!keyedNodes[id]) {

inPhoenix

const isEmpty = value => {
  return (
    value == null || // From standard.js: Always use === - but obj == null is allowed to check null || undefined
    (typeof value === 'object' && Object.keys(value).length === 0) ||
    (typeof value === 'string' && value.trim().length === 0)
  )
}

export default isEmpty

inPhoenix

console.log('%c つ ◕＿◕ ༽つ' $START$, 'background: white; color: red;', $START$)

inPhoenix

// Example using create-react-app.
// For scratch configurations, add babel-plugin-transform-class-properties.
// More info: https://babeljs.io/docs/plugins/transform-class-properties/

import React from 'react'

class Example extends React.Component {
  example = (param) => () => {
    console.log('Hello ', param)
  }

inPhoenix

// https://medium.com/@martin_hotell/react-children-composition-patterns-with-typescript-56dfc8923c64
// https://www.robinwieruch.de/react-render-props-pattern/
// https://www.youtube.com/watch?v=AiJ8tRRH0f8
// https://www.youtube.com/watch?v=BcVAq3YFiuc
constructor () {
    this.state = {
     width: 0,
     ...
     }
  }