합니다, 개발공부📝 합니다, 개발공부📝

이제 팔로일, 팔로워를 누르면 팔로워목록이 보이도록 설정한다. 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'; ..

https://stackoverflow.com/questions/50858647/mongoerror-filter-parameter-must-be-an-object MongoError: filter parameter must be an object I am creating a rest api I have end point for Post/Movies: Request body should contain only movie title, and its presence should be validated Based on passed title, other movie details should be fe... stackoverflow.com 처음엔 오브젝트 타입으로 캐스팅하려고 이 방법도 써봤지만, 전혀 캐스팅 되..

프로필 창에 나오는 follow 버튼을 활성화 시키자. profile.js {loading&& } {error && {error}} {user?.username} { user?._id === userInfo.user._id ? setOnEdit(true)}>Edit Profile : } component>FollowBtn.js import React, { useEffect, useState } from 'react' import { useDispatch, useSelector } from 'react-redux' import { followUserProfile, unfollowUserProfile } from '../_actions/profileActions' function FollowBtn({user..

search.js 의 form 형식을 search버튼을 누르면 작동하도록 이전의 useEffect를 함수로 만들자. import React, { useEffect, useState } from 'react' import { useDispatch, useSelector } from 'react-redux' import { getDataAPI } from '../../utils/fetchData' import { GLOBALTYPES } from '../../redux/actions/globalTypes' import {Link} from 'react-router-dom' import UserCard from '../UserCard' const Search = () => { const [search, set..

이제 앞서 만들어놓은 페이지들을 만들자. pages > message.js, notify.js, discover.js를 만들어준다. profile은 pages>profile>[id].js파일을 만들어준다. 이제 만들어진 페이지들을 로그인이 되어있지 않다면 route로 이동하지 못하도록 변경할 것이다. PageRender.js만들어 놓은 것을 src>custom>폴더 안으로 옮기도록 한다. auth를 useSelector로 가지고오고, auth.token이 있다면 페이지를 렌더하도록 설정한다. (없으면 렌더 안함) import React from 'react' import { useSelector } from 'react-redux'; import {useParams} from 'react-router-d..

header를 만들고 그 안에 logout기능을 만들어보자. component>Header.js를 만들어주고 App.js에 넣어준다. {auth.token && } 여기서 로그인페이지로 가도 로그인 되어있다면 페이지 이동하도록 login.js를 수정해준다. import { useDispatch, useSelector } from 'react-redux'; import { Link , useHistory} from 'react-router-dom'; const {auth} = useSelector(state => state); const history = useHistory(); useEffect(() => { if(auth.token) history.push("/") }, [auth.token, hist..

이제 레지스터 페이지를 만들자. /register로 갔는데,만약 auth token이 있다면(로그인 했다면) history를 이용해서 "/"로 이동하도록 한다. 형식은 login과 매우 비슷하며, 여기서 userName은 저장할 때 lower로 변경해주고, 띄어쓰기는 생략해준다. import React, { useEffect, useState } from 'react' import { useDispatch, useSelector } from 'react-redux' import { useHistory , Link} from 'react-router-dom' const Register = () => { const {auth} = useSelector(state => state) const history =..

home.js파일을 pages 폴더에 만들어준다. App.js에 페이지 추가해준다. 부트스트랩의 forms에서 가져와서 login 페이지에 폼을 추가해준다. https://getbootstrap.com/docs/4.3/components/forms/ Forms Examples and usage guidelines for form control styles, layout options, and custom components for creating a wide variety of forms. getbootstrap.com import React, { useState } from 'react'; import { useDispatch } from 'react-redux'; import { Link } from..