# 프론트엔드

2780개의 포스트
post-thumbnail

[TIL - 2022.10.04] 컴퓨터 공학

CPU 중앙 제어 장치라고도 하며, 내부적으로 간단하게 보면 산술/논리 연산 장치, 제어 장치, 레지스터로 구성되어있다. 산술: 말 그대로 산술 연산을 수행하는 것 제어 장치: 프로그램 명령, 제어 신호를 생성해서 장치의 동작을 제어 레지스터: CPU에서 사용하는

약 5시간 전
·
0개의 댓글
·

[TIL] 22.10.04

웹 페이지 구성 언어태그(tag)를 통해 웹 페이지에 보여질 내용을 나타낸다.태그는 약속된 명령어이므로 고유한 기능을 가지고 있다.또한 속성과 값으로 부가적인 기능을 구현할 수 있으며, 이는 중첩이 가능하다.blcok 태그: 화면의 가로를 전부 차지하는 태그inline

약 11시간 전
·
0개의 댓글
·

국비 8일차

git 기초, 햄버거 메뉴 X 표시 click 변화, bootstrap 기초

약 11시간 전
·
0개의 댓글
·
post-thumbnail

Strict mode : 보다 안정적인 자바스크립트 개발 환경을 위한 Strict mode

foo 함수 내에서 선언하지 않은 변수 x 에 값 10을 할당하였다. 이때 변수 x 를 찾아야 x 에 값을 할당할 수 있기 때문에 자바스크립트 엔진은 변수 x가 어디에서 선언되었는지 스코프 체인 을 통해 검색하기 시작한다.자바스크립트 엔진은 foo 함수의 스코프에서 변

약 12시간 전
·
0개의 댓글
·
post-thumbnail

Typography : image 요소 아래에 패딩 된 여분의 공간 제거하기

컨테이너 요소로 img 요소를 래핑하면 img 요소 아래에 의도하지 않은 여분의 공간이 패딩된다.image 요소는 inline 요소이다. 다시 말해 image 요소는 텍스트 로 취급된다.위 그림과 같이 image 요소에도 디센더 가 적용되어 여분의 공간이 발생한다. 첫

약 12시간 전
·
0개의 댓글
·
post-thumbnail

Horizontal & Vertical Centering : 수평/수직 중앙 정렬

정렬 대상 요소의 부모 요소에 text-align: center;를 지정한다.정렬 대상 요소에 너비를 명시적으로 지정 하고 margin-right 와 margin-left 프로퍼티에 auto 를 지정한다. 정렬 대상 요소에 너비를 명시적으로 지정하지 않으면 너비는 fu

약 12시간 전
·
0개의 댓글
·
post-thumbnail

Flexbox Layout : 플렉스 박스 레이아웃

Flexbox는 모던 웹을 위하여 제안된 기존 layout보다 더 세련된 방식의 니즈에 부합하기 위한 CSS3의 새로운 layout 방식이다. 요소의 사이즈가 불명확하거나 동적으로 변화할 때에도 유연한 레이아웃을 실현할 수 있다. 복잡한 레이아웃이라도 적은 코드로 보다

약 12시간 전
·
0개의 댓글
·
post-thumbnail

Responsive Web Design : 반응형 레이아웃

사용자가 어떤 디바이스 로 웹사이트를 방문할 지 알 수 없다. layout 은 방문자의 화면 해상도를 고려 하여야 한다. 가로폭이 너무 큰 layout을 작성하면 작은 해상도 모니터로 방문하였을 때 가로 스크롤이 생겨서 사용이 불편할 수도 있다. 또한 스마트폰이나 태블

약 13시간 전
·
0개의 댓글
·

나혼코 9일차

ㄴㄴ

약 13시간 전
·
0개의 댓글
·
post-thumbnail

Layout : 레이아웃

웹 페이지는 style 과 layout 을 담당하는 CSS를 사용하여 layout을 구성하는 것이 바람직하다. 블록 레벨 요소들을 원하는 위치에 배열 레이아웃https://poiemaweb.com/img/layout-samples.png화면의 크기에 따라 적절

약 14시간 전
·
0개의 댓글
·
post-thumbnail

