UI/UX 공부기록

01/07 일일 목표📝 리액트 입문 강의 듣기디자인 집중반   📖 오늘 배운 내용   useState를 importuseState는 초기값을 넣고, 배열 형태로 상태 변수와 그 상태를 업데이트하는 함수 두 가지를 반환const [count, setCount] = useState(0);에서 count는 현재 상태값을 저장하고, setCount는 그 값을 업데이트하는 함수임useState(0)에서 0은 초기값버튼을 클릭하면 setCount를 호출해서 상태를 변경가능  map 메서드 : 배열의 각 요소에 대해 주어진 함수를 호출하고, 그 결과를 새로운 배열로 반환하는 함수원본 배열은 변경하지 않고, 새로운 배열을 반환하므로 매우 유용하게 사용

01/06 일일 목표📝 리액트 입문 강의 듣기디자인 집중반   📖 오늘 배운 내용 props에서 children 이란?특별한 props로, 컴포넌트의 태그 사이에 넣은 내용을 말함.부모 컴포넌트가 자식 컴포넌트에 전달하는 "내용물"사용하면 컴포넌트 안에 재사용 가능한 틀을 만들고, 필요한 내용을 유동적으로 넣을 수 있어서 유용 children의 용도1. 레이아웃 컴포넌트공통된 레이아웃 구조를 정의하면서 안에 들어가는 내용을 유동적으로 바꾸고 싶을 때 사용   구조분해할당과 props 구조분해할당을 이용하여 무조건 props.title 을 이용하는게 아니라 props 객체에서 title만 분해해서 바로 사용할수 있음.코드가 간단해지고 props.를 반복적으로 쓰지 않아도 된다.   state란?Stat..

01/02 일일 목표📝 리액트 입문 강의 듣기디자인 집중반   📖 오늘 배운 내용 SPA : 한 페이지에서 동적으로 화면을 바꿔주는 웹 애플리케이션. 처음에 한 번 페이지를 불러오고, 이후엔 필요한 데이터만 서버에서 받아옴.새로고침 없이 화면이 전환됨. MPA : 여러 페이지로 구성된 전통적인 웹 애플리케이션. 페이지를 이동할 때마다 서버에서 새로운 HTML 파일을 받아옴.각 페이지가 독립적으로 동작.  SSR : 서버에서 HTML을 만들어서 클라이언트로 보내는 방식.사용자가 웹사이트를 요청하면, 서버에서 HTML을 미리 렌더링해 보냄.  SPA: 부드럽고 빠른 사용자 경험 (하지만 초기 로딩 느림).MPA: 전통적인 방식, SEO와 초기 로딩에 유리.SSR: 서버에서 화면을 만들어 보내는 방식, S..

12/31 일일 목표📝 리액트 입문 강의 듣기디자인 집중반   📖 오늘 배운 내용map const numbers = [1, 2, 3, 4, 5];const squared = numbers.map(주어진 함수); 화살표 함수const add = (a, b) => {   return a + b;}위의것을 줄이면const add = (a, b) => a + b;console.log(add(1, 3)); 조건 연산자(삼항연산자)조건에 따라서 형태를 간단하게 하는const score = 85;let grade = ""; if (score >= 80) {   grade = "A"}  else {   grade = "B";}const score = 85;const grade = score >= 80 ? "A" :..

12/30 일일 목표📝 리액트 입문 강의 듣기디자인 집중반   📖 오늘 배운 내용1. 객체key - value로 이루어진 값JSON(JavaScript Object Notation) const user = {         name: "르탄이",        age: 30,        isAdmin: true        printHello: () => console.log("hello"),};  점표기법(.)console.log(user.name);console.log(user.age); 괄호 표기법console.attribute = "name";console.log(user[attribute]); user.email = "e@email.com"; // 추가user.age = 31; // 수정de..