Что это за что -то в этом фронтальном репо?

Вы готовитесь к следующему заданию. Должна быть легкая работа, просто обновите некоторые шаблоны для реализации нового дизайна меню, так что давайте приступим к этому. Клонировать это git Repo, все! Подождите … WUT … Что все это?

Я предполагаю, что многие разработчики пережили такой момент, когда вы смотрите на новый проект и думаете: что все это за что -то? Чтобы помочь вам снова выйти на свое место и подойти к этому с некоторой уверенностью, я просверлю еще более распространенные настройки, с которыми вы столкнетесь с Anno 2020.

Примечание: это (конечно) не полный, исчерпывающий список. Каждый проект отличается, и я видел несколько редких пользовательских настроек с течением времени. Эта статья направлена на то, чтобы помочь созданию разработчиков найти свой путь в большинстве проектов.

Файлы

Независимо от фреймворта или типа проекта, в папке корневой папки будет куча файлов.

• Readme.md ( Сделать readme ) Всегда начинайте здесь. Многие инструменты по умолчанию открывают файл readme, если они находят его в корне. В большинстве случаев это лучшее место для поиска документации, написанной реальными сопровождающими этого проекта о том, как начать, требования, чтобы иметь возможность запускать его, и возможные другие детали, которые имеют отношение к актуальности.

• Лицензия ( Помощь в лицензии ) Некоторая юридическая информация об использовании, гарантии и обмене кодексом. Также часто ссылаются на стандартные лицензии на программное обеспечение, такие как MIT, GNU и т. Д.

• Package.json ( npm Docs ) Это также важно, чтобы заглянуть. Файл Package.json указывает, что этот проект полагается на npm экосистема. И или нет, этот проект фактически раскрыт публично, помимо деталей, таких как имя/Описание/Автор этого проекта, он обычно также перечисляет зависимости (другие пакеты от NPM). Другим важным аспектом является то, что он часто перечисляет пару сценариев NPM, которые выполняют определенные задачи в рамках проекта, такие как установка зависимостей, запуск среды разработки, тестирование кодовой базы и сборка/пакет для производства. Для проектов узлов Главный Поле в Package.JSON довольно важно, поскольку нацелен на него в качестве точки входа для пакета. Для пакетов веб -сайтов это не имеет значения.

• Package-lock.json ( npm Docs ) Файл блокировки пакета содержит метаданные, о которых были установлены зависимости в Node_Modules. Это очень полезно, чтобы иметь возможность точно воспроизводить определенную ситуацию, так как зависимости от дизайна могут быть разных версий в зависимости от того, когда вы запускаете свою команду установки (позволяя патче и незначительные обновления, см. Semver ).

• .gitignore ( git on gitignore ) В этом файле есть инструкции о том, что исключить из управления версией. Это могут быть конкретные файлы, а также целые каталоги. Подумайте о сборке вашего проекта, временных папках или зависимостях. Общие предметы включают node_modules В TMP , Dist , www , сборка и так далее.

• .editorConfig ( editorConfig Docs ) Чтобы избежать ненужных столкновений в обработке символов и пробелов, этот файл поможет редакторам выбирать (среди прочего) вкладки против пространств, уровня отступления и того, как обрабатывать новички на основе имени файла/расширения.

• . [Что -то] rc Какое именно определение RC это Не совсем ясно , но все эти файлы RC являются в основном конфигурациями для всего, что работает в вашем проекте и поддерживает его. Часто вы найдете это: .npmrc , .babelrc , так далее.

• [Что -то] .config.js [Что -то] .config.json Настройки конфигурации для указанного … вещь. Подумайте о Linters ( eslint , prettier ), Transpilers ( babel , traceur ), bundlers ( rollup , parcel , webpack ), TypeScript ( TS ) и т. Д.

Папки

• node_modules ( npm на папках ) Все установленные зависимости пойдут здесь. Обычно эта папка создается после запуска NPM Установка или Установка пряжи , как почти всегда игнорируется git (см. .gitignore ).

• Сценарии (нерешенствованное соглашение) Действия командной строки из Package.json часто ссылаются на выполнение файлов в этой папке. Строительство, лининг, тестирование, часто здесь находятся инструкции по выполнению этих задач.

• SRC (нерешенствованное соглашение) Настоящее мясо: исходный код этого проекта. Вероятно, 90% или более активности репо занимают свое место в этой папке.

• активы (нерешенствованное соглашение) Любой аудио, изображение, шрифт, видео или другие статические активы часто хранятся здесь.

• сборка | Dist (Свенчание без документов, Вопрос о переполнении стека ) Объединенный или оптимизированный выход SourceCode. В зависимости от цели этого репо, это может или не может быть включено в git Поэтому вам, возможно, придется сначала запустить какой -то сценарий сборки, прежде чем он будет вызван.

• TMP | .tmp (нерешенствованное соглашение) При запуске проектов в режиме разработки, ему часто требуется временное рабочее пространство, чтобы служить в браузере, ему могут потребоваться промежуточные файлы. В любом случае, эта папка, как утверждает, временная. Не ожидайте, что это будет там долго.

• бин (Конвенция, вероятно, происходит в linux и другие операционные системы) Любые исполняемые файлы командной строки определены здесь. В объеме проектов Frontend он в основном ограничивается некоторыми утилитами командной строки, такими как инструменты строительных лесов (например, генерируют новые страницы или компоненты).

• либеральный | Продавец (нерешенствованное соглашение) Иногда вам нужны библиотеки, которые вы не можете, или не хотите полагаться через NPM. В этой папке часто хранятся активы третьей стороны.

• тест (нерешенствованное соглашение) Для тестов, которые вы не хотите рядом с исходным кодом, есть отдельный каталог. Прямое тестирование страницы часто написано в этой папке.

Приятного путешествия

Это просто царапает поверхность, надеюсь, это даст начинающим разработчикам подсказку о том, чего ожидать при начинании с проектов. В основном мой совет обычно:

• Начните с Readme ! Другие сопровождающие хотят, чтобы вы прочитали это первым, прежде чем испачкать руки;
• Далее: Package.json : Посмотрите, какие инструкции сценария есть для установки, разработки, тестирования и здания.
• Давай доберемся до этого! SRC : Посмотрите, как организована эта папка, вероятно, вы начнете распознавать здесь вещи и получите обстанов, как добиться цели.

Я знаю, что эти инструкции звучат почти явно прямо, но как часто у меня за столом кто -то спрашивал, как запустить проект, где я отвечал … Вы читали Readme?

Некоторым последующим наблюдением может быть репозиторий, в котором содержится много этих файлов с комментариями и Readme, которые могут быть направленными на сообщество усилий, чтобы объяснить, что все это делает в хорошем, интерактивном способе. Дайте мне знать в комментариях, если вы хотите увидеть такую инициативу!

Оригинал: “https://dev.to/justusromijn/what-is-all-that-stuff-in-this-frontend-repo-4o02”