И почему выдается ошибка Error: bind EADDRINUSE
С каким бекендом Вы предпочитаете связывать свое приложение?
Каков Ваш стек в этом плане?
Так же интересует выбор баз (MySql, MongoDB....)
class MyForm extends React.Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
this.addGood = this.addGood.bind(this);
this.changeGoodCount = this.changeGoodCount.bind(this);
this.state = { goods: [] };
}
handleSubmit() {
console.log('handleSubmit');
}
addGood() {
const { goods } = this.state;
this.setState({ goods: [ ...goods, { count: 0 } ] });
}
changeGoodCount(n, count) {
const { goods } = this.state;
this.setState({ goods: goods.map( (good, i) => i === n ? { count } : good ) });
}
render() {
const { goods } = this.state;
const { handleSubmit, addGood, changeGoodCount } = this;
console.log('MyForm.render() -> goods =', goods);
return (
<form onSubmit={handleSubmit}>
<div>
Имя пользователя: <input type="text" />
</div>
<div>
Телефон: <input type="text" />
</div>
<div>
{ goods.map( (good, i) => <GoodInput key={i} good={good} n={i} onChange={changeGoodCount}/> ) }
</div>
<div>
<button type="button" onClick={addGood}>Добавить что-либо</button>
</div>
</form>
);
}
}
class GoodInput extends React.Component {
handleChange(e) {
const { n, onChange } = this.props;
const count = e.currentTarget.value;
onChange(n, count);
}
render() {
const { good, n } = this.props;
return (
<div>
Количество товара {n} <input type="text" onChange={(e) => this.handleChange(e)} />
</div>
);
}
}
upstream app1 {
server 127.0.0.1:3003; # порт, который слушает приложения
}
server {
listen 80;
# черновики для разных серверов, раcкомментить нужный по необходимости
# home box
#set $apppath /home/hogart/projects/app1;
#server_name app1.local;
# beta
#set $apppath /home/hogart/app1;
#server_name app1.kitmanov.name;
# production
#set $apppath /home/hogart/app1;
#server_name app1.info;
root $apppath;
# раздача статики
location ~ /style|js|img/ {
root $apppath/public/;
gzip on;
gzip_static on;
gzip_types text/css application/x-javascript;
gzip_proxied no-store no-cache private expired auth;
}
location / {
proxy_pass http://app1; # из upstream (см. выше)
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr; # удалить, если приложению не нужен реальный IP юзера
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # удалить, если приложению не нужен реальный IP юзера
proxy_cache_bypass $http_upgrade;
}
}
function template() {
return react.createElement(
'div',
null,
react.createElement(
'h1',
{ className: 'text-danger' },
'Page not found'
),
react.createElement(
'p',
null,
'This page does not exist'
)
);
}