Skip to content

Instantly share code, notes, and snippets.

@mrezende
Last active January 29, 2018 21:49
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mrezende/59f78c082accf6ad57fcef8ded32fc28 to your computer and use it in GitHub Desktop.
Save mrezende/59f78c082accf6ad57fcef8ded32fc28 to your computer and use it in GitHub Desktop.

Exercícios de fixação

1 - Crie um projeto laravel chamado views.

cd /opt/php-verao
cp -R projetobase views

2 - Altere o arquivo routes/web.php para acrescentar a página ola.

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

+ // rota para a página ola
+ Route::get('/ola', function(){
+   return view('ola');
+ });

3 - Crie a página ola.blade.php no diretório /resources/views/.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Olá</title>
    <link rel="stylesheet" type="text/css" href="/css/app.css" />
  </head>
  <body>
    <div class="container">
      @for ($i=0; $i < 10; $i++)
          <h2>Boa noite</h2>
      @endfor
    </div>
    <script type="text/javascript" src="/js/app.js">
  </body>
</html>

Acesse a página http://localhost:8000/ola .

4 - Crie um repositório no GitHub chamado views.

5 - Faça o upload do projeto views para o GitHub. Os comandos devem ser executados a partir do diretório raiz do projeto.

git init

git add .

git commit -m "primeira página usando Blade"

git remote add origin https://github.com/<USUARIO_DO_GIT>/view.git

git push origin master

6 - Altere o arquivo routes/web.php para acrescentar o primeiro controller.

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

Route::get('/ola/', function(){

  return view('ola');
});

+ Route::get('/cursos', 'CursosController@index');

7 - Vamos criar o primeiro controller chamado CursosController.

php artisan make:controller CursosController

8 - Vamos adicionar a ação index no CursosController que foi criado no diretório app/Http/Controllers/.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class CursosController extends Controller
{
    //
+    public function index()
+    {
+      $cursos = array(
+        'Lógica de programação', 'Desenvolvimento Web com PHP',
+        'Algoritmos e estrutura de dados', 'Test Driven Development'
+      );
+
+      return view('cursos.index', compact('cursos'));
+
+    }
}

9 - Criar uma pasta chamada cursos dentro do diretório /resources/views.

10 - Criar a página index.blade.php dentro do diretório /resources/views/cursos/.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Cursos</title>
    <link rel="stylesheet" type="text/css" href="/css/app.css" />
  </head>
  <body>

    <div class="container">
      <div class="row">
        <div class="col-md-6 col-md-offset-3">

          <h1>Cursos</h1>

          <ul class="list-group">
            @foreach ($cursos as $curso)
              <li class="list-group-item">{{ $curso }}</li>
            @endforeach
          </ul>

        </div>
      </div>
    </div>
    <script type="text/javascript" src="/js/app.js" >
  </body>
</html>

Acesse a página http://localhost:8000/cursos

11 - Altere o arquivo routes/web.php para contemplar a url /cursos/1, por exemplo.

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

Route::get('/ola/', function(){

  return view('ola');
});

Route::get('/cursos', 'CursosController@index');

+ Route::get('/cursos/{index}','CursosController@show');

12 - Altere o arquivo /resources/views/cursos/index.blade.php para acrescentar um link de acesso aos cursos.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Cursos</title>
    <link rel="stylesheet" type="text/css" href="/css/app.css" />
  </head>
  <body>

    <div class="container">
      <div class="row">
        <div class="col-md-6 col-md-offset-3">

          <h1>Cursos</h1>

          <ul class="list-group">
            @foreach ($cursos as $curso)
+              <li class="list-group-item"><a href="/cursos/{{ $loop->index }}">{{ $curso }}</a></li>
            @endforeach
          </ul>

        </div>
      </div>
    </div>
    <script type="text/javascript" src="/js/app.js" >
  </body>
</html>

13 - Acrescente o método show no CursosController que fica no diretório /app/Http/Controllers/.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class CursosController extends Controller
{
    //
+    private $cursos = array(
+      'Lógica de programação', 'Desenvolvimento Web com PHP',
+      'Algoritmos e estrutura de dados', 'Test Driven Development'
+    );

    public function index()
    {
+      $cursos = $this->cursos;
      return view('cursos.index', compact('cursos'));
    }

+    public function show($index) {
+      $curso = $this->cursos[$index];
+      return view('cursos.show', compact('curso'));
+    }

}

14 - Crie a página show.blade.php dentro do diretório /resources/views/cursos.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Curso</title>
    <link rel="stylesheet" type="text/css" href="/css/app.css" />
  </head>
  <body>
    <div class="container">

      <div class="row">
          <div class="col-md-6 col-md-offset-3">
            <h1>{{ $curso }}</h1>
          </div>
      </div>
    </div>

    <script type="text/javascript" src="/js/app.js">
  </body>
</html>

Acesse http://localhost:8000/cursos

15 - Verifique e envie as alterações para o GitHub.

git status

git add .

git commit -m "acrescentando index e show de cursos"

git push origin master

Exercícios complementares

1 - Crie uma página que liste produtos. Os produtos devem ter nome, descrição e preço.

2 - Adicione um link na página de listagem de produtos para podermos visualizar os detalhes individualmente.

3 - Crie uma página para listagem de livros. Os livros contém título, descrição e preço.

4 - Acrescente um link na página de listagem de livros para podermos visualizar os detalhes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment