웹 프론트엔드에는 어떤 세 부분이 포함되나요?

웹 프런트 엔드의 세 부분: 1. HTML 또는 XHTML 마크업 언어로 생성된 웹 페이지의 뼈대인 구조적 레이어는 문서의 구조를 구축하고 웹 페이지의 콘텐츠를 정의하는 데 사용됩니다. 2. 표현 레이어는 CSS로 생성된 웹페이지의 스타일로, 색상, 글꼴, 배경 등 문서의 표현 효과를 설정하는 데 사용됩니다. 3. 동작 레이어는 JavaScript 언어로 생성된 웹페이지의 동작이며 웹페이지의 내용을 실시간으로 업데이트할 수 있습니다. 예를 들어 서버에서 데이터를 가져와 웹페이지에 업데이트하면 다음과 같은 작업을 수행할 수 있습니다. 웹페이지가 더욱 생생해졌습니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, Dell G3 컴퓨터.

웹 프런트 엔드의 세 부분

W3C는 1994년 10월에 창설된 월드 와이드 웹 컨소시엄(World Wide Web Consortium)을 말합니다. W3C의 출현은 동일한 웹 페이지가 다른 브라우저에서 동일한 효과를 가질 수 있도록 웹 개발 표준을 사용자 정의하는 것입니다. 따라서 사용자 정의된 웹 페이지는 W3C 사양을 따라야 합니다.

W3C 표준에 따르면 웹 페이지는 주로 구조 계층(HTNL), 프레젠테이션 계층(CSS) 및 동작 계층(JavaScript)의 세 부분으로 구성됩니다.

구조적 레이어

구조적 레이어는 HTML 또는 XHTML 마크업 언어로 생성되고 문서의 구조를 구축하는 데 사용되는 페이지의 뼈대입니다.

HTML은 제목, 텍스트, 이미지 등과 같은 웹페이지의 콘텐츠를 정의하는 데 사용됩니다.

프레젠테이션 레이어

프레젠테이션 레이어는 CSS(Cascading)로 생성된 페이지 스타일입니다. 스타일 시트) 문서의 프리젠테이션 효과를 설정하는 데 사용됩니다.

CSS는 색상, 글꼴, 배경 등과 같은 웹 페이지의 모양을 제어하는 ​​데 사용됩니다.

Behavior 레이어

Behavior 레이어는 JavaScript 언어로 생성되고 사용되는 페이지의 동작입니다. 문서의 동작을 구현합니다.

JavaScript는 서버에서 데이터를 가져와 웹 페이지에 업데이트하거나 일부 태그의 스타일이나 콘텐츠를 수정하는 등 웹 페이지의 콘텐츠를 실시간으로 업데이트하는 데 사용됩니다. 웹페이지가 더욱 생생해졌습니다.

간단히 말하면 JavaScript, HTML 및 CSS가 함께 우리가 보는 웹 페이지를 구성합니다.

• HTML은 제목, 텍스트, 이미지 등과 같은 웹 페이지의 콘텐츠를 정의하는 데 사용됩니다.

• CSS; 색상, 글꼴, 배경 등과 같은 웹페이지의 모양을 제어하는 ​​데 사용됩니다.

• JavaScript는 서버에서 데이터를 가져오고 업데이트하는 등 웹페이지의 콘텐츠를 실시간으로 업데이트하는 데 사용됩니다. 웹페이지에 일부 태그 스타일이나 콘텐츠 등을 수정하여 웹페이지를 더욱 생생하게 만들 수 있습니다.

HTML은 웹 페이지를 만드는 데 사용되는 표준 마크업 언어인 HyperText Markup Language입니다. HTML은 웹 페이지의 세 가지 구성 요소 구조를 담당합니다. HTML은 태그를 사용하여 웹 페이지의 다양한 구성 요소를 식별합니다. 소위 하이퍼텍스트는 한 페이지에서 다른 페이지로 이동할 수 있게 해주는 하이퍼링크를 말합니다.

CSS는 CSS(Cascading Style Sheet)를 의미하며 스타일은 HTML 요소를 표시하는 방법을 정의하고 웹 페이지의 모양을 제어하는 ​​데 사용됩니다. CSS는 웹 페이지의 세 가지 구성 요소의 성능을 담당하며 스타일은 일반적으로 외부 .css 파일에 저장됩니다. 모든 페이지의 레이아웃과 모양을 변경하려면 간단한 CSS 문서만 편집하면 됩니다.

