projet1_Process Recording CMS_1

Follow the video and teacher instructions to implement a simple CMS.
Software: PHPStorm, Laragon, Google Chrome

—😄-------------😛 -------------😃-------------😄-------------😛 -------------😃-------------😛 -------------😃—

1. Create a project using laragon

Open laragon and start creating a new architecture

Create successful results

2. User authentication interface

2.1. Importing dependent packages

composer require laravel/ui

First update the ui of laravel s

Download UI to vendor/laravel/ui

2.2. Install Deployment Certification Components

php artisan ui vue --auth

2.3 Install and deploy npm deployment components

npm install && npm run dev

After successful setup, you will get both files.

2.4 Configure the database and migrate data

2.4.1. Configure the database in.env

2.4.2. Database migration to terminal

php artisan migrate

Related tables will be generated

2.5 Effect

Now the laragon home page has more registration and login functions in the upper right corner

Registration interface

Login interface

home interface after login

Initial interface after landing

3. Post and Category Management

3.1 Creating models and database migration files

3.1.1 Create Post (Background Post) and Category (Article Classification) models and migration methods, respectively

php artisan make :model Category -m
php artisan make :model Post -m

3.1.2 Change the contents (i.e. table structure) of the two migration files

Category

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateCategoriesTable extends Migration
{
    public function up()
    {
        Schema::create('categories', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->timestamps();
        });
    }
    public function down()
    {
        Schema::dropIfExists('categories');
    }
}

Article Table (Post)

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreatePostsTable extends Migration
{
    public function up()
    {
        Schema::create('posts', function (Blueprint $table) {
            $table->id();
            $table->string('title');
            $table->string('description');
            $table->text('content');
            $table->string('image');
            $table->timestamp('published_at')->nullable();
            $table->unsignedInteger('category_id');
            $table->foreign('category_id')->references('id')->on('categories')
                ->onUpdate('cascade')->onDelete('cascade');
            $table->timestamps();
        });
    }
    public function down()
    {
        Schema::dropIfExists('posts');
    }
}

3.1.3 Creating Classified Resources

Create Controller

php artisan make:controller CategoriesController --resource

Create Classified Resource Routes

/* stayWeb.phpCreate Routes Inside */
Route::resource('categories','CategoriesController');


Verify in the terminal that the route was successfully created

php artisan route:list

Adjust internal layout after login

Implement the following layout

layout code:

<body>
    <div id="app">
        <nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm">
            <div class="container">
                <a class="navbar-brand" href="{{ url('/') }}">
                    {{ config('app.name', 'Laravel') }}
                </a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <!-- Left Side Of Navbar -->
                    <ul class="navbar-nav mr-auto">

                    </ul>

                    <!-- Right Side Of Navbar -->
                    <ul class="navbar-nav ml-auto">
                        <!-- Authentication Links -->
                        @guest
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
                            </li>
                            @if (Route::has('register'))
                                <li class="nav-item">
                                    <a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
                                </li>
                            @endif
                        @else
                            <li class="nav-item dropdown">
                                <a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
                                    {{ Auth::user()->name }} <span class="caret"></span>
                                </a>

                                <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
                                    <a class="dropdown-item" href="{{ route('logout') }}"
                                       onclick="event.preventDefault();
                                                     document.getElementById('logout-form').submit();">
                                        {{ __('Logout') }}
                                    </a>

                                    <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                                        @csrf
                                    </form>
                                </div>
                            </li>
                        @endguest
                    </ul>
                </div>
            </div>
        </nav>

       <main class="py-4">
            @auth
                <div class="container">
                    <div class="row">
                        <div class="col-md-4">
                            <ul class="list-group">
                                <li class="list-group-item">
                                    <a href="">Posts</a>
                                </li>
                                <li class="list-group-item">
                                    <a href="">Categories</a>
                                </li>
                            </ul>
                        </div>
                        <div class="col-md-8">
                            @yield('content')
                        </div>
                    </div>
                </div>
            @else
                @yield('content')
            @endauth
        </main>
    </div>
</body>

Effect:

Create Category List View

1. Build in resource/view/categories Index.blade.php


2. Set the return route name in the controller

Effect:

Handle classification submissions

1. Build in resource/view/categories Create.blade.php

2. Return to view in controller

3. Perfect to create a hint when an input error occurs

4. Handle classification submissions

5. Specify code that can be post ed in the category route

6. InApp.blade.phpInclude feedback on message processing in

Effect
1.ADD View
2. After submitting, return a message

A new message was added to the database

3. Submitting NO.1 again will return an error

4. Name too short

5. Name is too long

6. Empty name

Lesson One Completed~
—😄-------------😛 -------------😃-------------😄-------------😛 -------------😃-------------😛 -------------😃—

Tags: Database PHP Laravel npm

Posted on Fri, 05 Jun 2020 09:49:10 -0700 by racer x