React TextArea Bileşeni

onChange Alanı
Şöyle yaparız.

constructor(props){
  super(props);
  this.handleNameChange = this.handleNameChange.bind(this);
}

<textarea onChange={this.handleNameChange} ...

React Link Bileşeni

to Alanı
Örnek
Şöyle yaparız.

render(){
  return (<div>
    <ul>
      {topics.map(({ name, id }) => (
      <li key={id}>
        <Link to={`${this.state.url}/${id}`}>{name}</Link>
       </li>
     ))}
     </ul>
     <Route path={`${this.state.path}/:topicId`} component={TopicDetails}/>
}

Express.js Router Sınıfı

post metodu
Şöyle yaparız.

router.post('/index.html', (req, res) => {
  const obj = {name:req.body.name,text:req.body.message};
  //insert obj into database
});

use metodu
Herhangi bir get,port gibi işlemde araya girip gelen isteği loglamak için şöyle yaparız. loglama sonunca next() çağrısına dikkat!

const express = require('express');
const router = express.Router();
router.use((req,res,next) => {
  console.log("/" + req.method,  "host"+ req.host, "Params" + req.params);
  next();
});

React Function Bind

Giriş
Function Bind işlemi constuctor veya render metodları içinde yapılabilir.

Function.prototype.bind her seferinde yeni bir nesne yaratır. Bu yüzden constructor içinde yapılması tercih edilmeli.

Constructor İçinde
Örnek
Şöyle yaparız.

class Child extends Component {
  constructor(props) {
    super(props);
    this.state = {
      word: "Something"
    };
    
    this.doSomethingElse = this.doSomethingElse.bind(this);
  }

  doSomethingElse() {
    ...
  }
}




Button Sınıfı

addEventListener metoduÖrnek

Şöyle yaparız.

btn.addEventListener('click', () => {
  ...
});

Örnek

Elimizde şöyle bir kod olsun. Bu kodun recursive olarak sonsuza kadar çalışmadığını görürüz.

const $leaveRoom = document.querySelector('#leave-button');

$leaveRoom.addEventListener('click', () => {
  $leaveRoom.click();
});

Açıklaması şöyle

Each element has an associated click in progress flag, which is initially unset.

onclick metodu

Örnek
HTML ile şöyle yaparız.

<a id="myBtn" href="#" class="helmButtonStyle" onclick="getData()">click me</a>

Örnek
Şöyle yaparız.

function getData() {
  console.log('getting data');
}
var btn = document.getElementById("myBtn");
btn.onclick = function() {
  console.log('onclick');
}