JavaScript는 웹 페이지의 동작을 제어하는 ​​데 사용되는 경량 프로그래밍 언어인 스크립팅 언어(줄여서 "JS")입니다. JavaScript는 웹 페이지의 세 가지 구성 요소의 동작을 담당하며 HTML 페이지의 프로그래밍 코드에 삽입될 수 있습니다. JavaScript가 HTML 페이지에 삽입되면 모든 최신 브라우저에서 실행될 수 있습니다.

HTML, CSS, JavaScript를 배우는 방법

1. html과 css의 체계적인 학습

Html과 css는 비교적 간단하지만, 그래도 체계적인 학습이 필요합니다.

2. Javascript에 대한 깊은 이해

훌륭한 프론트 엔드 프로그래머는 Javascript의 원리, 메커니즘, 기원 및 객체 기반 특성을 깊이 이해해야 합니다. 더 많은 오픈 소스 프로젝트를 읽는 것이 좋습니다. 결국 연습은 진정한 지식을 가져옵니다.

웹 프론트엔드 개발 기술은 쉬운 것부터 어려운 것까지 프로세스를 따르며, 이를 위해서는 웹 프론트엔드 개발 기술자가 기본 웹 개발 기술, 웹 사이트 성능 미화, SEO 및 서버 측에 대한 기본 지식을 능숙하게 학습해야 합니다. 반면, 개발을 지원하기 위해 다양한 도구를 능숙하고 유연하게 사용할 수 있는 것과 같은 개발자에게는 특정 요구 사항도 있습니다.

동시에 코드 유지 관리, 계층적 의미 템플릿, 구성 요소 사용 용이성 등을 대표하는 관련 지식의 기본 이론을 숙지해야 합니다. 프론트 엔드 개발 기술은 전통적인 Javascript, CSS, 기술과 Adobe RIA, Google Gears, 개념적 인터랙티브 디자인과 예술적 색채가 강한 시각 디자인 등

인터넷을 비유하자면, 브라우저에서 클라이언트 컴퓨터에 이르는 모든 것을 상대적으로 말하면 프런트엔드 기술이라고 합니다. 서버 측에 저장되는 것을 총칭하여 백엔드 기술이라고 합니다. 프론트엔드 기술에는 JavaScript, ActionScript, CSS, xHTML, Adobe AIR, Google Gears와 같은 "전통적인" 기술과 개념적 인터랙티브 디자인 및 예술적 시각적 요소가 포함됩니다. 웹 프론트엔드 개발에는 많은 직종이 있습니다. 먼저 "프론트엔드 개발 엔지니어", "선임 프론트엔드 개발 엔지니어", "프론트엔드 아키텍트"라는 세 가지 직위를 예로 들어 분석해 보겠습니다. 각자의 책임.

프론트엔드 개발 엔지니어(혹은 "웹페이지 제작", "웹페이지 제작 엔지니어에 대하여", "프론트엔드 제작 엔지니어", "웹사이트 재구축 엔지니어"), 이러한 직책의 주된 책임은 인터랙션 디자이너와 함께 일하는 것입니다. 비주얼 디자이너는 HTML과 CSS를 혁신하고 사용하여 디자인 도면을 기반으로 웹 사이트 페이지 제작을 완료하기 위해 함께 작업합니다. 이를 바탕으로 완성된 페이지에 대한 기본적인 유지관리를 수행하고 이에 따라 웹사이트의 프런트엔드 성능을 최적화하는 것이 필요합니다.

또한, 자격을 갖춘 프론트엔드 개발 엔지니어는 미학적인 측면에 대한 자신만의 인식과 예술 운영에 대한 자신만의 아이디어를 가지고 있어야 합니다. 그래야만 시각적인 협업이 잘 이루어질 수 있습니다. 일정한 미적 능력과 기본적인 미술 운용 능력을 갖추는 것은 엔지니어에게 없어서는 안 될 능력입니다. 프론트 엔드 개발 기술은 소프트웨어 엔지니어링 및 기타 분야와 같은 광범위한 영역을 포괄합니다. 프론트엔드 개발 기술을 실제로 분석할 때 인터넷을 사용하여 프론트엔드 개발 기술을 이해하고 분석할 수 있습니다. 즉, 컴퓨터가 브라우저에서 사용자 측까지 디자인을 따르는 한 이 기술은 집합적으로 사용될 수 있습니다. 백엔드 기술의 주요 내용은 서버 측에 저장해야 하는 기술입니다.

