На прошлом уроке мы создали стандартное приложение через NativePHP и открыли его в браузере по адресу: http://127.0.0.1:8000/
По своей сути эта страница является обычной веб-страницей, и это нормально. Всё отображение интерфейса в NativePHP строится на HTML, CSS и JS. Теперь разберемся, как изменить этот интерфейс.
Все файлы для отображения интерфейса хранятся в папке resources в корне вашего проекта.
В моём случае полный путь выглядит так:
Открыв её, вы увидите следующие подпапки:
Папки css и js предназначены для хранения стилей и скриптов соответственно, а в папке views лежат файлы страниц на шаблонизаторе Blade PHP. В папке views можно увидеть такие файлы:
Откройте файл welcome.blade.php
Часть его содержимого выглядит так:
Узнаёте? Это и есть ваш код страницы на PHP. Попробуем немного изменить его.
Найдите блок подзаголовка:
<p class="subtitle">Your app is ready.</p>Code language: HTML, XML (xml)Дополним строку в конце:
<p class="subtitle">Your app is ready.welcome to foxdevelop.com</p>Code language: HTML, XML (xml)Сохраните файл и обновите страницу по адресу http://127.0.0.1:8000/
Вы увидите, что подзаголовок интерфейса обновился согласно нашему изменению. Попробуйте повторить это самостоятельно. NativePHP не накладывает ограничений на выбор фронтенд-технологий: вы можете использовать любые инструменты и фреймворки — Livewire, Vue, React, Svelte, HTMX и даже jQuery.
На данном уроке найдите папку resources и поэкспериментируйте с изменением файлов внутри, чтобы понять структуру фреймворка NativePHP. В дальнейшем мы подробно разберем все возможности работы с этим интерфейсом.