박민정 / We-Shop

Go to a project
Toggle navigation Toggle navigation pinning
박민정
ed0b13aa 1 parent 8f8abaad

[feat] Edit nav bar

Inline Side-by-side
Showing 8 changed files with 0 additions and 157 deletions
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
import axios from 'axios';
import {
LOGIN_USER,
REGISTER_USER,
AUTH_USER
} from './types';
export function loginUser(logInfo) {
const request = axios.post('/api/users/login', logInfo) // logInfo를 post로 전달
.then(response => response.data); // 서버에서 받은 데이터를 request에 저장
return { // return을 통해 Reducer로 보냄
// Reducer에서 previousState, action을 이용해 nextState로 만들기 때문 :: (previousState, action) => nextState
// request를 reducer로 보내는 작업
// action은 type과 response을 넣어줘야 함
type: "LOGIN_USER",
payload: request // payroad == response
}
}
export function RegisterUser(regInfo) {
const request = axios.post('/api/users/register', regInfo) // logInfo를 post로 전달
.then(response => response.data); // 서버에서 받은 데이터를 request에 저장
return { // return을 통해 Reducer로 보냄.
// Reducer에서 previousState, action을 이용해 nextState로 만들기 때문 :: (previousState, action) => nextState
// request를 reducer로 보내는 작업
// action은 type과 response을 넣어줘야 함
type: "REGISTER_USER",
payload: request // payroad == response
}
}
export function auth() {
const request = axios.get('/api/users/auth') // logInfo를 post로 전달
.then(response => response.data); // 서버에서 받은 데이터를 request에 저장
return {
type: "AUTH_USER",
payload: request // payroad == response
}
}
\ No newline at end of file
// 사용자의 상태를 보고
// 해당 페이지에 들어갈 수 있게 할지 안할지 결정해 줌. hoc 이용.
import axios from 'axios';
import React, {useEffect} from 'react';
//import {useEffect} from 'react';
import {useDispatch} from 'react-redux';
import {auth} from '../_actions/user_action'
export default function (SpecificComponent, option, adminRoute = null){
// ㄴ option 종류
// - null 아무나 출입 가능한 페이지
// - true 로그인한 유저만 출입 가능
// - false 로그인한 유저 출입 불가능
function AuthenticationCheck(props) {
//1. backend에 request를 날려서 사용자의 상태를 확인
const dispatch = useDispatch(); // 1-1. dispatch 사용
useEffect(() => {
dispatch(auth()) // 페이지가 이동할 때마다 dispatch가 작동해서 backend에 request를 줌
.then(response => { // 받은 response
console.log(response);
// 로그인 안했다면
if(!response.payload.isAuth) {
if(option) { // 만약 위 option이 true이면 (로그인한 유저만 출입 가능한 페이지로 가게 하려면)
props.history.push('/login'); // 로그인 하게 함
}
}
// 로그인 했다면
else {
if(adminRoute && !response.payload.isAdmin) { // admin만 갈 수 있는 페이지를 admin이 false 사람이 들어가려 한다면
props.history.push('/'); // 홈페이지로 돌아가게 함
}
else {
if(option===false) {// 로그인한 유저가 출입 불가능한 곳을 가려고 한다면
props.history.push('/'); // 홈페이지로 돌아가게 함
}
}
}
})
},[])
return (
<SpecificComponent />
)
}
return AuthenticationCheck
}
\ No newline at end of file
const reportWebVitals = onPerfEntry => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';