В этой статье подробно описано место хранения исходного кода веб-страницы на разных этапах, включая локальную среду разработки, процесс сборки и развертывания, а также хранилище на стороне сервера. В статье систематически разбирается полный жизненный цикл исходного кода веб-страницы, от структуры папок местных разработчиков до каталога конфигурации и вывода инструмента сборки, до места развертывания и контроля версий на сервере. Кроме того, в статье также рассказывается о том, как пользователи могут просматривать исходный код веб-страницы с помощью инструментов разработчика браузера, и приводится несколько распространенных примеров именования папок с исходным кодом, которые помогут читателям лучше понять управление исходным кодом веб-страницы и доступ к ней.
Файлы исходного кода веб-страниц обычно не хранятся в определенных папках. Когда вы посещаете веб-сайт, ваш браузер отправляет запрос на сервер веб-сайта, а сервер отвечает на запрос и передает файлы HTML, CSS и JavaScript веб-страницы в ваш браузер. Эти файлы будут загружены непосредственно в память браузера, и их можно будет просмотреть с помощью инструментов разработчика браузера. В локальной среде разработки исходный код веб-страницы обычно хранится в папке, установленной разработчиком. Имена и структуры этих папок могут различаться в зависимости от проекта и предпочтений разработчика, но вы часто будете видеть такие файлы, как src. , Общие имена, такие как public.
1. Хранение исходного кода в локальной среде разработки веб-сайтов.
Когда веб-разработчики работают в локальной среде, у них есть определенная структура папок для организации файлов исходного кода веб-страницы. Эти файлы обычно включают файлы HTML, CSS, JavaScript и, возможно, файлы серверного кода, такие как сценарии PHP или Python.
HTML-файл
HTML-файлы определяют структуру и содержимое веб-страниц. В локальной среде разработки файлы HTML обычно располагаются в корневом каталоге проекта или в папке с именем /public, /views или чем-то подобным. Эти файлы имеют расширение .html.
Файлы CSS и JavaScript
Файлы CSS отвечают за стиль и макет страницы, а файлы JavaScript управляют поведением и взаимодействием страницы. Эти файлы ресурсов часто хранятся в /css, /styles, /js, /scripts и других папках, названных в честь типов ресурсов. Файлы CSS заканчиваются на .css, а файлы JavaScript обычно заканчиваются на .js.
2. Хранение исходного кода во время создания и развертывания веб-сайта.
Прежде чем веб-сайт будет развернут на сервере, он обычно проходит процесс сборки (или компиляции). Этот процесс включает в себя этапы оптимизации, такие как сжатие кода и объединение файлов, чтобы улучшить скорость и производительность загрузки веб-сайта.
Конфигурация инструмента сборки
Современная разработка веб-сайтов часто использует такие инструменты сборки, как Webpack, Gulp или Grunt, для автоматизации процесса разработки. Эти инструменты работают на основе webpack.config.js, gulpfile.js или аналогичных файлов конфигурации.
Создать выходную папку
Оптимизированные файлы, созданные в процессе сборки, обычно помещаются в папки с именами /dist (distribution), /build, /out и т. д. Файлы из этой папки будут загружены на сервер для использования в онлайн-среде.
3. Хранение исходного кода на сервере
Расположение кода, загруженного на сервер, зависит от конфигурации сервера и стратегии развертывания. Обычно файлы веб-сайта размещаются в определенных каталогах на сервере, например /www, /public_html и других папках в корневом каталоге сервера.
Настройка программного обеспечения сервера
Файлы конфигурации серверного программного обеспечения, такие как .htaccess Apache или nginx.conf Nginx, определяют, где хранятся файлы исходного кода, и инструкции о том, как сервер должен обрабатывать эти файлы.
система контроля версий
Обычной практикой является использование системы контроля версий, такой как Git, для развертывания и обновления кода на сервере. В этом случае исходный код хранится в папке, управляемой через Git.
4. Просмотрите исходный код веб-страницы с помощью инструментов разработчика.
Даже если к файлам исходного кода на сервере нет прямого доступа, пользователи все равно могут просматривать исходный код веб-страницы различными способами.
Инструменты разработчика браузера
Современные браузеры предоставляют инструменты разработчика, которые позволяют пользователям просматривать и отлаживать исходный код веб-страниц, например HTML, CSS и JavaScript. Пользователи могут получить доступ к этим инструментам, нажав F12 в своем браузере или щелкнув правой кнопкой мыши веб-страницу и выбрав «Проверить».
Посмотреть исходный код страницы
Помимо инструментов разработчика, браузеры обычно предоставляют функцию просмотра исходного кода страницы. Вы можете просмотреть исходный код HTML, щелкнув правой кнопкой мыши веб-страницу и выбрав «Просмотреть исходный код страницы».
Описание: Файлы исходного кода веб-страниц могут располагаться в разных папках в зависимости от этапов разработки, создания и развертывания. В локальной среде разработки они распределяются в соответствии с организационной структурой разработчика; в процессе сборки они могут быть оптимизированы и помещены в определенный выходной каталог, а после развертывания на сервере эти файлы обычно располагаются в каталоге веб-сайта; конфигурация сервера середина. Просмотреть исходный код развернутых веб-страниц пользователи могут сделать это с помощью инструментов, предоставляемых браузером.
1. В файловой структуре сайта исходный код веб-страницы обычно сохраняется в папке с именем «src» или «source» в корневом каталоге проекта.
Эта папка используется для хранения исходных файлов кода, необходимых для веб-разработки, включая файлы HTML, CSS и JavaScript. В этой папке вы можете создавать подпапки в соответствии с функцией или типом веб-страницы. Например, «styles» используется для хранения файлов стилей CSS, а «scripts» — для хранения файлов сценариев JavaScript.
2. Исходный код веб-страницы также можно хранить в папке с именем «public» или «www».
Это связано с тем, что многие платформы или инструменты веб-разработки автоматически создают «общедоступную» папку при создании веб-сайта для хранения статических файлов ресурсов веб-сайта (включая файлы исходного кода). Сохранив исходный код в этой папке, вы сможете легко получить доступ к веб-странице и просмотреть ее через браузер. Кроме того, для правильной работы веб-сайта провайдеры веб-хостинга обычно требуют, чтобы файлы исходного кода веб-страницы были помещены в папку «www».
3. Файлы исходного кода веб-страницы могут храниться в других настраиваемых папках в соответствии с личными или организационными предпочтениями.
Например, некоторым разработчикам нравится сохранять файлы HTML, файлы CSS и файлы JavaScript в разных папках, чтобы лучше организовывать код и управлять им. В этом случае файлы исходного кода можно поместить в папки с именами «html», «css» и «js» соответственно.
Независимо от того, в какой папке вы храните файлы исходного кода для своих веб-страниц, убедитесь, что структура файлов понятна и организована и соответствует лучшим отраслевым практикам. Это может повысить эффективность разработки и облегчить последующее обслуживание и расширение.
В целом, понимание того, где хранится исходный код веб-страницы, имеет решающее значение как для разработчиков, так и для пользователей. Разработчикам необходимо разумно организовать структуру кода, чтобы облегчить разработку и обслуживание; пользователи могут легко просматривать исходный код веб-страницы с помощью инструментов браузера, чтобы лучше понять, как работает веб-страница. Я надеюсь, что эта статья поможет читателям лучше понять управление исходным кодом веб-страниц и доступ к ним.