웹 프론트엔드와 웹페이지란 무엇인가

웹 프론트 엔드는 사용자에게 표시되는 웹 페이지, 즉 웹 사이트의 프런트 엔드 부분으로, 사용자가 보고 경험할 수 있는 웹 사이트의 시각적 측면, 즉 사용자가 보고 경험하는 모든 것에 관한 것입니다. 사용자가 볼 수 있는 것과 관련된 웹 브라우저에 표시되는 콘텐츠 모든 것을 보고, 만지고, 경험할 수 있습니다. 웹 페이지는 HTML 태그가 포함된 일반 텍스트 파일로 세계 곳곳의 컴퓨터에 저장될 수 있습니다. 이는 월드 와이드 웹(World Wide Web)의 페이지로, 웹 페이지는 일반적으로 이미지 파일을 사용합니다. 이미지를 제공합니다. 웹 브라우저를 통해 읽을 수 있습니다.

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

웹 프론트엔드란?

웹 프론트엔드는 사용자에게 표시되는 웹페이지, 즉 웹사이트의 프론트엔드 부분입니다.

"클라이언트"라고도 알려진 웹 프런트 엔드는 사용자가 보고 경험할 수 있는 웹 사이트의 시각적 측면, 즉 사용자가 볼 수 있는 내용을 포함하여 웹 브라우저에 표시되는 모든 내용을 의미합니다. 보고, 만지고, 경험하세요. 즉, 웹 프런트 엔드에는 웹 페이지의 구조, 웹의 시각적 모양 및 웹 수준의 상호 작용 구현이 포함됩니다.

웹 프론트엔드는 웹페이지 제작에서 진화한 이름으로 그 시대적 특성이 뚜렷합니다. 인터넷의 진화 속에서 웹페이지 제작은 웹 1.0 시대의 산물이다. 초기 웹사이트의 주요 콘텐츠는 주로 그림과 텍스트로 정적인 내용이었고, 웹사이트를 사용할 때 사용자의 행동은 주로 브라우징이었다. 인터넷 기술의 발전과 HTML5 및 CSS3의 적용으로 현대 웹 페이지는 더욱 아름다워지고 상당한 대화형 효과를 가지며 더욱 강력해졌습니다.

웹 프론트 엔드는 주로 웹 애플리케이션이나 웹 사이트에 집중되어 사용자가 상호 작용할 수 있는 인터페이스인 눈에 보이는 것을 코딩하고 구축하는 것을 목표로 합니다. 여기에는 모바일 애플리케이션 개발도 포함되며 이러한 유형의 애플리케이션의 레이아웃이나 아키텍처 생성을 담당하는 사람들은 프런트엔드 개발자입니다.

웹은 월드 와이드 웹(World Wide Web)이라고도 알려진 글로벌 광역 네트워크(Global Wide Area Network)입니다. 이는 하이퍼텍스트와 HTTP를 기반으로 하는 글로벌하고 동적인 대화형 크로스 플랫폼 분산 그래픽 정보 시스템입니다. 인터넷을 기반으로 구축된 네트워크 서비스로, 시청자가 인터넷에서 정보를 찾고 탐색할 수 있도록 그래픽적이고 접근하기 쉬운 인터페이스를 제공합니다. 문서와 하이퍼링크는 인터넷상의 정보 노드를 상호 연결된 시스템으로 구성합니다. 네트워크 구조.

프런트 엔드 웹 프로그래밍의 과제는 프런트 엔드 페이지를 구현하는 데 사용되는 도구와 기술이 빠르게 변경되므로 엔지니어는 업계가 어떻게 발전하는지(예: ECMAScript 6)에 지속적으로 주의를 기울여야 한다는 것입니다.

웹페이지를 디자인하는 목적은 사용자가 사이트를 열 때 정보가 읽기 쉽고 관련성 높은 형식으로 표시되도록 하는 것입니다. 이에 따른 문제는 이제 사용자가 웹에 액세스하기 위해 많은 수의 장치를 사용하며 이러한 장치의 화면 크기와 해상도가 다르다는 것입니다.

그래서 디자이너는 웹페이지를 디자인할 때 이러한 측면에 주의를 기울여야 합니다. 그들은 웹 페이지가 다양한 브라우저, 다양한 운영 체제 및 다양한 장치에서 올바르게 표시되는지 확인해야 하며, 이를 위해서는 엔지니어 측의 신중한 계획이 필요합니다.

웹 프론트 엔드 개발에 필요한 기술:

• 프론트 엔드 개발 기술(HTML5, JS, JSON, XHTML, CSS3)에 능숙하고, 각 기술의 관련 표준을 이해합니다.

