roeib

import React from 'react';
import { PropTypes } from 'prop-types';

class User extends React.Component {
  
  render() {
    return (
      <div>
        <p>User Name: {this.props.name}</p>
        <p>Age: {this.props.age}</p>

roeib

import PropTypes from 'prop-types';

roeib

npm install --save prop-types

roeib

const Welcome = ({name = 'Roei', lastName = 'Berkovich'}) => {
  return (<div>{`Hi ${firstName} ${lastName}`}!</div>)
}

roeib

const Welcome = ({name = 'Roei', lastName = 'Berkovich'}) => {
  return (<div>{`Hi ${firstName} ${lastName}`}!</div>)
}

roeib

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

Welcome.defaultProps = {
  name: 'Roei'
};

roeib

class Welcome extends React.Component {

static defaultProps = {
    name: 'Roei'
  }
  
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

roeib

class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}
Welcome.defaultProps = {
  name: 'Roei'
};

roeib

//class example
class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

//function example
function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;

roeib

import React, { useState, useEffect, useRef } from "react";
import ReactDOM from "react-dom";

function App() {
  const [count, setCount] = useState(0);
  const isFirstRun = useRef(true);

  useEffect(() => {
    if (isFirstRun.current) {
      //skip firstRun