uxui

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 숙련강의- React 미니 과제- UX집중반 오늘은 어떤 것을 배웠나요-React 숙련강의styled componet를 배웠다 정말 간략해서 요약해보았다. 이것만 알면 개념이나 사용하는데 충분한것 같다. 순서 요약 정리 1.styled-component 정의: ${(props) => props.속성명} 형태로 props 활용. 2.props 전달: styled-component를 사용할 때 JSX에서 props를 전달.styled-component사용하는이유 css줄때 1. 조건에 따라 스타일을 바꿀수있다. 2. 고유한 클래스이름 자동생성해주어서 충돌방지해줌 3.별도의 .css파일을 생성하지 않아도 된다. 4.기존의 만들어놓은..

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 입문 2주차 마무리- UX집중반 오늘은 어떤 것을 배웠나요-React 입문 2주차 오늘은 입문2주차에서 익혀야할것들인 state와 props를 잘 이해가 안가 다시 한번 복습하는 차원으로 다시 복습을 하였다. 그래서 진짜 중요한것들은 다시 한번 적어놓고 외웠다. state 사용용도1.자주 변경될것같은곳에 사용하기2.굳이 한번 정하고 자주 변경이 안될것같으면 함수로 사용하기 state 변경방법 및 이벤트핸들러 와함께 사용방법 1.클릭시 뭔가 실행하고 싶으면 onClick={함수} 이렇게 이벤트 핸들러를 달아서 사용합니다. 2.. state를 변경하려면 state 변경함수를 꼭 이용하자state변경함수는 ( ) 안에 입력한걸로 기..

