¡Cree su primera aplicación!
Conozca Nette Framework mientras crea un blog sencillo con comentarios. ¡Empecemos!
Tras los dos primeros capítulos tendrá su propio blog funcionando y estará listo para publicar sus estupendos artículos, aunque las funcionalidades serán bastante limitadas después de completar solo esos dos capítulos. Debería leer también los capítulos siguientes, en los que implementaremos la adición de comentarios, la edición de artículos y, por último, la protección del blog.
Este tutorial da por hecho que ha completado el documento de instalación y que ha configurado con éxito sus herramientas. También da por hecho que entiende la programación orientada a objetos en PHP.
Use PHP 8.1 o superior. La aplicación completa la encontrará en GitHub.
La página de bienvenida
Empecemos creando un proyecto nuevo en el directorio nette-blog:
composer create-project nette/web-project nette-blog
En este momento debería estar funcionando la página de bienvenida del Web Project. Pruébelo abriendo el navegador y yendo a la siguiente URL:
http://localhost/nette-blog/www/
y debería ver la página de bienvenida de Nette Framework:
La aplicación funciona y ya puede empezar a hacerle cambios.
Si tiene algún problema, pruebe estos consejos.
Contenido del Web Project
El Web Project tiene la siguiente estructura:
nette-blog/
├── app/ ← directorio de la aplicación
│ ├── Core/ ← clases básicas necesarias
│ ├── Presentation/ ← presenters, plantillas y demás
│ │ └── Home/ ← directorio del presenter Home
│ └── Bootstrap.php ← clase de arranque Bootstrap
├── assets/ ← recursos en bruto (SCSS, TypeScript, imágenes fuente)
├── bin/ ← scripts para la línea de comandos
├── config/ ← archivos de configuración
├── log/ ← registros de errores
├── temp/ ← archivos temporales, caché, …
├── vendor/ ← bibliotecas instaladas por Composer
│ └── autoload.php ← carga automática de todos los paquetes instalados
└── www/ ← carpeta pública, el único lugar accesible desde el navegador
├── assets/ ← archivos estáticos compilados (CSS, JS, imágenes, …)
└── index.php ← archivo inicial que arranca la aplicación
El directorio www/ está pensado para guardar imágenes, archivos JavaScript, estilos CSS y otros archivos
accesibles públicamente. Es el único directorio accesible directamente desde internet, así que configure el document root de su
servidor web para que apunte aquí (puede configurarlo en Apache o Nginx, pero hagámoslo más tarde, porque ahora mismo no es
crucial).
El directorio más importante para usted es app/. Aquí encontrará el archivo Bootstrap.php, que
contiene una clase que carga el framework y configura la aplicación. Activa la carga automática,
prepara el depurador y configura las rutas.
Limpieza
El Web Project contiene una página de bienvenida que eliminaremos antes de empezar a programar. Sustituya sin miedo el
contenido del archivo app/Presentation/Home/default.latte por „Hello world!“.
Tracy (el depurador)
Una herramienta extremadamente importante para el desarrollo es la herramienta de
depuración Tracy. Pruebe a introducir un error en su archivo app/Presentation/Home/HomePresenter.php (p. ej.
elimine una llave de la definición de la clase HomePresenter) y vea qué pasa. Aparecerá una página de pantalla
roja con una descripción comprensible del error.
Tracy le ayudará muchísimo a depurar errores. Fíjese también en la Tracy Bar flotante de la esquina inferior derecha de la pantalla, que muestra información importante de la ejecución.
En modo de producción, Tracy está, por supuesto, desactivada y no muestra ninguna información sensible. Todos los errores se
guardan en el directorio log/. Vamos a probarlo. En el archivo app/Bootstrap.php busque el siguiente
fragmento de código, descomente la línea y cambie el parámetro de la llamada al método a false, de modo que
quede así:
// ...
$this->configurator->setDebugMode(false);
Tras recargar la página web ya no verá la pantalla roja. En su lugar se mostrará un mensaje amable para el usuario:
Ahora mire en el directorio log/. Aquí (en el archivo exception.log) encontrará el error registrado
y también la conocida página con el mensaje de error (guardada como archivo HTML con un nombre que empieza por
exception-).
Vuelva a comentar la línea // $this->configurator->setDebugMode(false);. Tracy activa automáticamente el
modo de desarrollo en un entorno localhost y lo desactiva en los demás.
Ahora podemos arreglar el error que introdujimos y seguir construyendo nuestra aplicación.
Dar las gracias
Le enseñamos un truco que alegrará a los autores de código abierto. Puede dar fácilmente una estrella en GitHub a las bibliotecas que usa su proyecto. Basta con ejecutar:
composer thanks
¡Pruébelo!