테스팅에 대해 알아보자 2023년이 끝나가는 현재 우리 생활에 많은 영향을 끼치는 것이 있었으니 그건 바로... 여기 한 20대 남성의 하루 일과가 있습니다. 더보기 경기도에 살고 있는 A씨는 출근을 위해 스마트폰 알람을 듣고 아침 6시 30분에 일어나 씻고 아침을 먹은 후에 늦지 않게 지하철에 탑승하여 강남에 있는 회사까지 이동하였습니다. 카페인 없이는 머리가 돌아가지 않는 그는 출근하며 자판기에서 캔커피를 하나 뽑아 사무실에 출근하였습니다. 중요 프로젝트에 대한 발표를 담당한 그는 전날 작성한 PPT를 이용해 무난하게 발표를 마칠 수 있었습니다. 점심으로는 분식집으로 가서 키오스크를 이용해 맛있는 돈가스를 주문해서 먹었습니다. 업무를 마치고 퇴근한 A씨는 컴퓨터를 키고 그가 가장 즐겨하는 온라인게임 ..
포트폴리오란? : 네가 할 줄 아는것을 우리한테 보여줄 수 있겠니? 그럴싸하면 사무실에 불러 줄테니 얼굴이나 보자. 그렇다. 지원자의 실력을 판단하는데 이거 만한 것이 없다. 많은 회사들은 지원자들에게 포트폴리오를 요구하지만, 나는 아직 포폴이 없다. 진작 만들었어야 했는데. 한 시가 급한 이 시점에서 무작정 시작할 수는 없으니 관련 자료를 찾아 읽고 정리를 해보았다. 필수 요소 1. 도메인 도메인을 이름이나 별명으로 설정하면 좋습니다. 구매할 수 있으면 구매하는 것도 좋습니다. 2. 자기소개 개발 철학, 목표 등을 작성하여 당신이 어떤 사람인지를 간단하게 설명합니다. 가독성이 있는 글을 쓰는것이 중요합니다. 3. 프로젝트 내가 했던 프로젝트를 볼 수 있게 만들어서 내 역량을 보여줍시다. 프로젝트 소개:..
flex-direction flexbox 레이아웃에서 flex아이템들이 배치되는 주축(main axis)의 방향을 설정하는 속성입니다. row 기본적인 flex container의 주축이 가로방향입니다. 가로로 왼쪽에서 오른쪽으로 배치됩니다. row-reverse main-axis는 가로 방향이지만, flex 아이템은 오른쪽에서 왼쪽으로 배치됩니다. column main-axis를 세로 방향으로 바꿉니다. flex 아이템은 위에서 아래로 배치됩니다. column-reverse 세로 방향으로 아래에서 위로 배치됩니다.
flex-basis Flexbox 레이아웃에서 요소의 초기 크기를 정의하는 속성입니다. 이 속성은 'flex' 컨테이너 내에서 요소의 기본 크기를 지정할 때 사용됩니다. 길이 단위를 px, % 또는 'auto'로 지정할 수 있습니다. 길이 단위를 사용하면 요소 크기를 특정 값으로 지정할 수 있으며, 'auto'를 사용하면 요소의 크기가 내용에 따라 자동으로 결정됩니다. 부모 요소의 가로 축에서 추가적인 공간이 있다면, 'flex-grow'와 'flex-shrink' 속성에 따라 크기가 조절됩니다.
flex-shrink 레이아웃에서 요소의 크기가 축소될 때 얼마나 줄어들지를 결정하는 속성 요소의 크기가 레이아웃의 크기보다 커서 레이아웃을 넘어설 때, flex-shrink를 사용하면 주어진 비율에 맞게 크기가 조절됩니다. 위의 그림에서는 요소의 크기가 레이아웃의 범위를 벗어납니다. flex-shrink: 1; 을 모든 요소에 적용하면 같은 비율로 레이아웃 범위에 맞는 크기로 축소됩니다. 각 요소들의 크기를 조정하지 일일이 조정하지 않아도 간편하게 맞출 수 있습니다. flex-shrink의 기본 값은 0이며, 숫자가 커질 수록 줄어드는 크기가 더 큽니다. 만약 비율을 다르게 하고자 한다면 각각 요소에 따로 flex-shrink를 사용해야 합니다.
Flex CSS의 'Flex'는 유연한 박스 모델을 생성하기 위해 사용되는 레이아웃 속성입니다. HTML의 여려 박스들을 쉽게 정리하기 위해 사용합니다. class container 안에 있는 모든 박스에 flex를 적용하는 코드입니다. flex-grow flexbox 레이아웃에서 유연한 크기 조절을 위해 사용되는 속성 중 하나 입니다. 이 속성은 자식 요소에 적용되며, 남은 공간을 얼마나 차지할지를 결정합니다. flex-grow 속성값은 양의 정수입니다. 값이 클수록 해당 요소가 남은 공간을 많이 차지하게 됩니다. 'flex-grow: 0;'이면 해당 요소는 남은 공간을 차지하지 않고 초기의 크기를 유지합니다. flex-grow를 사용한 예시 입니다. flex-grow 속성 값이 1이기 때문에 사용 가..