uxui

TIL 47일차

TIL (Today I learned)  오늘 나는 무엇을 했나요- 최종프로젝트 문제발견- UX집중반  오늘은 어떤 것을 배웠나요- 최종프로젝트 문제 발견 오늘은 어제 다 듣지 못한 의견들을 전부 보았고,그후 일단 과정을 정리후 1차 피드백을 받으러 출발함. 피드백내용일단 문제를 발견하기 위해 여러 아이디어를 내고 그것중 몇개를 골라서 구체화 하였으면,고려해야할것은1.문제 중요성및 가치측면 2.비즈니스측면이며, 이를 위해서는 일단 시장조사와 경쟁사 분석 타겟사용자분석을 진행해야한다고 피드백을 받았다. 사실 피드백을 받기전부터 우리는 문제가 있었다. 바로 해결하고싶은문제를 발견하는 단계에서 벌써 솔루션까지 생각을 하고 그것을 기준으로 시장조사, 타겟사용자, 경쟁사분석을 한것이다.이렇게 될경우 다양한 아이디..

TIL 46일차

TIL (Today I learned)  오늘 나는 무엇을 했나요- 최종프로젝트 발제듣고 문제찾기- UX집중반  오늘은 어떤 것을 배웠나요- 최종프로젝트 발제듣고 문제찾기 오늘부터 최종프로젝트가 시작함 최종프로젝트는 MVP를 기획하고 디자인하는거임 일단 우리는 리더와 부리더를 정한후 간단하게 아이스브레이킹 후 계획설정을 하였다. 오늘은 첫날로 팀원과 상의하여서 해결하고 싶은 문제를 찾기위해 각각 의견을 내면서 진행하였다. 먼저 1차로 각자 다양한 의견을 냈다.먼저 의견을 낼때는 UXUI 솔루션만으로 해결하기 어려운 사회현상에 따른 문제보다 해결할 수 있는 문제와 검증할 수 있는 불편함을 위주로 의견을 냈다.그중 내가 낸 아이디어  소셜 미디어, 중고거래 사기,온라인 쇼핑 중 상품의 크기나 색상이 실제와 ..

- FACTS(사실, 객관) :이번 일주일 동안 있었던 일, 내가 한 일1. props,state 복습2. 리액트 숙련강의+리액트 미니과제Styled component ,  react-router-dom , useNavigate 사용법  3. UX집중반 가설과 솔루션 도출 과정에서의 디자인씽킹 - FEELINGS(느낌, 주관) : 나의 감정적인 반응, 느낌일주일동안  미니과제도하고 솔루션도출도했는데 정말 얻은것이 많은것같다- FINDINGS(배운 것) : 그 상황으로부터 내가 배운 것, 얻은 것리액트강의 + 미니과제1. Styled component 사용이유와 사용방법을 배워서 스타일을 조금 더 쉽게 줄수가 있다.그중 스타일에 조건식을 쉽게 줄수있다는것이 좋은것같다.  2.react-router-dom ..

TIL (Today I learned)  오늘 나는 무엇을 했나요- React 숙련강의- React 미니 과제- UX집중반 오늘은 어떤 것을 배웠나요-React 숙련강의미니과제에 필요한 강의가 아직 전 강의를 못들어서 일단 노션자료와 그외 검색으로 공부를 먼저 하였다. react-router-dom를 배웠다. 1.사용방법yarn add react-router-dom 터미널에 패키지설치 2.이동시킬 페이지 컴포넌트생성후 안에 내용을 채운다.ex) cafe.jsx , webtoon.jsx 3.우리가 만든 페이지 컴포넌트로 이동하게끔 컴포넌트를 만든다Router.jsx를 생성후 아래 코드 입력import React from "react";import { BrowserRouter, Route, Routes } ..

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..