과제를 진행하던 도중, transition을 적용하는데에 문제가 생겨서 찾아보게된 부분이다. > Visibility: hidden, display: none, opacity: 0은 모두 화면 상에서 해당 요소가 보이지 않게 하는 속성들이다. 그러나, 둘의 차이점들로 인해서 사용하는 순간이 달라진다. 1. Visibility: hidden 사용자의 눈에 보이지 않도록 하는 코드이다. 그러나, 시각적으로 존재하지 않는 것 처럼 보일 뿐, 실제로는 해당 요소의 크기를 그대로 가지고 있어서 같은 공간에 있는 다른 레이아웃들의 위치가 변경되지 않는다. 또한, 해당 요소 뒤에 있는 공간을 클릭할 수 있다. 2. display: none 또한 사용자의 눈에 보이지 않게 하는 코드이다. 시각적 뿐만 아니라 실제 레이아웃 내에서도 그 공간에 아무것도 존재하지 않았던 것으로 인식한다. DOM 트리에서는 해당 요소를 인식하고 있지만, 렌더 트리에서 렌더링 될 때 레이아웃으로써

프로젝트 주소 : https://github.com/USW-Flag-Board/FrontEnd 진행기간 : 2022.07.19 ~ 진행중 사용된 기술스택 & 라이브러리 React Redux React-Pagination Universal-Cookies axios 프로젝트 소개 수원대학교 개발 동아리 Flag에서 개발한 수원대학교 학생들이 사용할 수 있는 수원대 전용 커뮤니티 프로젝트 담당 업무 프론트엔드 팀장(프로젝트 개발 기획, 업무 분담) / 로그인, 회원가입 / 유저(프로필, 내 정보 수정) 레퍼런스 차후 작성 느낀점 차후 약식으로 작성, 회고에 다시 쓸 예정

주소 github : https://github.com/KimJunpyo/QR-code-component 프로젝트 주소 : https://kimjunpyo.github.io/QR-code-component/ 미리보기 언어 HTML5 Markup CSS custom 새로 배운 것 굳이 필요없는 div, class, id는 최대한 제거. 그림, 도형 등 객체들의 위치는 1px씩 조절하며 최대한 비슷하게 설계. css : box-shadow: 1px(왼쪽 공백) 25px(윗쪽 공백) 35px(번짐 효과) -2px(범위) hsla(220, 15%, 55%, 0.15(명암)); 느낀점 굉장히 힘들었다. 내가 배운 구문이라고는 생활코딩에서 배운