To Do 생성 가장 중요한 핵심 기능인 To Do를 생성하는 기능 Text Form 사용자의 Text를 받아서, To Do를 제작해야하니 Text Form을 이용한다. input태그안에 사용된 Vue 문법 정리 v-model v-model은 input태그에서 사용하며, 실시간으로 양방향 바인딩이 가능하도록 해준다. 이게 무슨말이냐면, data()에서는 template에서 사용될 변수를 선언해주는 부분인데, 여기서 title이라는 변수를 v-model로 바인딩하게 되면, text form에서 글을 작성하는 동시에 그 내용을 title에 넣어주는 것이다. text form에 "안녕"이라고 적으면, title은 ''로 초기화되어있지만 양방향 바인딩으로 "안녕"이라는 값이 title에 들어간다. data() ..
IT 공부/Laravel
Vue 설치 Laravel 에서 Vue를 사용하기 위해서는 우선 npm을 이용해 설치를 해야합니다. npm install --save vue@next && npm install --save-dev vue-loader@next webpack.mix.js mix.js('resources/js/app.js', 'public/js') .vue() .postCss('resources/css/app.css', 'public/css', [ // ]); resources/js/components/ToDoList.vue // app.js import { createApp } from 'vue' import ToDoList from './components/ToDoList.vue'; const app = createApp..
전체적인 화면 간단하게 화면 구성은 상단의 Header 부분 카테고리를 변경할 수 있는 좌측의 Navbar 부분 메인 컨텐츠를 보여주는 중앙 Contents 부분 실제 Vue Components는 더욱 세부적으로 나뉘어져 있음 중요 기능 To Do 작성 새롭게 To Do를 추가할 수있는 기능 중요 관리 List 옆에 별모양을 클릭함으로써 중요 / 중요 x 처리를 할 수 있다. 그리고, 중요표시 한 것은 자동으로 List에서 자동적으로 맨위로 위치를 변경 시켜준다 . 또한, 중요 카테고리를 통해서 중요처리한 To Do만을 확인하고 관리하는 것도 가능 그룹 관리 Nav에서 그룹을 선택할 수 있음 그룹 생성이라는 버튼을 누르게 되면 Modal창이 나오게되어, 그룹을 생성할 수 있다. 상세설정 디테일 화면에서는..
Jetstream 설치하기 composer require laravel/jetstream php artisan jetstream:install inertia inertia라는 stack을 사용하겠다. 서버를 동작시키고 웹페이지로 확인해 보면, 우측상단에 Login과 Register가 생긴 것을 확인할 수 있다. Jetstream을 설치하면, 자동적으로 tailwind까지 설치되어 적용되는 것을 확인 할 수 있다. Email인증 회원가입 회원가입을 할 경우, Email을 인증해야지만 가입이 가능하도록 하기 위해서는 Jetstream의 기능을 사용하면, 쉽게 구현 할 수 있다. User.php class User extends Authenticatable implements MustVerifyEmail 우선..
방법은 유저 ID를 클릭해서 블라인드 추가를 누르면 된다. 블라인드 추가 블라인드 추가를 했을때, GET방식을 이용해서 해당 유저의 ID값을 전송한다. Route::get('/blind/{id}', [BlindController::class, 'add_blind'])->name('blind'); 그러면 설정해준 Route에 의해서 BlindController 클래스의 add_blind 함수를 동작시킨다. public function add_blind($id) { $blind_user = Blind_user::where('user_id', auth()->id())->where('target_id', $id)->first(); if($blind_user==null){ $values['user_id'] = a..
지난번에 만들어놓은 친구추가기능에서 조금 변경을 했다. 원래는 작성자의 아이디를 클릭하면 아코디언 패널이 나타나서 친구추가를 누르면 바로 친구추가가 되는 기능이었다. 이번에 변경한 점은 친구추가를 누르게되면 상대방에게 친구요청이 가게되고, 상대방이 친구요청 수락을 누르게되면 친구가되는 형식이다. Migration 생성 Schema::create('request_friends', function (Blueprint $table) { $table->id(); $table->foreignId('from'); $table->foreignId('to'); $table->foreign('from')->references('id')->on('users')->onDelete('cascade'); $table->fore..
