랜딩페이지 디자인 시안에 맞게 전면 수정이벤트 정보 상세내역은 크롤링이 어렵다는 판단 하에 나중에 다같이 예쁘게 가데이터를 기입할 예정createEvent 새로 API 만들어주셨다! 이걸로 행사정보 상세 내역 쓰기fetchPayment, fetchUsersCount A
추석 연휴 동안에 차트랑 씨름했다.관리자페이지 각 데이터가 들어갈 컴포넌트 구현하고 gql 연결가입자 현황 그래프 구현랜딩페이지 이미지 들어오는 포인트 수정gql연결하는데 계속 에러가 나서 내가 뭘 잘못했는지 찾느라 애먹었는데 알고보니 gql에 일자별 시간요소가 없어서
랜딩페이지 이미지에 스크롤 이벤트 적용스크롤이벤트...이전에는 이미지 등장에 시간차를 두어 스크롤에 따라 움직이는 것처럼 눈속임을 해두었는데 역시나 만족스럽지 않다는 피드백을 받았다. 나 역시도 만족스럽지 않았다...구글에서 종일 검색해보고 두가지의 라이브러리를 적용해
mui tabs 공통 컴포넌트로 빼기관리자 페이지 레이아웃 차트 라이브러리 삽질모달 모달 모달 material ui 진짜 징글징글하다. 수업때 배우지 않은 그래프 그리기, 차트 만들기 때문에 라이브러리랑 씨름중이다. 여러 라이브러리를 받아보고 적용해봤는데 가장 간결하고
mui modal 공통 컴포넌트, store에 recoilState로 빼기mui modal 디자인 커스텀운영자 페이지 차트(미완성)mui 모달 커스텀하는데 평소에 내가 하던 스타일이 안 먹어서 돌아돌아 겨우 만들었다...팀원이 우스갯소리로 모달과 1:1로 싸우는 것 같
아침부터 랜딩페이지를 만들어야한다는 생각에 마음이 몹시 무거웠다. 배운 적 없는 애니메이션 효과를 적용해야한다는 압박때문이었다. 앞으로 바쁠 예정이기 때문에 랜딩페이지를 오늘 안에 끝내야한다는 생각에 한숨이 나왔지만 조져서 안될 것은 없다. 결국 해냈다.완성하는 데까지
12시에 현직 개발자에게 피드백을 받았다. 신랄한 비판이 있었던 다른 팀에 비해서 우리가 받은 피드백은 '페이지 수가 너무 많은데 이걸 다 구현할 수가 있겠느냐. 모바일도 있고 반응형도 해야한다. 중요도에 순차를 둬서 중요한 것들 먼저 구현을 완성해나가는 것이 좋겠다.
백엔드와의 회의를 통해 와이어 프레임에서 보완해야할 부분과 제거해야하는 부분을 수정하여 업데이트했다. 분명 어제 와이어 프레임, 마이페이지에서 이메일 변경 버튼을 제거했다고 생각했다. 회의시간에 다 같이 화면을 보는데 이메일 변경 버튼이 있어서 프론트 리더님이 수정하신
하...팀프로젝트 쉽지 않다.오늘은 프로젝트 주제선정, 팀규칙 정하기, 웹 구성 페이지 리스트업, 데이터 플로우(프론트엔드) 작성, 와이어 프레임(웹, 앱) 작성을 했다. 웹 와이어 프레임 작성을 거의 마친 시점에 와이어 프레임 툴을 한 번 바꿔서 동공지진이 왔지만 반
정규 표현식은 문자열에서 특정 문자 조합을 찾기 위한 패턴이다. 예를 들면 비밀번호 입력란에서 '영문과 숫자, 특수문자를 포함한 8글자 이상의 비밀번호를 입력해주세요' 이런 문장을 보았다면 정규 표현식을 사용하여 조건을 부여했을 수도 있다. 다음은 정규 표현식을 작성하
페이지에서 뒤로가기 버튼을 누른 적이 있을 것이다. 그럼 이전 페이지로 돌아가야하고 그 화면의 주소를 복사해서 친구에게 URL을 보냈을 때 같은 화면을 받아 볼 수 있어야한다. 이런 기능을 돕는 것이 next.js 에서 제공하는 shallow routing이다.rout
메모이제이션은 '메모리에 넣기'라는 의미이고 '기억되어야 할 것'이라는 뜻을 갖고있다.메모이제이션(memoization)은 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도
HTTP(Hyper Text Transfer Protocol)란 서버/클라이언트 모델을 따라 데이터를 주고 받기 위한 프로토콜이다. http는 인터넷에서 하이퍼텍스트를 교환하기 위한 통신 규약으로 80번 포트를 사용하고 있다. 따라서 http서버가 80번 포트에서 요청
state는 리액트 컴포넌트의 변경 가능한 데이터다. 개발자가 정의내리며 객체이다. 렌더링이나 데이터 흐름에 사용되는 값만 state에 포함 시켜야한다. 불필요한 요소가 섞여 렌더링의 성능을 떨어뜨리면 안되기 때문이다. 리액트 클래스형 컴포넌트의 구조는 아래와 같다.클
리액트 컴포넌트에서 데이터를 담기 위한 상자이다.setState 함수는 state의 객체에 대한 업데이트를 실행하는 함수다. state라는 상자에 담긴 내용들은 state의 내용을 바꾸는 setState함수가 끝나면 변동사항이 반영된다.setState는 불필요한 렌더링
자바스크립트에서 가장 많이 사용되는 2가지 데이터 구조는 객체와 배열이다.객체를 사용하면 키별로 데이터 항목을 저장하는 단일 엔터티를 만들 수 있다.배열을 사용하면 데이터 항목을 정렬된 목록으로 수집할 수 있다.하지만 함수에 전달할 때 객체, 배열 전체가 아닐 수도 있