아임파인땡큐 아임파인땡큐

오늘의 과제는 피그마 클론이었다. 우리는 네이버클론을 진행했고... 너무 어렵고 힘들었다. 🥲 페어분이 너무 잘해주셔서 감사하고...죄송했다. 열심히 만든 네이버 클론 링크 👉 https://www.figma.com/proto/1osZ63eBCxvua8HnzygWqO/Untitled?node-id=2%3A134&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=2%3A321&show-proto-sidebar=1 Figma Created with Figma www.figma.com 리액트 복습 props 컴포넌트의 속성을 의미한다. 외부에서 전달 받은 값으로, 웹 애플리케이션에서 해당 컴포넌트가 가진 속성에 해당한다. 부모 컴포넌트(상위 컴포넌트)로부터 전달받..

UI(User Interface,사용자 인터페이스)와 UX(User Experience,사용자 경험) 사람들이 컴퓨터와 상호작용하는 시스템을 의미한다. 화면상 요소 외에도 키보드, 마우스 등의 물리적 요소도 UI라고 볼 수 있다. GUI(Graphical User Interface) 사용자가 그래픽을 통해 컴퓨터와 정보를 교환하는 작업환경을 의미한다. 운영체제(윈도우, 맥OS)의 화면 혹은 애플리케이션의 화면이 있다. 보통 프론트엔드 개발자가 UI를 이야기할때는 대부분 이 GUI를 의미한다. UX는 사용자가 어떤 시스템,제품,서비스를 직간접적으로 이용하면서 느끼고 생각하는 총체적 경험을 이야기한다. 제품과 관련된 모든 요소가 UX에 영향을 준다. UX에 영향을 주는 많은 요소 중 프론트엔드 개발자에게 가..

**자기가 만들어 본 개발 프로젝트**에 대해서는 정확하게 답변할 수 있게 하기 Javascript promise의 기능과 필요한 이유 프로미스는 자바스크립트 비동기처리에 사용되는 객체입니다.(비동기처리: 특정 코드의 실행이 완료될때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성) 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다. 다만 최종 결과값을 반환하는 것이 아니라, 미래에 어떤 시점에 결과를 제공하겠다는 약속(프로미스)를 반환합니다. 대기중인 프로미스가 이행될때 프로미스의 then메서드에 의해 그 반환값을 자신의 결과값으로 하여 이행합니다. 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할때 사용합니다. 서버에서 데이터를 받아오기 전에 데..

import React, { useState } from "react"; export default function ParentComponent() { const [value, setValue] = useState("날 바꿔줘!"); const handleChangeValue = () => { setValue("보여줄게 완전히 달라진 값"); }; return ( 값은 {value} 입니다 ); } function ChildComponent({ive}) { const handleClick = () => { ive() // 이 버튼을 눌러서 부모의 상태를 바꿀 순 없을까? }; return 값 변경; }

body에 추가할 내용을 써주면 된다. 엔드포인트는 응답을 통해 받게 되는 리소스가 무엇인지를 알려주는 명확한 명사 형태로 작성하는 것이 적절합니다. **엔드포인트만 보고도 응답을 통해 받는 리소스가 무엇인지 추측할 수 있게** GET메서드는 서버의 데이터를 변화시키지 않는 요청에 사용 POST메서드는 요청마다 새로운 리소스를 생성하고, PUT메서드는 매 요청마다 같은 리소스를 반환함(멱등성) PUT은 교체, PATCH는 수정. GET 요청의 경우 body가 존재하지 않기 때문에 이를 Query Parameter를 이용하여 구현해야 합니다. GET 메서드 같은 경우는 서버의 데이터를 변화시키지 않는 요청에 사용해야 합니다. POST 메서드는 요청마다 새로운 리소스를 생성하고 PUT 메서드는 요청마다 같은..

console을 보면 알 수 있듯이, props에는 {sol:"I'm pinetree"}가 객체로 저장된다. 때문에 부모컴포넌트에서 자식컴포넌트로 props를 전달하고, 이 props가 필요한 데이터를 갖고오게 되는것 useState 사용법 const [sol,pinetree]=useState(true); 라고 하면 sol은 state을 저장하는 변수 pinetree는 state sol을 변경하는 함수, true는 초기값. 변수와 함수이름은 마음대로 설정하면됨. 컴포넌트에서 변화가 필요한 데이터는 state으로 , 변화하지않는 것은 props로 정함. 초반에 useState 이용해서 state 정의한 내용들이랑 함수 정의한 내용들. setTweets([tweet,...tweets])이 부분은 tweets..

객체 지향 프로그래밍 (Object-Oriented Programming, OOP)은 프로그래밍에서 필요한 데이터를 추상화 시켜 상태와 행위를 가진 객체로 만들고, 객체들간의 상호작용을 통해 로직을 구성하는 프로그래밍 방법이다. 이로인해 데이터와 기능을 한번에 묶어서 처리할 수 있다. 캡슐화 Encapsulation 데이터(속성)와 기능(메서드)을 하나의 단위로 묶는 것을 말한다. 구현은 숨기고,동작은 노출시키며, 느슨하게 결합하여 언제든 수정할 수 있도록 설계한다. 더 엄격한 클래스는 속성의 직접적인 접근을 막고, 설정ㅇ하는 함수(setter),불러오는 함수 (getter)를 철저하게 나누기도 함. **높은 응집도,낮은 결합도** 코드가 복잡하지 않게 만들고, 재사용성을 높임 추상화 Abstractio..

클래스ㅎㅎ... 진짜 이놈 이해가 쉽지않다. 클래스는 모 붕어빵틀... 이런걸로 비유하던데 찍어내는 틀...같은거라고 한다. 함수선언과 클래스 선언의 중요한 차이점은 함순는 정의하기전에 호출할 수 있지만, 클래스는 반드시 정의한 뒤에 사용할 수 있다. 반면 인스턴스는 붕어빵 틀로 찍어낸 붕어빵같은거란다. 이렇게 클래스를 정의해 놓고, 이런식으로 인스턴스를 만들수 있다. 즉 여기서 newNode가 인스턴스가 되는것!