2021년 4월 12일(MVC Pattern)

Ji Taek Lim·2021년 4월 14일
0

const url = require("../../models").url;

let controller = {
  get: async (req, res) => {
    const getData = await url.findAll();
    res.status(200);
    res.send(getData);
  },
  post: async (req, res) => {
    const postData = await url.create({
      url: req.body.url,
      title: "GitHub",
    });
    res.status(201);
    res.send(postData);
  },

  redirect: async (req, res) => {
    url
      .findOne({
        where: {
          id: req.params.id,
        },
      })
      .then((data) => {
        return data.update({
          visits: data.visits + 1,
        });
      })
      .then((data) => {
        res.redirect(data.url);
      });
  },
};

module.exports = controller;

이건 도대체 뭘 하는거야?

redux도 정리했고 sequelize도 공부했는데 어떻게 블로그를 써야하나.

https://www.youtube.com/watch?v=DUg2SWWK18I&t=18s

https://www.youtube.com/watch?v=pCvZtjoRq1I&t=526s

https://www.youtube.com/watch?v=LRUQfJLuPA8&t=79s

Flux로의 카툰 안내서

http://bestalign.github.io/2015/10/06/cartoon-guide-to-flux/

cake만드는걸 했는데 이걸 정리하려니까 막막하네..

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import { createStore } from "redux";

// STORE -> GLOBALIZED STATE

// ACTION INCERMENT

const increment = () => {
  return {
    type: "INCREMENT",
  };
};
const decrement = () => {
  return {
    type: "DECREMENT",
  };
};

// REDUCER HOW YOUR ACTION TRANSFORMED STATE TO ANOTHER STATE

const counter = (state = 0, action) => {
  switch (action.type) {
    case "INCREMENT":
      return state + 1;
    case "DECREMENT":
      return state - 1;
  }
};

let store = createStore(counter);

// Display it in the console
store.subscribe(() => console.log(store.getState()));

// DISPATCH EXCECUTE ACTION

store.dispatch(increment());
store.dispatch(decrement());
store.dispatch(decrement());

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById("root")
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();


export const increment = (nr) => {
  return {
    type: "INCREMENT",
    payload: nr,
  };
};
export const decrement = () => {
  return {
    type: "DECREMENT",
  };
};


const counterReducer = (state = 0, action) => {
  switch (action.type) {
    case "INCREMENT":
      return state + action.payload;
    case "DECREMENT":
      return state - 1;
    default:
      return state;
  }
};

export default counterReducer;

import counterReducer from "./counter";
import loggedReducer from "./isLogged";
import { combineReducers } from "redux";

const allReducers = combineReducers({
  counter: counterReducer,
  isLogged: loggedReducer,
});

export default allReducers;

const loggedReducer = (state = false, action) => {
  switch (action.type) {
    case "SIGN_IN":
      return !state;
    default:
      return state;
  }
};

export default loggedReducer;

import React from "react";
import { useSelector, useDispatch } from "react-redux";
import { increment, decrement } from "./actions";

이 부분이 특이했다.

function App() {
  const counter = useSelector((state) => state.counter);
  const isLogged = useSelector((state) => state.isLogged);
  const dispatch = useDispatch();
  return (
    <div className="App">
      <h1>Counter {counter}</h1>
      <button onClick={() => dispatch(increment(5))}>+</button>
      <button onClick={() => dispatch(decrement())}>-</button>

      {isLogged ? <h3>Valuable Information I shouldn't see</h3> : ""}
    </div>
  );
}

export default App;

https://velog.io/@dlrbwls0302/TIL-SequelizeShortly-mvc-%EC%BD%94%EB%93%9C-%EB%B6%84%EC%84%9Dv

Node.js Crash Course Tutorial #11 - Express Router & MVC

https://www.youtube.com/watch?v=zW_tZR0Ir3Q

Express.js Tutorial for Beginners | Learn the MVC Pattern | Build a Weather Finder App

https://www.youtube.com/watch?v=dDjzTDN3cy8

profile
임지택입니다.

0개의 댓글