Если вы похожи на меня, вы плохо разбираетесь в документации (никому не говорите), и чтение ее иногда кажется иностранным языком, который старшие разработчики создали, чтобы возиться с младшими (это определенно работает). Если вы уверены, что сможете в этом разобраться, ознакомьтесь с официальной документацией React здесь: https://reactjs.org/docs/create-a-new-react-app.html

Настройка

Если вы впервые создаете новое приложение для реагирования (или вы забыли, как я всегда это делаю), я рекомендую вам ознакомиться с документацией React для начала работы. Вы можете найти это здесь: (https://reactjs.org/docs/create-a-new-react-app.html)

Перейдите в терминале туда, где вы хотите разместить файлы вашего проекта. Я случайно захожу в свой ./Desktop.

Попав в вашу папку, в вашем терминале запустите

npx create-react-app <new app name> и вставьте то, что вы хотите назвать своим приложением, в <new app name>.

Для компиляции всех файлов потребуется несколько секунд, и вы должны увидеть новую папку, созданную в том месте, где вы создали свой новый проект.

Теперь вы можете открыть свою папку в IDE по своему усмотрению. Если у вас есть код VS (это то, что я использую), вы можете запустить в своем терминале code <folder name>, и VS Code (должен) автоматически открывать вашу папку в новом окне.

Чтобы убедиться, что ваш проект скомпилирован правильно, запустите yarn start или npm start (я использую npm, но я слышу, что yarn работает быстрее), чтобы открыть свой проект в браузере.

Для начала я обычно делаю несколько вещей, чтобы очистить стандартные вещи React, прежде чем я начну кодировать свой собственный проект. Если вы используете бутстрап, это будет важно, чтобы позже избежать наложения стилей:

Эти файлы вам больше не понадобятся. Вы можете щелкнуть правой кнопкой мыши и удалить их (или удалить их, как вам удобнее, с помощью терминала или другой магии). Если вы запустите npm start сейчас, вы получите ошибки. Откройте ваш ./src/App.js файл и удалите следующее:

Удалите импорт logo.svgвверху и все, что находится между вашим первым <div>, (теги заголовков можно сохранить, но на самом деле они вам не нужны.

Запустите npm start еще раз, и вы должны увидеть….

Ничего такого.

Замечательно! Это означает, что вы удалили их основные вещи. Чтобы убедиться, что их стиль по умолчанию не мешает вашему будущему стилю, откройте файл ./src/index.css и удалите стиль code; при желании вы можете оставить стиль body или использовать его как основу, пока не решите изменить его позже:

Теперь перейдите к своему App.css файлу, и вы можете удалить все (что я обычно делаю) или решить, что вы предпочитаете оставить или выбросить. Вы также можете прокомментировать его, если боитесь его удалить и хотите принять решение позже.

Вы могли заметить, а могли и не заметить, что наша ./public папка стала красной, и она нам не нравится. Это почему? Мы удалили файл logo192.png, и один из наших файлов в этой папке пытается его отобразить. React не выдаст вам ошибок и не остановит вас от разработки, но на это некрасиво смотреть. Перейдите к ./public/index.html и внесите следующие изменения:

Удалите зачеркнутые строки и в тегах <title>, где нарисовано поле, замените React названием своего приложения.

Вот и все, что нужно для настройки и очистки вашего нового приложения React. Теперь вы можете создавать свои компоненты и добавлять Redux, если хотите!