Web Font : 웹디자인 타이포그래피

웹디자인 관점에서 폰트의 선택 은 중요한 의미를 갖는다. 대부분의 정보는 텍스트와 이미지로 전달되고 아직은 텍스트가 주 를 이루기 때문에 더욱 그러하다. 이전에는 웹에서 사용할 수 있는 아름다운 한글 폰트가 적어 포토샵 등으로 로컬 폰트를 사용하여 텍스트를 이미지로 만

약 14시간 전
·
0개의 댓글
·
post-thumbnail

생초보 프론트엔드 알바 6개월을 하며

졸업을 준비하며 취업이 다급해졌다.적당한 취업처를 찾다가 지방의 한 작은 개발회사에 취업했다.경험은 많이 쌓은것 같지만..3개월 수습 강제적용식대비 없음야근 반강제편법사용(회사 쪼개기 등..)상사 욕설신입 교육 없음잘모르겠다고 물어보면 대충 구글 뒤져보라는식..소통안되

약 14시간 전
·
0개의 댓글
·
post-thumbnail

Transform : 트랜스폼

트랜지션은 CSS 스타일 변경을 부드럽게 표현하기 위해 duration(지속시간)을 부여하여 속도를 조절한다.애니메이션은 하나의 줄거리(@keyframes)를 구성하여 줄거리 내에서 세부 움직임을 시간 흐름 단위로 제어하여 요소의 움직임을 표현한다.트랜스폼(Transf

약 14시간 전
·
0개의 댓글
·
post-thumbnail

Animation : 애니메이션

애니메이션(Animation) 효과는 HTML 요소에 적용되는 CSS 스타일을 다른 CSS 스타일로 부드럽게 변화시킨다.애니메이션은 애니메이션을 나타내는 CSS 스타일과 애니메이션의 sequence를 나타내는 복수의 키프레임(@keyframes) 들로 이루어진다. tr

약 14시간 전
·
0개의 댓글
·
post-thumbnail

Transition : 트랜지션

트랜지션(transition)은 CSS 프로퍼티의 값이 변화할 때, 프로퍼티 값의 변화가 일정 시간(duration) 에 걸쳐 일어나도록 하는 것이다.div 요소는 기본 상태에서 hover 상태로 변화할 때, CSS 프로퍼티 border-radius와 backgroun

약 14시간 전
·
0개의 댓글
·
post-thumbnail

Gradient : 그라디언트

그레이디언트(Gradient)는 2가지 이상의 색상을 혼합하여 부드러운 색감의 배경 등을 생성하는 것이다.CSS3가 이 기능을 제공하기 이전에는 포토샵 등의 소프트웨어를 사용하여 그레이디언트 효과의 이미지를 제작하여 사용하였다. 그러나 이러한 방법은 이미지 다운로드 에

약 15시간 전
·
0개의 댓글
·
post-thumbnail

Shadow : 그림자

텍스트에 그림자 효과를 부여하는 프로퍼티이다.요소에 그림자 효과를 부여하는 프로퍼티이다.

약 15시간 전
·
0개의 댓글
·
post-thumbnail

Inherit & Cascading : 스타일의 상속과 적용 우선 순위

상속 이란 상위(부모, 조상) 요소에 적용된 프로퍼티를 하위(자식, 자손) 요소가 물려 받는 것을 의미한다. 상속 기능이 없다면 각 요소의 Rule set에 프로퍼티를 매번 각각 지정해야 한다. 하지만 모든 프로퍼티가 상속되는 것은 아니다. 프로퍼티 중에는 상속이 되는

약 15시간 전
·
0개의 댓글
·
post-thumbnail

패스트캠퍼스 [ 메가바이트 스쿨 ] 22.09.29 - SCSS

이번 3주차는 git과 github 위주의 수업이 이뤄졌다. 몇번씩이나 git & github을 공부해보기 위해서 강의를 찾아봤지만 너무 어렵기도 하고 우선순위가 밀려나다 보니 이번에 처음으로 제대로 수업을 들었는데 정말 너무너무너무 어렵고 아직 협업을 해 볼 기회가

약 15시간 전
·
0개의 댓글
·