React

let newMessage = React.createRef()

let addMessage = () => {
alert(newMessage.current.value)
newMessage.current.value = '';
}
<textarea ref={newMessage}></textarea>
<button onClick={addMessage}>Добавить сообщение</button>
npm install react-router-dom
import {BrowserRouter, Route} from "react-router-dom";
import React from "react";

const App = (props) => {


return (

<BrowserRouter>
<div className="app-wrapper">
<Header/>
<Navbar/>
<div className="app-wrapper-content">
<Route path="/dialogs" render={ () => <Dialogs state={props.appState.dialogsPage}/>}/>
<Route path="/profile" render={ () => <Profile state={props.appState.profilePage}/>}/>
<Route path="/music" render={ () => <Music/>}/>
<Route path="/news" render={ () => <News/>}/>
<Route path="/settings" render={ () => <Settings/>}/>
</div>
</div>
</BrowserRouter>
);
}


export default App;
import {NavLink} from 'react-router-dom';


const Navbar = () => {
return (
<nav className={classes.nav}>
<div className={classes.item}><NavLink to="/profile" activeClassName={classes.active}>Profile</NavLink></div>
<div className={`${classes.item}`}><NavLink to="/dialogs" activeClassName={classes.active}>Messenges</NavLink></div>
<div className={classes.item}><NavLink to="/news" activeClassName={classes.active}>News</NavLink></div>
<div className={classes.item}><NavLink to="/music" activeClassName={classes.active}>Music</NavLink></div>
<div className={classes.item}><NavLink to="/settings" activeClassName={classes.active}>Settings</NavLink></div>
</nav>
)
}

let postData = [
{id: 1, message: 'Hi? how are you', likecount: 20},
{id: 2, message: 'Hoy are bithc', likecount: 20},
{id: 3, message: 'Learn now', likecount: 20},
];


let dialogs = [
{id: 1, name: 'Diva'},
{id: 2, name: 'Brand'},
{id: 3, name: 'Her'},
{id: 4, name: 'Dhe'},
{id: 5, name: 'Path'}
];


let messagesData = [
{id: 1, message: 'Hi'},
{id: 2, message: 'Hoy are you'},
{id: 3, message: 'yo'},
{id: 4, message: 'yo'},
{id: 5, message: 'yo'}
];

let state = {
profilePage: {
postData: postData,

},
dialogsPage:{
dialogs: dialogs,
messagesData: messagesData
}
}

export default state;

JS

function getChekedOnId(id) {
var need = id + ' input:checkbox:checked';
var needSpectr = [];
$(need).each(function() {
needSpectr.push($(this).val());
});
return needSpectr;
};
// text number date
function renderInput(arg) {
    return `<input type=»${arg.type}» id=»${arg.id}» placeholder=»${arg.placeholder}»`;
}
// textarea
function renderTextarea(arg) {
    return `<textarea placeholder=»${arg.placeholder}» id=»${arg.id}»/></textarea>`;
}
// checkbox
function renderCheckbox(arg) {
    return `<label><input type=»${arg.type}» id=»${arg.id}» />${arg.placeholder}</label>`;
}
// select
function renderSelect(arg) {
    let render = `<select id=»${arg.id}»>`;
    for (let i of arg.data) {
        render += `<option>${i}</option>`
    }
    render += `</select>`;
    return render;
}
function searchAndFilter(searchTerm, id) {
id = id + ' label'
// variable = #prescriptSelectForm
$(id).hide()
if (searchTerm.length == '') {
$(id).show();
} else {
$(id).each(function() {
var currentText = $(this).text();
currentText = currentText.toUpperCase();
searchTerm = searchTerm.toUpperCase();
if (currentText.indexOf(searchTerm) >= 0) {
$(this).show();
}
});
}
}

PHP

<?php
header(‘Access-Control-Allow-Origin: *’);

$data = $_POST[‘data’];
$id= $_POST[‘id’];
$action= $_POST[‘action’];

$link = mysqli_connect(«localhost», «u0414722_tes», «A8c4D7f9», «u0414722_tes»);

if ($link == false){
echo ‘Ошибка: Невозможно подключиться к MySQL’;
}
else {
if($action == ‘save’){
// UPDATE `data` SET `json` = » WHERE `data`.`id` = 1
$sql = «UPDATE `data` SET `json` = ‘$data’ WHERE `data`.`id` = $id»;
mysqli_query($link, $sql);
//echo mysqli_query($link, $sql);

} else if($action == ‘set’){

// $query = ‘SELECT `json` FROM `data` WHERE `id` = 1’;
// SELECT * FROM `u0414722_tes`.`data` WHERE `data`.`json` =



$query = «SELECT `json` FROM `u0414722_tes`.`data` WHERE `data`.`id` = $id»;
$result = mysqli_query($link, $query);
//$data = mysqli_fetch_object($result);
$row = $result->fetch_array(MYSQLI_ASSOC);
echo $row[‘json’];

}

//$sql = ‘UPDATE `data` SET `json` = $data WHERE `data`.`id` = $id’;
//mysqli_query($link, $sql);
//echo ‘update’;
}

mysqli_close($link);

?>