![]()
● 클래스형 컴포넌트와 함수형 컴포넌트의 차이점 함수형 컴포넌트는 렌더링된 값들을 고정시킨다. 이 둘의 가장 큰 차이점은 props, state의 값들을 고정시키느냐 안시키느냐에 있습니다. App.js import { useState, useEffect } from 'react'; const App = ()=>{ const [number, setNumber] = useState(0) useEffect(()=>{ setTimeout(()=>{ console.log({number})}, 3000) }) return ( 현재 숫자는 {number} 입니다. {setNumber(number + 1)}}>1씩 올리기 ) } export default App; 함수형 컴포넌트는 componentDidUpdate 메..
![]()
● REST API가 생기게 된 배경 REST API는 왜 생기게 되었을까요? 우리가 흔히 아는 API에 URI를 적어 데이터를 요청하고 받아올 수 있었습니다. 예전에는 URI에서 동사를 사용하는 것이 일반적이었습니다. GET getUserId/1234 GET readMovie_avatar POST plzpostmypretty_blog/user/12346 위는 나쁜 예시로, 이전에는 동사와 명사를 섞어 URI를 만들었기 때문에 URI가 지저분하고 알아보기가 쉽지 않았습니다. (심각했음) 이를 보다 못한 '로이 필딩'이 REST API라는 논문을 써 발표했고, 세상에 주목받기 시작했습니다. 그렇다면 REST API란 무엇일까요? REST API에서 REST는 (Representational State Tr..
![]()
● useState useState는 여러개 쓰일 수 있다. 변경 될때마다 렌더링 된다! ● useEffect 리액트 컴포넌트가 렌더링 될 때마다 실행되는 Hook입니다. componentDidMount, componentDidUpdate 를 합친 형태라고 보아도 무방합니다. App.js import Info from './Info' const App = ()=>{ return } export default App; Info.js import { useState, useEffect } from 'react'; const Info = ()=>{ const [name, setName] = useState(''); const [nickname, setNickname] = useState(''); useEffe..
![]()
● 오늘 공부한 것 클라이언트-서버 아키텍처 서버란 말그대로 (server)이기 때문에, 클라이언트의 요청에 따라 리소스를 제공합니다. 반대로 클라이언트는 서버에게 리소스 요청을 하고, 그에 따른 응답을 받습니다. 하지만 서버에게 요청을 하지 않고, 이런 리소스를 클라이언트 자체에서 늘 가지고 있게 된다면 언제나 이 리소스를 관리해야하며, 애플리케이션을 업데이트 해야한다면 애플리케이션 자체를 늘 업데이트 해야할 것입니다. 따라서 이런 서버요청은 필수적입니다. 따라서 리소스가 존재하는 곳, 리소스를 사용하는 앱을 분리시킨 것을 2-Tier 아키텍처라고 하며 다른말로는 클라이언트-서버 아키텍처라고 합니다. 일반적을 서버는 리소스를 전달해주는 역할을 담당합니다. 리소스를 저장해두는 공간을 마련하는데 이를 ..
문제 설명 덧셈, 뺄셈 수식들이 'X [연산자] Y = Z' 형태로 들어있는 문자열 배열 quiz가 매개변수로 주어집니다. 수식이 옳다면 "O"를 틀리다면 "X"를 순서대로 담은 배열을 return하도록 solution 함수를 완성해주세요. 제한사항 연산 기호와 숫자 사이는 항상 하나의 공백이 존재합니다. 단 음수를 표시하는 마이너스 기호와 숫자 사이에는 공백이 존재하지 않습니다. 1 ≤ quiz의 길이 ≤ 10 X, Y, Z는 각각 0부터 9까지 숫자로 이루어진 정수를 의미하며, 각 숫자의 맨 앞에 마이너스 기호가 하나 있을 수 있고 이는 음수를 의미합니다. X, Y, Z는 0을 제외하고는 0으로 시작하지 않습니다. -10,000 ≤ X, Y ≤ 10,000 -20,000 ≤ Z ≤ 20,000 [연산..
문제 설명 문자열 "hello"에서 각 문자를 오른쪽으로 한 칸씩 밀고 마지막 문자는 맨 앞으로 이동시키면 "ohell"이 됩니다. 이것을 문자열을 민다고 정의한다면 문자열 A와 B가 매개변수로 주어질 때, A를 밀어서 B가 될 수 있다면 밀어야 하는 최소 횟수를 return하고 밀어서 B가 될 수 없으면 -1을 return 하도록 solution 함수를 완성해보세요. 제한사항 0
