Denis Masson

import "./styles.css";

const Article = ({ name }) => {
  return (
    <div>
      <h1>Статья</h1>
      {name}
    </div>
  );
};

function App() {
  const [article, setArticle] = useState([]);

  function clickHandler() {
    fetch("http://192.168.1.50/text.php", {
      method: "POST",
      header: {
        "Content-Type": "application/x-www-form-urlencoded; charset=utf-8"
      },
      body: JSON.stringify({ action: 1 })
    })
      .then((response) => response.json())
      .then((response) => {
        setArticle(response);
      });
  }

  return (
    <div className="App container my-3">
      <section>
        {article.map((value, index) => (
          <Article key={index} name={value.name} />
        ))}
      </section>

      <button className="btn btn-success" onClick={clickHandler}>
        Получить данные
      </button>
    </div>
  );
}

import Switcher from '../Switcher/Switcher';

export default function Setting({ chooseLang }) {
return (
        <section id='setting'>
        <Switcher
          id='lang'
          title='Language'
          title_class='lng-set_subtitle1'
          label_lt='English'
          label_rt='Українська'
          value={lang}
          onClick={chooseLang}
        />
        </section>
    );
}