2024 / 07 / 289월 다 돼서 정리해보는 글. 이 때 대회 임박했을때라 블로그고 뭐고 하루종일 작업만 해서 정리할수가 없었다. (대회가 8/6이었음)그래도 몇 가지 메모해둔것을 바탕으로 핵심 내용들 마저 올려보도록 하겠다.앞으로 올리는 게시글에는 날짜가 안적힐 가능성이 크다. 언제 작업한 내용인지 기억이 잘 안나기 때문이다. 아무튼 본론 시작.이 날 작업하다가 기묘한 버그를 발견하게 되었다.그것은 바로 opacity 부여시 z-index 버그가 발생한다는 것.. 예를 들어 설명하자면, 이런 상황이다.나의 상황은 다음과 같았다."추구하는 삶" 팝업창 뒷배경으로 투명도가 부여된 div를 만들었더니, 이 div보다 더 뒤에 있어야 할 "퇴근의 정석" div가 위로 올라왔다. 처음에는 뭔지도 모르고 하..

2024 / 07 / 19Footer를 만들어 페이지 아랫부분을 정돈된 느낌이 들도록 변경했다.Footer란?사이트 최하단에 있는 영역으로 보통 저작권 정보나 개인정보처리 방침, 이용약관 등 정책 페이지 링크를 두는 요소.(출처 : https://www.beusable.net/blog/?p=4391)보통 Footer와 Navbar를 합쳐서 Toolbar라고 하는듯.따라서 Footer 제작 후 새 폴더 "toolbar"를 만들고 이 안에 Footer, Navbar 컴포넌트를 이동시켰다.Footer 구조와 CSS우리 프로젝트에는 아직 Footer에 넣을 정보가 별로 없기 때문에 로고와 임시 이메일 주소와 인스타그램 아이디, 저작권 표시를 넣었다./* 틀div css*/margin-top: auto;width..

2024 / 07 / 17어제에 이어서 UI를 만들었다. 오늘은 회원가입, 마이페이지를 구성했다.구성하면서 정리해둘만한 내용들 몇 가지 작성해 보겠다.컴포넌트화와 props중복되는 요소는 컴포넌트화 시켜야 한다는 사실은 알고 있었지만, props라는 것을 제대로 알지 못해 몇 번 시행착오가 있었다. 예를 들어 다음과 같은 컴포넌트가 있다고 해보자.//InputDiv.jsxconst InputDiv = () => { return ;};export default InputDiv; 코드를 이렇게 작성한 상태에서 다음과 같이 다른 파일에서 InputDiv를 불러온 다음 placeholder를 지정해 준다면 어떻게 될까?//LoginPage.js 정답은 "아무것도 보이지 않는다" 이다. 정확히 말하자면 plac..

2024 / 07 / 16내가 맡은 부분은 로그인 및 회원가입 페이지와 내 정보를 볼 수 있는 마이페이지이다.그리고 나름 프론트 팀장(?)으로서 페이지 간 연결을 하는 역할도 맡게 되었다. 첫 번째로 사용했던 방법은 이 블로그를 참고했다. https://velog.io/@moolbum/%EC%B2%B4%ED%81%AC%ED%95%9C%EA%B2%83-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8-%EB%A0%8C%EB%8D%94%ED%95%98%EA%B8%B0 React - 버튼클릭으로 원하는 컴포넌트 렌더링하기버튼클릭으로 원하는 컴포넌트 렌더링하는 방법velog.io 그러나 이 방법은 임시로 사용했던 방법이라 잠깐 쓰다가 Router로 페이지 전환하는 방식을 택했다.개인 포트폴리오 ..

2024 / 07 / 11 하루만에 또 회의를 진행했다. 역할 분담을 적절히 한 덕에 디자인을 얼추 뽑을 수 있었다.추가로 수정할 부분들 논의 후 협업 시 필요한 컨벤션에 대해 이야기를 나눴다. 그리고 remote 세팅도 했다. 이 내용은 앞으로 자주 사용할 것 같아서 메모해 두겠다. 컨벤션 (요약)새로운 기능 만들 때는 main에서 develop 파고 체크아웃 > feature로 분기해서 체크아웃 후 작업하기 pull : upstream push : origingit remote 세팅1. 로컬 프로젝트 폴더 생성 바탕화면에 아무 폴더를 만든다. (바탕화면 아니어도 됨) 2. git init vsc로 1.에서 만든 폴더를 열고 터미널에 git init 명령어를 친다. 3. organization 레포지토..

2024 / 07 / 10주제에 맞는 아이디어를 빠르게 정하고 바로 디자인 회의에 들어갔다.아무래도 다같이 말 나누면서 하는게 좋다고 생각해서 구글밋으로 이야기해보며 진행했다.Figma 툴을 활용했고, 최대한 다양한 아이디어를 내보기 위해 브레인스토밍을 했다.과연 이 디자인은 어떻게 재탄생할지..? 바로 다음 글에서 이어진다.할 일07/11 : 21:00 회의회의 전까지 디자인 맡은 부분 마감 하고 프로젝트 기본 세팅하기 오늘의 소감디자인 완료하니 2시가 넘어버려서 피곤하다. 플젝 기본 세팅 완벽하게 못했지만 어느정도는 해놓았기 때문에 딱히 걱정은 없다.