2015년 12월 5일 "광저우 인터넷 산업 인재 부족 지수(TSI) 보고서"에 제공된 정보에 따르면 프런트 엔드 개발 엔지니어는 광저우 인터넷 산업에서 가장 수요가 높은 직위가 되었습니다.

프런트엔드 개발 기술은 소프트웨어 엔지니어링 및 기타 분야 등 광범위한 영역을 포괄합니다. 프런트엔드 개발 기술을 실제로 분석할 때 인터넷을 사용하여 프런트엔드 개발 기술을 이해하고 분석할 수 있습니다. 즉, 브라우저에서 사용자 엔드 디자인까지 컴퓨터를 따라가는 한 이 기술은 될 수 있습니다. 백엔드 기술의 주요 내용은 서버 측에 저장해야 하는 기술입니다. 2015년 12월 5일 "광저우 인터넷 산업 인재 부족 지수(TSI) 보고서"에 제공된 정보에 따르면 프런트 엔드 개발 엔지니어는 광저우 인터넷 산업에서 가장 수요가 높은 직위가 되었습니다.

웹 프론트엔드 개발 업무는 더 나아가 사용자가 피드백한 정보를 바탕으로 소프트웨어 개발, 웹사이트의 유용성을 분석하고 웹사이트 프론트엔드 디자인에서 문제가 있는 부분을 최적화하는 데 중점을 둡니다. 이 과정에서 Javascript, flashactionscript3.0 및 HTML CSS 기술의 삼위일체를 통해 페이지는 최적화 후 사용자에게 더 나은 경험을 제공할 수 있습니다. 예를 들어, QQ 스페이스의 사진 열람 기능은 예전에는 사진을 촬영한 후에만 열람할 수 있었고, 웹페이지에서도 카테고리별로 열람할 수 있었습니다. 이제는 웹페이지에서 바로 사진을 열람할 수 있는 것도 프론트에서 개발한 기능 중 하나입니다. -최종 개발 엔지니어. 이 외에도 슬라이드 효과, Ajax 기술 등을 표시할 수 있는 다양한 정보 사이트가 있습니다.

웹 프런트엔드를 시작할 때 프런트엔드 아키텍처 설계와 기본 데이터 전송이 사용됩니다. 따라서 웹 프런트엔드 개발에는 이전보다 더 기본적인 프로그래밍 기술이 필요하며 웹사이트 뒷면에 대한 이해도 필요합니다. -언어를 배우세요. 오늘날의 단계에서는 프론트엔드 개발 기술이 매우 빠르게 발전하고 있어 실무자들에게 더욱 엄격한 요구 사항을 제시하는 동시에 프론트엔드 세계의 미래 방향을 명확히 하는 동시에 새로운 프론트엔드 개발 기술을 습득해야 합니다. 기술의 장점과 기능을 완벽하게 결합하기는 어렵습니다.

Xunfa 프런트 엔드 기술 제품군은 인터넷 자체에 따른 개발과 변화가 응축된 것입니다. 초기 단계에서 HTML 기술은 단순히 페이지를 표시하는 데에만 사용되며 유지 관리 및 업데이트 기능을 구현하려는 경우 큰 문제에 직면하게 됩니다. 이 글은 웹 1.0, 웹 2.0, 웹 3.0에서 웹 4.0에 이르기까지 인터넷의 미래 발전 경로를 점진적으로 분석하고 파악한다. Web1.0은 기본적인 편집이 특징이며, 웹사이트 편집자가 편집 및 처리 작업을 수행한 후 웹사이트는 사용자에게 해당 콘텐츠를 제공하고 사용자는 열람권을 행사할 수 있습니다. 웹 1.0 시대에는 3대 포털인 Sina, Sohu, NetEase가 3대 포털 역할을 했습니다.

웹 2.0, 이전 단계에서 한 단계 업그레이드되었습니다. 웹사이트와 사용자 간의 상호 작용이 강화되었습니다. 이러한 방식으로 사용자는 웹사이트의 다양한 기능 구축에 더 잘 참여할 수 있습니다. 웹사이트와 사용자 간의 양방향 소통을 통해 사용자 간의 참여 관계가 실현될 수 있습니다. 웹 1.0과 달리 웹 2.0의 상호작용성은 웹 잠재력의 핵심입니다. Web 2.0 시대에는 Blog China, Yiyou Dating, Liaison이 대표적인 대표주자가 되었습니다. 이러한 유형의 웹사이트 사용자는 자신만의 데이터 저장소를 갖고 있으며 이는 완전히 웹을 기반으로 하며 브라우저에서 모든 기능을 구현할 수 있습니다.

