오늘도 개발을 하던 중 측면에 넣어둔 카카오톡 상담하기 및nav bar 상단으로 이동하는메뉴바를 특정 스크롤까지 내렸을 때,고정되어 따라 내려오는 기능을 하고 싶었다.(원래는 특정 스크롤까지 내려오면 출력되게 해 놨음)    Goo글링을 하고 열심히 했지만, 정확한 설명이 안돼서 찾지 못하다가Sticky라는 기능을 찾았다!그것에 대해 정리해보려고 한다!(짧으니 쓰윽보면편하다!)          1. position: sticky란?position: sticky는 특정 요소가 스크롤 중에 지정된 위치에 도달하면 그 자리에서 고정되는 CSS 속성이다.일반적인 상대적 위치와 고정된 위치의 혼합형으로, 스크롤하다가 고정될 자리를 정할 수 있는 것이 특징이다.      (나는 Styled-in-component를..

웹개발을 하던 중 우연히 알게 된 overflow (때는 바야흐로 웹을 구현하던중 공백 또는 여백이 발생해 구글링을 하며 알게 되었다..)    그때는 대충 공백을 없애주는 속성으로만 알고 있었는데 CSS를 입힐수록많은 overflow를 접하게 되어 정리해보려고 한다!   1. Overflow란 무엇인가?overflow는 요소의 크기보다 내부 콘텐츠가 더 많을 때 어떻게 처리할지를 결정하는 CSS 속성이다. 콘텐츠가 박스 밖으로 넘치는 경우 이를 어떻게 표시할지 설정할 수 있다. 주로 레이아웃을 짤 때,텍스트나 이미지 같은 요소들이 부모 요소를 벗어나는 상황을 제어하는 데 사용된다.     2. Overflow의 기본 값들overflow 속성에는 몇 가지 중요한 값들이 있다. 각각 어떻게 동작하는지 살펴..

제목을 어떻게 지어야 하나 많은 고민을 했다....근데 단순히 저런 의미가 맞는 거 같다!전체적인 웹을 디자인해놓고 보니 문득 콘텐츠가 너무 크다는 생각이 들었다(폰트, 이미지포함).그래서 단순히 마우스 휠로 축소를 해보니 괜찮은 느낌이었다.문제는 만들어놓은 양이 꽤 돼서 하나하나 고치기도 힘든 느낌이었고,단순히 전체 레이아웃을 축소하고 싶었다.... 하지만 축소시도를 해보니 viewport만 축소돼서콘텐츠는 그대로고 보이는 화면만 줄어들거나,축소되어도 css폼이나 레이아웃은 그대로 따라가지 않아서 골치가 아팠다.   이런 식으로....(gif파일의 출처는 아래 적어놨습니다)    내가 원하던 모습은 이거였다..  그러던 와중에 나를 구원해 줄transform:scale() 기능을 알게 되었다!!!!!!..

벌써 엘리스에서 교육받은 지 3달이 지나가고, 마지막 프로젝트에 돌입했다. 팀원은 다들 모르는 사이였지만, 실력자들이 있어서 동기부여가 많이 되는 중이다! 우리가 어제 pigma로 대충 와이어 프레임을 짠 뒤, 페이지 기능을 하나씩 맡아 프로젝트를 진행하기로 했다. (나는 저번과 똑같이 로그인 페이지를 맡게 되었다...) 서비스 사이트명도 팀원당 1개씩 생각해 와서 투표로 하기로 했다! 결과는, 내가 구상해 온 "모두의 펀딩 - Modu" 에서 파생된 "모두의 펀딩 - Modding(모딩)" 으로 확정되었다. (모딩이 조금 더 MZ 스럽고 친근감 있는 네이밍 같아서 만족한다!) import axios from 'axios'; import React, { useState, ChangeEvent } from..