• Ajax 비동기 마스터 프로그래밍하고 재사용 가능한 고성능 프런트엔드 구성 요소를 작성할 수 있습니다.

• OO, MVC, MVVM 등과 같은 프로그래밍 아이디어 및 프런트엔드 프레임워크에 대해 깊이 이해하고 능숙하게 사용할 수 있습니다. -엔드 프레임워크(일반적으로 사용되는 프런트엔드 프레임워크인 Vuejs, AngularJS, React, Bootstrap, QUICK UI, 모바일 터미널에는 Frozen UI, weUI, SUI, MUI, AUI가 포함됨), 해당 원리를 이해합니다(프레임워크가 많으므로 2~3개 선택) 능숙하고 깊은 이해가 있는 경우에만 주류 프레임워크)

• 웹 성능 ​​최적화, 접근성, SEO 경험 등을 잘 이해합니다. 프리젠테이션 계층과 데이터 계층의 분리 개념, 웹 의미론을 이해합니다. (구직 시 매우 유용한 보너스 포인트이기도 합니다.)

• 프런트엔드 보안 메커니즘 이해, HTTP 프로토콜 및 브라우저 캐싱 전략에 익숙함

• 일반적인 JS의 소스 코드 구현에 익숙함 개발 프레임워크(예: 프로토타입, jQuery, Mootools, Ext, Dojo, 밑줄, YUI, Kissy), 적어도 하나에 능숙함.

• 일반적인 브라우저 호환성 문제를 명확하게 이해하고 IE6/7/8/9, Firefox, Safari, Chrome과 같은 안정적인 솔루션을 보유합니다.

• 높은 미적 특성을 갖습니다. 지속적인 학습도 있습니다

웹페이지란 무엇입니까

웹페이지는 웹사이트를 구성하는 기본 요소이자 다양한 웹사이트 애플리케이션을 호스팅하는 플랫폼입니다. 쉽게 말하면 귀하의 웹 사이트는 웹 페이지로 구성되어 있으며 웹 페이지를 만들지 않고 도메인 이름과 가상 호스트만 있으면 고객은 여전히 ​​귀하의 웹 사이트에 액세스할 수 없습니다. 웹 페이지는 HTML 태그가 포함된 일반 텍스트 파일로 세상 구석구석에 있는 컴퓨터에 저장할 수 있습니다. 월드 와이드 웹의 "페이지"이며 표준 범용 언어 형식입니다. 마크업 언어) 응용 프로그램의 경우 파일 확장자는 .html 또는 .htm입니다. 웹 페이지는 일반적으로 이미지 파일을 사용하여 이미지를 제공합니다. 웹 페이지는 웹 브라우저를 통해 읽어야 합니다.

웹페이지 구성

텍스트와 그림은 웹페이지를 구성하는 가장 기본적인 두 가지 요소입니다. 간단하게 이해하면 텍스트는 웹페이지의 콘텐츠입니다. 사진은 웹페이지의 아름다움입니다. 또한 웹페이지의 요소에는 애니메이션, 음악, 프로그램 등도 포함됩니다.

웹페이지를 마우스 오른쪽 버튼으로 클릭하고 메뉴에서 "소스 파일 보기"를 선택하면 웹페이지의 실제 내용을 메모장을 통해 볼 수 있습니다. 웹페이지가 실제로는 단순한 텍스트 파일임을 알 수 있습니다. 다양한 태그를 사용하여 페이지의 텍스트, 그림, 표, 사운드 및 기타 요소(예: 글꼴, 색상, 크기)를 설명하고 브라우저는 이러한 태그를 해석하고 페이지를 생성하므로 현재 가지고 있는 그림을 얻을 수 있습니다. 보다. 소스 파일에서 사진을 볼 수 없는 이유는 무엇입니까? 웹 페이지 파일에 저장되는 것은 이미지의 링크 위치뿐이며, 이미지 파일과 웹 페이지 파일은 서로 독립적으로 저장되며 동일한 컴퓨터에 있을 수도 없습니다.

웹 페이지는 일반적으로 다음과 같은 요소를 가지고 있습니다.

텍스트 데이터 이미지 파일 애플릿(페이지 내에서 실행되는 하위 프로그램) 하이퍼링크된 웹 페이지의 합성물이 웹사이트이고, 웹사이트의 시작점은 홈페이지입니다.

(동영상 공유 학습: 웹 프론트엔드 시작하기)

위 내용은 웹 프론트엔드와 웹페이지란 무엇인가의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!