전체 글
-
Social Media 만들기 - 15) create, like, update, delete comment 구현하기NODE.JS 2021. 7. 16. 18:43
먼저 인풋박스를 만들어주자. import React, { useState } from 'react' import { useDispatch, useSelector } from 'react-redux' import { createComment } from '../../_actions/commentActions' function InputComment({children,post , onReply, setOnReply}) { const [content, setContent] = useState("") const theme = useSelector(state => state.theme) const userLogin = useSelector(state => state.userLogin) const {userInfo..
-
Social Media 만들기 - 14) like, unlike post 구현하기NODE.JS 2021. 7. 13. 21:36
이제 포스트 좋아요를 누르는 것을 구현하자. postROuter.js postRouter.patch('/:id/like',auth, async(req,res)=>{ try{ const post = await Post.find({_id:req.params.id, likes:req.user.id}) if(post.length>0) return res.status(400).json({msg:'You already liked this photo.'}) const likedpost = await Post.findOneAndUpdate({_id:req.params.id},{ $push:{likes:req.user.id} },{new:true}) if(!likedpost) return res.status(400).j..
-
Social Media 만들기 - 13) update post , delete post, clipboard에 주소 복사 구현하기(Card Header)NODE.JS 2021. 7. 12. 02:09
이젠 포스트를 보여주는 헤더에서 edit post를 실행시켜보자. 먼저 edit 버튼을 누르면 status modal 이 뜨도록 설정해서 편집을 진행하자. 먼저 editstatus를 만들자. export const EDITSTATUS = 'EDITSTATUS' export const editstatusReducer = (state={}, action)=>{ switch(action.type){ case EDITSTATUS: return action.payload default: return state } } function CardHeader({post}) { const handleEditPost = () =>{ dispatch({ type:STATUS, payload:true }) dispatch({ ..
-
Social Media 만들기 - 12) get posts 가져오기NODE.JS 2021. 7. 12. 01:33
이제 홈페이지에 포스트를 가지고 와서 보여주도록 하자. 포스트를 가지고 오는 라우터를 먼저 작성해준다. (auth 미들웨어에서 req.user = user로 등록해줬다)이를 이용한다. postRouter.get('/', auth, async(req, res)=>{ try{ const user = await User.findOne({_id:req.user.id}) const posts = await Post.find({user:[...user.following, user._id]}) .sort('-createdAt') .populate("user likes", "avatar username fullname followers following") // .populate({ // path:"comments",..
-
req.body 가 undefined으로 뜰 때NODE.JS 2021. 7. 11. 00:55
첫번째로, body parser(최신 express는 포함하고 있다)설정이 되어있지 않을 가능성이 높다. 만약, 바디파서의 문제가 아니라면 위치를 잘 확인하자. 두번째로 {}와 같은 형식으로 읽지 못한다면 content-Type을 application/json으로 설정해줘야한다. http://expressjs.com/en/resources/middleware/body-parser.html Express body-parser middleware body-parser Node.js body parsing middleware. Parse incoming request bodies in a middleware before your handlers, available under the req.body proper..
-
Social Media 만들기 - 11)createPost 작성하기NODE.JS 2021. 7. 11. 00:45
post와 comment 모델을 만들어주자. const mongoose = require('mongoose') const postSchema = new mongoose.Schema({ content:String, images:{ type:Array, required:true }, likes:{ type:mongoose.Types.ObjectId, ref:'User' }, comments:{ type:mongoose.Types.ObjectId, ref:'comment' }, user:{ type:mongoose.Types.ObjectId, ref:'user' } },{timestamps:true}) const Post = mongoose.model('Post', postSchema) module.expor..
-
Social Media 만들기 - 10)Status, create post 창 만들기NODE.JS 2021. 7. 10. 19:44
home 화면에 post, status가 보이도록 설정하자 . import React from 'react' import { useSelector } from 'react-redux' import Header from '../component/Haader' import Status from '../component/Status' import Post from '../component/Post' function HomePage(props) { const userLogin = useSelector(state => state.userLogin) const userInfo = userLogin if(!userInfo){ props.history.push('/login') } return ( ) } export ..
-
Social Media 만들기 - 9) following, followers 보여주기NODE.JS 2021. 7. 10. 17:10
이제 팔로일, 팔로워를 누르면 팔로워목록이 보이도록 설정한다. profile.js import React, { useEffect, useState } from 'react' import { useDispatch, useSelector } from 'react-redux'; import { getProfileUser } from '../_actions/profileActions'; import Avatar from '../component/Avatar' import { PROFILE_GETUSER_RESET, USER_UPDATE_PROFILE_RESET } from '../_constants/profileConstants'; import Loading from '../component/Loading'; ..