거의 한달동안의 메인프로젝트가 끝이났다. 프리플젝과 다르게 분야선택, 기획, 개발까지 모두 우리 손으로 해야했기때문에 시간이 많이 걸렸지만 그만큼 값진 시간이었다. 다음은 우리 '제 10금융' 팀의 '머니메이드'라는 서비스이다. 머니메이드는 사용자가 편리하게 자산을 조회하고, 소비를 관리할 수 있는 금융 서비스입니다. 어려운 금융 관리를 레몬에이드 같이 시원하게 해결해주고자 서비스 이름을 ‘머니메이드'로 지었다 ㅋㅋ 깃 허브 https://github.com/codestates-seb/seb44_main_010 GitHub - codestates-seb/seb44_main_010 Contribute to codestates-seb/seb44_main_010 development by creating an..
Code States 44
Pre-project 44기 삼땡오버플로우 팀 깃허브: https://github.com/codestates-seb/seb44_pre_033 노션: https://www.notion.so/codestates/f93bef9f78744dc8a362e8e58f22a005 피그마: https://www.figma.com/file/rZQ9dlYffNx9ynTCKaqPtC/pre_project_033?type=design&node-id=2%3A19&mode=design&t=94ODJ6UaRZwP6CFm-1 요약회고 1. api 명세서 (어떤 데이터가 어디에 쓰일것인지, 어떤 데이터를 어떻게 저장할건지, 어떻게 가져올지) 기획이 중요하구나... api 명세서를 자세하게 적어야 하는구나 swagger api 문서화 h..
원하는 구현기능 1. 모달창을 열고, 사용자가 입력란을 작성한다 2. 모달창의 작성 아이콘을 클릭하면 사용자 입력데이터가 새로운 메모로 화면에 업로드 된다 2번에서 2일 동안을 고민했다. 다음은 내가 시도한 방법과 결과들이다. 1. 상태를 다른 컴포넌트에서 가져오려고 useSelector 사용 (화면이 렌더링될때 초기값만 가져오고, 업데이트가 되지않았다) => 이유는 TodoItem 컴포넌트 내에서 어떤 동작을 하고, 상태를 변경해줘야 하는 경우에 useSelector로 잡아서 쓰는게 맞다. => 그런데, useSelector는 상태변화를 시키는 훅이 아니기 때문에 이 방법도 아니다 2. Redux의 reducer로 상태변화도 시켜보아도 맴돌았다 => 상태변화의 영역이 모달로 제한되는 느낌입니다 3. 부..
코드스테이츠에서 솔로프로젝트로 쇼핑몰을 만들었다 8일동안 정말 고생을 많이 했다.. 처음에 react-router를 설치할때부터 오류가 났으니,,, 한마디로 첫 프로젝트는 오류 범벅이었다 개발속도도 느렸을 뿐더러, 보기좋은 코드를 작성한 것도 아니었다. 북마크 state를 정의할 최상위컴포넌트를 잘못잡아서, 중간에 아예 컴포넌트 props 연결을 갈아엎기도 했다.. (앞으로 꼭 프로젝트 구조도를 작성해야지!) 우여곡절이 많았지만 어찌저찌 그래도 프로젝트를 완성했다. 정말 치열했던, 그리고 어려웠던 8일이었지만 그만큼 배운게 참 많다. 무엇을 배우고 깨달았는지, 그리고 앞으로의 공부방향은 어떻게 잡는게 좋을지 적어보겠다 ㅎㅎ 개발 방법 1. 요구사항들을 메모장에 적은뒤, 하루동안 개발할 기능을 적는다 2...
이번주 월요일부터 목요일까지 4일동안 '0' 에서 혼자서 쇼핑몰페이지를 만들어보았다. 실제로 해보니 왜 프로젝트 해봐야 하는지 뼈저리게 느꼈다. 알고있던 개념이라고 생각했지만 실제로 바로 코드가 안쳐져서 애먹는 경우도 많았고, 여러번 삽질을 해봐야지 그제서야 이해가 되는 경우가 많았다... 4일동안 순차적으로 어떻게 진행했는지는 다음 포스팅에서 올릴거고 (싸피 에세이 써야하니깐...ㅎ) 일단 오늘 4일차에 뭘했는지 적어보려고 한다. 일단 내가 구현한 쇼핑몰!! 5.18 (목) 1.top buttons는 재사용할 가능성이 있으니 컴포넌트로 만든다 2.상품리스트 페이지에 state를 어떻게 달지? Top buttons를 클릭할때마다 원래 state가 ‘전체’ 이던 것이, 버튼을 누를때마다 그 Top butt..
Q. UI, UX의 개념과 두 개념의 관계에 대해서 설명해 주세요. UI는 사용자 인터페이스를 의미합니다. 즉, 사용자가 애플리케이션 또는 웹사이트와 상호작용하는 방식을 디자인하는 것입니다. UI 디자인은 사용자가 더 쉽게 애플리케이션을 이해하고 사용할 수 있도록 하는 것이 목적입니다. 따라서 UI 디자인은 주로 디자인, 레이아웃, 색상, 폰트 등과 같은 시각적인 측면을 중심으로 합니다. 반면, UX는 사용자 경험을 의미합니다. UX 디자인은 사용자가 제품 또는 서비스를 사용하는 동안 느끼는 감정, 경험, 만족도 등을 고려하여 제품이나 서비스를 디자인하는 것입니다. 즉, UX 디자인은 사용자가 원하는 기능을 쉽고 간편하게 이용할 수 있도록 설계하는 것입니다. 따라서 UX 디자인은 UI 디자인뿐만 아니라 ..
일주일동안 공부한 내용은? CDD 과제 복습 + git 다루는법을 익힘 1. props와 state의 차이점 정리 props로 state를 전달할 수 있다 props는 전달해주는 매개 (state, state 변경함수, 함수, 변수 모두 전달가능) 2. React Custom Component 만들기 (자동완성, autocomplete) 전체적인 구조를 그림으로 그려보기 구조파악 3단계 3. localStorage로 만드는 최근 본 상품 저장하기 useEffect 안에 JSON.stringify와 JSON.parse 사용하기 4. Git 다루는 법 공부중 코딩애플 강의 들으면서 Git branch 만들기 Git 다양한 merge 방법 ( 3 way, fast-forward, rebase&merge, sq..
처음에 (my agora states) 파일을 봤을때 생소한 코드가 너무 많아서 어떻게 코드를 시작해야 할지 감도 잡기 힘들었다 그래서 챗 지피티에게 코드 한줄 한줄씩 물어보며 주석을 달기 시작했다 특히 어떤 개념을 이해하기 어려우면 예시도 추가적으로 물어보면서 접근했다 A와 B의 차이점을 묻는 질문도 큰 도움이 된다 내 친구 챗 gpt ...ㅎ 이번에 느낀점은 아무리 생소하고 어려운 코드라도 의사코드를 작성한다면 이해하지 못할게 없다는 것이다. 잘 모를 수록 멀뚱멀뚱 코드만 보지 말고 뭐라도 쳐야 한다!! (my agora states) const express = require('express');//express 라이브러리를 불러와, express 변수에 할당하고 const app = express..