En este segundo tutorial empezaremos a crear nuestro primer proyecto en Laravel 5. Además, comentaremos algunas diferencias con respecto a la versión anterior. ¿Estás listo? ¡Manos a la obra!
En el tutorial anterior configuramos nuestro entorno de desarrollo. Si llegaste a ese punto, significa que lo lograste o que ya lo habías configurado. Ahora, es momento de crear nuestro primer proyecto en Laravel 5. Esta vez, crearemos un sistema de notas, ¡manos a la obra!
Abrimos la terminal o CMD o gitbash, y nos direccionaremos a la carpeta htdocs. Recuerdas que yo estoy trabajando con MAMP, aunque también te enseñé a instalar XAMPP. Nos dirigimos a la carpeta htdocs. Al trabajar con MAC debo direccionarme a la carpeta htdocs con cd.
En esta carpeta procedemos a crear nuestro proyecto con la siguiente líneas
composercreate-projectlaravel/laravel “NOMBRE DEL PROYECTO”.
En este caso el nombre de proyecto será “notas”:
composercreate-projectlaravel/laravel notas
Si todo salió bien, todos los paquetes empezarán a cargarse como se muestra en la imagen anterior. Recuerda que Laravel tiene bases de Symfony . Al final deberá aparecerte lo siguiente:
¡Esto significa que todo se creó correctamente! Ahora accederemos a nuestro localhost http://localhost/notas/public/ y se nos mostrará la página de bienvenida de Laravel 5.
Creación de primera vista y rutas.
En comparación con la versión 4 de Laravel, Laravel 5 trae ya algunas vistas cargadas por default y un template de Boostrap por default.
Anteriormente, si queríamos trabajar con Boostrap, teníamos que cargar todos los assets en la carpeta public del proyecto. Ahora, en esta nueva versión, ya nos ahorraron ese paso. Claro que nunca está de más saber cómo trabaja, ya que no siempre utilizaremos Boostrap.
Abrimos el archivo de la carpeta resources ->app.blade.php Echemos una vistazo a ese archivo. Nos encontraremos con mucho código html y algunas líneas de la sintaxis de blade.
Me centraré en explicar las líneas de sintaxis de blade, y mencionaré a dónde redireccionan algunas líneas del código html.
Empecemos con las líneas html. Las más importantes son las que te direccionan a los assets de css, js y todo lo que vas a necesitar para que tu aplicación se vea bien (front). El archivo lo menciona en la siguiente línea
¿Dónde se encuentra este archivo? Pues en public/css/app.css que es una simple hoja de estilos. Recuerda que en tu carpeta public pueden ir todos tus assets de tu aplicación, por ejemplo:
Ahora vamos con las líneas de blade. En este caso tenemos pocas, pero existen varias líneas de blade que nos facilitan el trabajo. En lo personal, ¡esto me gusta! Te hablare de las siguientes:
@ifpeus es un simple if donde solo estamos diciendo que si Auth::guest() es true, muestre las líneas html, y si no, otras. No te preocupes si no sabes qué quiere decir Auth::guest() Lo explicaremos en los siguiente tutoriales, ¡así que no te desesperes!, ¡pronto llegaremos a esa parte!
Y la siguiente línea a explicar es esta
@yield(‘content’) solo hace referencia, diciendo que aquí va a ir toda la sección de contenido.
Ya explicado todo esto, vamos a al siguiente paso: direccionar a nuestra vista. Veremos cómo trabaja el archivo routes.php y en dónde se encuentra. Pues se halla en la carpeta app->http->routes.php
Lo abrimos y visualizaremos lo siguiente:
Al ingresar a http://localhost/notas/public/ , nos direcciona a la página de bienvenida. ¿Por qué? Cuando uno entra a la dirección, hace la petición al controlador que en este caso es WelcomeController y después hace la petición a index, que es una simple función dentro del controlador y este controlador se encuentra en app-> http ->controllers
¿Ya viste la función index? Esta simplemente nos retorna a una vista que en este caso es welcome y que se encuentra en resources->views
Ésta solo contendrá código html para la vista que es la de bienvenida.
¿Has visto la función construct? No te preocupes porque te la explicaré más adelante. Por ahora es todo lo que debes de saber .
En este caso, dentro del controlador WelcomeController, cambiaremos el direccionamiento de la vista welcome por home. Esta es una vista que ya es creada en la carpeta de vistas.
Ahora si ingresamos a la dirección http://localhost/notas/public/, ya no veremos la vista de bienvenida, sino esta:
Bien, hasta aquí sería todo por este segundo capítulo. Nos veremos en el siguiente tutorial. No olvides seguirme en twitter como @LugoRecillas ¡Saludos!
Ricardo Lugo
Ingeniero en Tecnologías de la información y comunicación. Full stack Development. Backend PHP.
@LugoRecillas