- FACTS(사실, 객관) :이번 일주일 동안 있었던 일, 내가 한 일1.리액트 입문주차에서 화살표함수,삼항연산자,모듈,props,Children,state, dom과 가상 dom 를 배웠다.2.집중반 리서치를 기반으로 핵심문제를 정의하였다. - FEELINGS(느낌, 주관) : 나의 감정적인 반응, 느낌리액트를 배우면서 잘 배우고있는지 모르겠다. 하지만 계속 해나가는중- FINDINGS(배운 것) : 그 상황으로부터 내가 배운 것, 얻은 것리액트 입문강의일주일동안 배운것을 두문장으로 요약을 해보았다. 화살표 함수: ES6에서 도입된 간결한 함수 표현식으로, function 키워드 대신 =>를 사용하며, 자신의 this를 가지지 않는다 // 일반 함수function add(a, b) { return ..

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 입문 2주차- UX집중반오늘은 어떤 것을 배웠나요-React 입문 2주차State  State는 컴포넌트 내부에서 바뀔 수 있는 값으로, UI를 동적으로 업데이트하기 위해 사용이 된다. State는 useState()라는 리액트 기능을 사용한다.const [name, setName] = useState("런천미트");  이때 name은 state의 이름이고,  setName은  state를 바꾸는 함수, "런천미트" 는 state의 처음값이다. 이때 State를 바꾸기 위해서는 setname의 함수를 변경하면 된다.setName("스팸"); // 이름을 "스팸"로 변경 다음은 버튼을 누를때 State를 변경하는 방법이다.fun..

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 입문 1주차- UX집중반오늘은 어떤 것을 배웠나요-React 입문 1주차Props Props는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달하는 방법이다. 중요한 점은:단방향으로만 흐른다. 즉, 부모 → 자식 방향으로만 데이터가 전달된다.읽기 전용이다. 자식은 부모로부터 받은 데이터를 변경하지 않는다. 예를 들어, Mother 컴포넌트가 Child 컴포넌트에 name 값을 전달하려면function Mother() { const name = '홍부인'; return ; // name을 motherName으로 전달}  Child 컴포넌트에서는 props를 사용하여 이 값을 받을 수 있다!function Child(props)..

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 입문 1주차- UX집중반오늘은 어떤 것을 배웠나요-React 입문 1주차 화살표 함수를 배웠다.먼저 사용하는 이유는 결국 더 간단하게 사용하기위해 사용하는것이다. 원래 함수 표현은 이런식으로 간략된것 없이 반환값이 필요한 경우 return까지 명시를 해야한다.const add = function(a, b) { return a + b;};console.log(add(5, 3)); // 8위에 식을 보면 상수 add를 정의하는데 그 값에 함수를 할당하는 식이다.이때 함수의 매개변수 a,b를 받고 리턴에서 a+b를 반환하는 식이다. 하지만 화살표 함수를 사용한다면// 가장 간결한 형태의 화살표 함수const add = (a, b..

프로덕트 디자이너 본캠프 WIL 9주차 - FACTS(사실, 객관) :이번 일주일 동안 있었던 일, 내가 한 일1.자바스크립트 문법 종합반 1주차를 듣고 VScode로 실제로 코딩을 배웠다.2.집중반 리서치와 피드백 토론및 튜터님 피드백으로 UX리서치에 대해 좀더 구체적으로 배웠다. - FEELINGS(느낌, 주관) : 나의 감정적인 반응, 느낌자바스크립트 기초문법을 배우면서 느낀점은 수학공식 외우면서 기초문제를 푸는것 같았음. 쉽지않음.- FINDINGS(배운 것) : 그 상황으로부터 내가 배운 것, 얻은 것 그동안 UX 리서치를 한것에 대해 다른 팀과 서로 코멘트를 달면서 토론을 하고 튜터님께서 전체적으로 피드백을 해주셨다. UX에서 리서치를 할때 리서치를 언제까지 해야하나 그러한 문제에 대해서 배웠..

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 입문 1주차 - UX집중반오늘은 어떤 것을 배웠나요 -React 입문 1주차리액트 기초에 들어가기전에 리액트 변수의 종류와 사용이유, 사용방법, 주의할 점  배웠다. 1.변수먼저 변수를 사용하는 이유는 데이터를 저장하고 관리를 하여 프로그램의 복잡성을 관리하고 재사용성 및 유지보수를 향상시키기위함이다. 이때 변수는 총 3가지로1.let2.const3.var 스코프로 분류let과 const 은 블록 스코프 변수로 선언된 블록 내에서만 접근이 가능하고var은 함수 스코프 변수로 선언된 함수 내에서 유효하다. 이것이 var을 사용 지양해야하는 이유이다.함수 스코프를 가진다는것은 함수 내부 어디에서든 접근이 가능하다는것으로 예상치 못..

TIL (Today I learned)  오늘 나는 무엇을 했나요-JAVA 스크립트 문법 종합반 1주차- UX집중반오늘은 어떤 것을 배웠나요 -JAVA 스크립트 문법 종합반 1주차 자바스크립트에는 함수라는것이 있다. 함수를 사용하는 이유는 코드의 재사용성을 높여서 효율적으로 작업을 하기 위함이다. 함수를 선언을 하고 그안에 식을 작성하고 그것을 호출하게되면 결과값을 반환하는식이다.이러한 함수안에 식을 작성할때 여러 문법과 같이 쓸수 있다. 함수의 기본적인 선언문function add(x, y) { return x + y;}console.log(add(2, 3)); // 5  조건문과 반복문이 두 문법은 자주 쓰이는 문법이다.먼저 조건문은 if, else if, else, switch가 있는데swit..

TIL (Today I learned)  오늘 나는 무엇을 했나요-JAVA 스크립트 문법 종합반 1주차- UX집중반오늘은 어떤 것을 배웠나요  -JAVA 스크립트 문법 종합반 1주차  오늘부터 자바 스크립트 문법 강의를 듣기 시작했다.자바 역사 언어 특징등을 배웠고 특징중에선 객체 지향 프로그래밍과 클라이언트측 및 서버측 모두에서 사용가능하다는 특징이 제일 머리에 남았다. 객체 지향 프로그래밍을 알기전에 절차지향부터 말하자면 절차지향은 말그대로 첫번째 일부터 순서대로 n번일까지 프로그램을 만드는것이고 객체지향은 데이터와 함수를 객체라는 그룹으로 묶어서 처리를 하는식으로 필요한 객체를 만들어서 필요할때마다 재사용할수있다!  기본문법에는 가장 기초가 변수와 상수를 배웠다.먼저 변수는 재사용하기 위한 기능이다..