let one; one = 1; function addOne(num) { console.log(one + num) //지역스코프에서 one을 찾아보고 없으므로 전역에서 one을 찾는다. } addOne(5); // 6 function makeAdder(x) { //함수를 리턴하는 함수 이다. return function (y) { return x + y; }; } const add3 = makeAdder(3); // x값을 설정해준다. add3(2); //5 //add3에서는 여전히 makeAdder의 x에 접근할수 있다. makeAdder(3)은 은닉화하여 add3으로 밖에 //접근할수 없다. const add10 = makeAdder(10) //동일한 함수에 다른값을 넣어본다. add10(5) // ..

var name = 'mike' //var는 초기에 호이스팅되서 파일 최상단으로 호이스팅 된서 선언된다. 재선언 재할당이 가능하다. // 함수 스코프이기 떄문에 함수를 제외하고 지역적으로 선언할당 되면 전역이든 지역이든 할당된 값을 사용 가능하다. //함수 안에서 선언된것은 함수에서만 사용가능 let name = 'tom' // let은 재선언은 안되고 재할당만 가능하다. 블록스코프이기 때문에 if문 for문 함수 등에서 선언되면 //지역적으로만 쓸수 있다. const name = 'jame' //const 재선언 ,재할당 불가 블록스코프이기 때문에 이하동문 동일한 객체를 뽑아낼때 하드코딩하지 말고 서야할 붕어빵틀 function User(name, age) { // 함수명을 대문자로 쓰는게 컨벤션 //..

//전반적으로 어제 작성한 react-query버전과 전체적인 틀은 똑같다. import React, { useState } from "react"; import styled from "styled-components"; import { useDispatch } from "react-redux"; //thunk도 유즈 디스패치 사용하니까 임포트 import { __addTodo } from "../redux/mo/modules/todoSlice"; //thunk사용할때 필요한 엑스트라 리듀서인 __addTodo import { nanoid } from "nanoid"; import { AppDispatch } from "../redux/mo/store/configstore"; //앱 디스패치라고 해당 타..

타입스크립트로 한 투두리스트 리액트쿼리를 곁들인 네브를 따로 컴포넌로 만들었다. import React, { useState } from "react"; import styled from "styled-components"; // import { __addTodo } from "../redux/mo/modules/todoSlice"; import { nanoid } from "nanoid"; import { useMutation, useQueryClient } from "@tanstack/react-query"; //유즈 뮤테이션과 유즈 쿼리 클라이언트 적용 import { addTodos } from "../redux/mo/modules/queryFns"; //쿼리펑션폴더에 넣어놓은 쿼리펑션 expor..

import React from 'react'; import styled from 'styled-components'; import PinImage from '../asset/pin.png'; import {useNavigate} from 'react-router-dom'; import Button from '../components/UI/Button'; import {useDispatch, useSelector} from 'react-redux'; import {logout} from '../redux/modules/Auth'; import {getAuth} from 'firebase/auth'; import {toast} from 'react-toastify'; export default functi..

next.js13버전이다. app-router 형식이다. router방식이 프레임 워크에 내장 되어 있어 따로 react-router-dom 과 같은것들의 추가가 필요없다. src/app.폴더의 layout.jsx가 브라우저의 가장 외곽 라인을 형성하고 app폴더의 page.jsx가 layout 안쪽에 위치하게 된다. src/app 폴더의 하위폴더의 폴더명은 곧 그안에 있는 page.jsx의 주소값이 된다. 폴더명이 create라면 그 밑의 파일인 page.jsx의 주소는 http://localhost:3000/create 가 된다. create의 폴더안에 layout.jsx가 존재 한다면 최상단 app/폴더의 layout 밑에 create layout 밑에 page가 존재하게 된다. 넥스트 js의 장점..