웹 개발과 HTML & CSS & JavaScript HTML은 구조를 만드는 마크업 언어, CSS는 스타일을 담당하는 디자인 언어, JavaScript는 각 요소에 생명(상호작용)을 부여하는 역할을 담당 > 웹 사이트의 구조를 만든는 것 = HTML >웹 사이트
벌써 목요일이다.. 이틀만 참으면 사랑스러운 주말💛 요즘은 주말이여도 공부하느라 잘 못 쉬지만 그냥 기분이 좋다.。. o(≧▽≦)o .。. 오늘도 파이팅 넘치게 시작해보자아 !
어제 코드스테이츠 안에서 알게 된 사람들과 처음으로 스터디를 가져봤다 ! 그날 배운 내용을 복습하면서 다음 날 배울 내용까지 예습하는 시간을 가졌는데 진짜 다들 열정이 대단하셨다.. 🔥🔥🔥
프론트엔드 개발자라면 단순히 코드 개발하는 것을 넘어 브라우저가 어떻게 동작하는지, 어떻게 렌더링을 수행하는 지 아는 것이 굉장히 중요하다. 결국 작성한 코드는 브라우저라는 소프트웨어 프로그램 상에서 수행되기 때문에 아무리 잘 짜여진 코드라도 그 코드가 수행될 프로그램
브라우저 렌더링에서 렌더링(rendering)이란 HTML, CSS, JavaScript 등 개발자가 작성한 문서가 브라우저에서 출력되는 과정을 의미한다. 현존하는 브라우저마다 다르지만, 브라우저는 기본적으로 렌더링을 수행하는 렌더링 엔진을 가지고 있다.아래는 브라우저
반응형 웹 현대에 들어서서 이제 너무나도 많은 기기들이 출시가 되었다. 때문에 기기들의 디스플레이 종류에 반응해 그에 맞도록 적절히 UI 요소들이 배치되도록 설계하는 능력 또한 프론트엔드 엔지니어에게 요구되고 있다. 반응형 웹의 탄생 배경 과거 웹사이트들은 데스크
미디어 쿼리 CSS2.1 부터 미디어 타입으로 단말기 종류에 따라 각각 다른 스타일을 적용시키는 게 가능해졌다. 그러나 기기의 특성을 정확히 판단하기 어렵다는 단점 때문에 널리 사용되지 않았으나, CSS3부터는 이 미디어 타입을 개선하여 좀 더 구체적인 조건으로 필요
css 애니메이션은 여러 개의 css스타일을 부드럽게 전환해준다. 그 중에서도 @keyframe키워드를 활용하면 시간 순서대로 정밀하게 짜여진 애니메이션을 만들 수 있다. 키프레임을 활용하기 위해서는 우선 CSS로 키프레임 블록을 만들어야 한다.해당 방법으로 회전하는
HTML의 <canvas> 태그와 Javascript를 사용하면 다양한 그래픽 요소를 만들 수 있다.기본적인 캔버스 사용법은 캔버스 태그를 작성하는 것으로 시작한다. 캔버스는 canvas 엘리먼트를 DOM으로 조작하는 방식으로 작성되기 때문에 엘리먼트를 선택할 때
aside는 요소 주변의 콘텐츠와 접선적으로 관련되고 해당 콘텐츠와 별개로 간주될 수 있는 콘텐츠 로 구성된 페이지 섹션을 나타낸다. aside이러한 섹션은 예로는 블로그 포스트에서 포스트 1개 / 신문 기사에서 기사 하나 자체를 묶어줄 때 사용한다.섹션은 일반적으로
스크롤의 관계 없이 탑버튼, 헤더, 사이드바 등을 화면에 고정시키고 싶을때 css 의 position 속성을 사용한다. 늘 사용해왔던 것 처럼 이번에도 사이드바를 고정시키기 위해 해당 속성을 사용했지만,의도했던 대로 요소가 고정되지 않았다.해당 문제를 해결하기 위해 찾