Microsoft가 제안한 신개념 Web3.0이 다수의 특허를 성공적으로 출원했습니다. 다양한 웹 3.0 웹사이트에서는 정보를 직접 교환하고 상호작용할 수 있으며, 동시에 제3자 정보 플랫폼도 다양한 웹사이트에서 제공하는 풍부한 정보를 통합하고 분류할 수 있습니다. Web 3.0 시스템을 사용하면 사용자는 인터넷에서 자신의 데이터를 가질 수도 있습니다. Web 2.0보다 더 발전된 점은 사용자가 이러한 데이터를 다른 웹 사이트에서 사용할 수 있다는 것입니다. 기능의 구현은 전적으로 웹을 기반으로 하며, 복잡한 시스템 프로그램에서만 수행할 수 있는 다양한 작업을 브라우저를 사용하여 간단히 완료할 수 있습니다.

다인회 만찬과 유사한 Web 4.0은 모든 사람을 하나로 연결하고 모든 사람이 소유한 리소스를 통합합니다. 모든 사람은 자신의 필요에 따라 리소스 소유자를 선택할 수 있습니다. 플랫폼은 연결 역할을 합니다. 이 플랫폼은 웹사이트가 아니라 계약입니다. 웹사이트는 계약을 둘러싼 사용자입니다. , 인류는 진정으로 수많은 웹사이트로 구성된 시대인 인터넷 시대로 진입할 수 있습니다.

웹 표준이 처음 제정되었을 때 이미 프런트엔드 개발이 연구되기 시작했지만 그 진행은 매우 느렸습니다. 자바스크립트가 점차 웹 프런트엔드 개발을 위한 성숙한 언어가 된 후에야 프런트엔드 개발은 더 큰 발전을 이루었습니다. Web 4.0의 적용과 Weibo, 블로그, 웹 게임, SNS, 비디오 웹 사이트 등의 제품이 등장하면서 사람들은 웹 페이지에 대한 요구 사항이 더욱 높아졌습니다. 따라서 디자이너는 개발 과정에서 더 많은 문제를 고려해야 합니다. 현재 웹 개발에 있어서 자바스크립트 언어는 매우 중요하며, 자바스크립트로 대표되는 현재 웹 프론트엔드 개발은 매우 빠르게 발전하고 있다.

현재 웹 프론트 엔드 개발은 다양한 사이트의 유용성 요구 사항을 충족하고 제품의 사용자 경험을 향상시키기 위해 다양한 "사용자 경험"팀이 빠르게 발전하고 있으며, 업무 분업이 뜨거운 연구 주제가 되었습니다. 예를 들어 인터랙션 디자이너, 사용자 경험 분석가, 프런트엔드 개발 엔지니어, 웹 디자이너 등은 주로 강력한 프런트엔드 애플리케이션을 설계하고 개발합니다.

웹 프런트 엔드 개발자의 경우 W3C 표준에 대한 친숙함, 웹 의미론, 성능 및 데이터 분리에 대한 깊은 이해 등 백엔드 개발(C/C++/ PHP/Java 등), 알고리즘, 데이터 구조 등 페이지 아키텍처 및 레이아웃에 익숙하며 CSS, HTML/XHTML 및 기타 웹페이지 제작 기술에 능숙하며 Ajax, Javascript 및 기타 웹 개발 기술에 능숙합니다.

기술의 발전과 함께 프론트엔드 개발 기술은 계속해서 향상될 것입니다. HTML5, CSS 4.0 및 기타 기술이 프론트엔드 개발의 주류 기술이 될 것입니다. 프론트엔드 개발에서는 항상 최신 기술에 주의를 기울이십시오.

현재 프론트엔드 개발 기술은 이제 막 성숙해졌으며 향후 몇 년 안에 해당 인재에 대한 수요가 더욱 증가할 것으로 예상됩니다. 그러나 수요가 포화되면 인재 수요의 포화는 프론트엔드 개발의 진정한 성숙을 나타내는 신호이기도 합니다. 미래에 프론트엔드 개발자는 더 넓은 개발 공간, 더 큰 도전, 더 높은 무대를 갖게 되어 사람들이 자신의 강점을 보여줄 수 있게 될 것입니다. 동시에 과학 연구자들은 계속해서 자신의 역량을 향상시키고 사용자 요구를 충족하는 더 많은 제품을 개발해야 합니다.

(학습 영상 공유: 웹 프론트엔드)

위 내용은 웹 프론트엔드에는 어떤 세 부분이 포함되나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!