이제 input text를 이용해서 메세지를 입력했을 때, DB에 저장하는 기능을 만듦 메세지 DB에 저장하기! Chat.vue data() { return { chatWith: null, text: '', messages: [] } }, data() 에 DB에 저장될 메세지인 text를 지정해준다. input 태그에 v-model="text"가 의미하는 것은, input의 text와 vue data()의 text를 연동시켜준다 input에서 값이 입력되면 실시간으로 vue data의 text값도 동일하게 바인딩이 된다. @keyup.enter="submit" 그리고 keyup.enter 엔터를 누르고 땟을 때, submit 메소드를 실행 submit() { if(this.text){ axios.post..
IT 공부/Laravel
created() { //axios는 아작스 리퀘스트를 쉽게 보낼 수 있도록 만들어진 패키지 //api.php에 만들어둔 Route axios.get('/api/users').then(res => { console.log(res); //this.users -> date() 안에 있는 users에 접근 //res.data.user -> 가져온 값 res의 data안에 users안에 있는 값을 가르킴 this.users = res.data.users; }).catch(error => { console.log(error); }); }, 유저목록을 가져오기위해서는 Laravel에서 제공하는 axios를 이용해서 리퀘스트를 주고 받을 수 있다. get('/api/users)를 통해서 api.php에 만들어놓은 r..
resources/js/app.js Vue.component('the-chat', require('./components/Chat.vue').default); Laravel에서 component를 보다 쉽게 사용할 수 있도록 설정이 되었다. 위의 설정되어있는 대로, 태그를 이용하면 components/chat.vue가 불러와지는 것이다. components/Chat.vue import ChatUserList from './ChatUserList'; import ChatArea from './ChatArea'; components: { ChatUserList, ChatArea } vue파일의 script문에 위와 같이 설정을하면, 다른 vue파일을 component로 불러올 수 있게 된다. 그러면 위 처럼..
저번에 실습했던 아코디언 패널을 이용해서, 게시글 작성자의 아이디를 클릭했을 때, 아코디언 패널이 나오면서 친구추가/쪽지보내기 등등 기능을 사용할 수 있도록 만들었다. 게시글을 볼 수 있는 화면이다. 우측상단에 있는 작성자의 아이디를 클릭하면 아코디언 패널이 나온다. CSS를 통해서 그래도 사람처럼 보이게 꾸며놨다. 친구추가를 누르게되면 좌측 상단에 친추성공!이라는 알람메세지가 나오게 된다. 그리고 DB에도 현재 접속중인 유저의 id와 게시글 작성한 사람의 id 정보가 저장된다. 이것을 코드로 보게되면 VIEW(resources/view/forum/show.blade.php) 著者 {{ $forum->user->name }} 친구추가 쪽지보내기 asdasd asdasd 우선 작성자를 클릭했을 때, 아코디..
구현한 게시판 사진 게시글 목록 게시글 작성 게시글 자세히 보기 URL 파싱 (web.php) Route::get('/forum', ForumController::class, 'index'); Route::get('/forum/create', ForumController::class, 'create'); Route::POST('/forum/{{ forum }}', ForumController::class, 'store'); URL주소에 따라서 어떤 작업을 할지를 파싱으로 나누어서 할당하는 역할을 한다. 위에 같은 경우에는 각 작업마다 한줄한줄 코드를 작성했지만, Route::resource('forum', ForumController::class); Laravel에서는 많이쓰는 CRUD작업에 대한 코드를..
Gmail을 이용해서 사용하는 경우! 우선 Google의 계정 설정을 만져줘야할 필요성이 있다. m.blog.naver.com/wecissoid/221387867680 구글 메일(gmail) 연동 설정방법 구글 메일을 시소이드의 프로그램과 연동하기 위해서 아래의 설정을 모두 확인해 주셔야 합니다.1. SMT... blog.naver.com Laravel .env파일 설정 MAIL_MAILER=smtp MAIL_HOST=smtp.gmail.com MAIL_PORT=587 MAIL_USERNAME=아이디 MAIL_PASSWORD=비번 MAIL_ENCRYPTION=tls MAIL_FROM_ADDRESS=null MAIL_FROM_NAME="${APP_NAME}" .env 파일 설정까지 해주면, Gmail을 이..
